@richdacuban, if you clone and build this repo, it creates the HTML version of the form in
I included my clone/build process below in hopes that it clarifies this.
$ git clone https://github.com/futuregerald/react-netlify-form-file
Cloning into 'react-netlify-form-file'...
remote: Enumerating objects: 20, done.
remote: Counting objects: 100% (20/20), done.
remote: Compressing objects: 100% (20/20), done.
remote: Total 20 (delta 1), reused 16 (delta 0), pack-reused 0
Unpacking objects: 100% (20/20), done.
$ cd react-netlify-form-file/
$ yarn install
yarn install v1.17.3
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
warning "react-scripts > @email@example.com" has unmet peer dependency "typescript@*".
warning "react-scripts > @firstname.lastname@example.org" has unmet peer dependency "typescript@*".
warning "react-scripts > @typescript-eslint/eslint-plugin > @email@example.com" has unmet peer dependency "typescript@*".
warning "react-scripts > @typescript-eslint/eslint-plugin > firstname.lastname@example.org" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
[4/4] 🔨 Building fresh packages...
✨ Done in 10.04s.
$ yarn build
yarn run v1.17.3
$ react-scripts build
Creating an optimized production build...
File sizes after gzip:
45.09 KB build/static/js/2.8382b1d1.chunk.js
1.02 KB build/static/js/main.0acd8c8f.chunk.js
762 B build/static/js/runtime~main.a8a9905a.js
The project was built assuming it is hosted at the server root.
You can control this with the homepage field in your package.json.
For example, add this to build it for GitHub Pages:
"homepage" : "http://myname.github.io/myapp",
The build folder is ready to be deployed.
You may serve it with a static server:
yarn global add serve
serve -s build
Find out more about deployment here:
✨ Done in 8.76s.
$ cd public/
$ grep -irl '<form ' .
With the contents of the file
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<form name="contact" netlify method='post' enctype='multipart/form-data' action="/thank-you/">
<input type="text" name="name" />
<input type="email" name="email" />
<input type="file" id="file" name="file" multiple>
It is this HTML version of the form which is required for Netlify to create the endpoints to receive the incoming form submissions. An HTML version is always required - even if the live site doesn’t use it to submit forms.
Netlify processes the HTML version to create the endpoints to receive form submissions. This is why it must exist in the deployed site. The HTML form is the template Netlify uses for form submissions. If Netlify cannot find a ready HTML version of the form, no endpoint will be created to receive it.
If there are other questions about this, we are happy to answer.