How to deploy a create-react-app to a web host (ex. Siteground)?
Per the create-react-app
docs, you run npm run build
and basically just take the output and FTP it to your web server.
However your question is very broad -- you could automate through GitHub or some other tool, but that's really going to beg opinionated responses on StackOverflow (which isn't the right forum for those kinds of questions).
npm run build
or yarn build
Builds the app for production to the build folder
.It correctly bundles React in production mode and optimizes the build for the best performance.
npm run build
creates a build directory with a production build of your app. Set up your favorite HTTP server so that a visitor to your site is served index.html, and requests to static paths like /static/js/main.<hash>.js
are served with the contents of the /static/js/main.<hash>.js
file.
source: create-react-app
I just uploaded my create-react-app to siteground with FileZilla here is the step by step:
- Once you have it all production ready
npm run build
- Open siteGround on your browser and into myAcount section click on
go to cPanel
scroll down and findFTP Accounts
- create a new account pointing to the directory
public_html
- once created, it will appear down below and all the way to the right click on
configure FTP client
and under manual setting you've got what you need to connnect - open FileZilla and in file go to
siteManager
thennew site
host
(in filezilla) ===FTP server
(in sitiGround),port
set it as siteground port , protocol and encryption leave it as defaultLogon Type
set as normal ,user
===FTP user
(siteGround) andpassword
the one you've used to create that FTP user- click on
connect
and paste the content ofyourApp/build
(from the left side that is your PC) to (the folder at the right hand side) that is yourpublic_html in siteGround
That's it! go to your website and check, the react app should be displayed there
here is the source of this procedurehttps://www.siteground.com/tutorials/ftp/Here they use quick connect for fileZilla though, I have more than one site so siteManager is cleaner and stores your credentials for next time