i would like to know few things about how to host and upload full website include(server ,react, mysql)

Question

Finally i completed my first full project using server, client, data

i would like to know few things about how to host and upload full website include(server,react, mysql)

i so wondering how that is work, for now i understand that to upload a simple website you need a domain and to hosting, just do npm run build and upload it..., this is something that i know but, when that is not just a simple website like

when i have such as

1. server side with Node.js + express that have requests (on localhost) *probably need to change the localhost to something else but what
2. Database running with MySql
3. React app that have many request to (localhost)

how can i hosting all of them and running my website for everyone, i mean that my sql will still running, CRUD Data will update normal, and the server will still get request and send or update them to mysql data.

and if I'll want to make some change on mysql, server, client i want to change it like i change it now

Actually i'm not a FullStack developer if i don't know it... so i really interesting to understand all of that issues

i hope you guys havק An understandable answer for me, thanks and just take your time:)

Answer 1

Well, where to start hehe. There are a lot of different ways to host a web app. Heroku for example makes this process really simple.

Personally, I use Digital Ocean to host my apps. This is generally how that goes:

I have a project with a folder structure that seperates the server logic and the client logic.

Since you're using Node, you build your client with npm run build . Next make sure the dist/build folder is inside your server folder. That is the folder you are going to 'host'. On Digital Ocean, you make a new droplet (which basically is just a tiny part of a server).

You install Node , Git , Pm2 and (for example) Nginx . You clone your project from Github to the server and install all the dependencies.

You have to do a few configurations with nginx (specifying a domain name for example) to make everything work. This article goes into more detail about that.

Also, a database is frequently hosted seperately. You should read more about that.

If you have everything setup, you can just code on your project as usual. Push new updates to github, and pull in the changes on the server.

Here is another post on Stackoverflow talking about hosting MySql with react.