MERN Stack deployment on Vercel and Render | Deploy node.js and React app for free

This is my way of doing things if you have any other ways you share it in the comment section below.

Deploy your Full Stack Application in just 19 minutes

Backend Deployment 🚩

Step 1 : Connect mongoDB Atlas as a database
Step 2 : Create .env file and add environment variables
Step 3 : Push your code to Github

Fronted Deployment 🚩

🎓Useful Links

Chapters
00:00 Intro to deployment
00:28 Folder structure explanation
01:20 Connect to Database to Mongo Atlas
04:00 Create .env file
07:25 push code to github
08:51 Deploy backend on render
11:14 Check if fronted is working with deployed backend
14:20 Deploy fronted on vercel
17:22 Redeploy backend when code is updated
18:19 Redeploy fronted when code is updated
19:00 Highlighting comments

Please do not forget to subscribe to my YouTube channel @SumansAcademy

[hemantvishwakarma]

Thankyou so much... I have watched more than 15 videos but was not able to deploy... But now, by your video I have deployed my first web app....Thankyou so muchh❤❤❤

[mind_blazed]

Thank you so much . i've watched lots of videos but not working . but this is really helpful and succesfully deployed

[MALLuKAPzTECHz]

Subscribed I was looking for this video

[priyaarya]

Thankyou so much you helped me alot really worked. Earlier I was getting issue when I type vercel on cli then I saw I had to do vercel init at first then it worked 😅 if anyone is getting the same issue you can solve it through this message coders 😁🤭🙏 . And thankyou mam from 2 days I was trying and searching for such type of content you posted 🤗✨

[RedZunamyBlogspotZ]

Gracias de tanto buscar al fin alguien lo explica bien.

[AbdulSamad-kbsm]

Thank you soo much, explanation is very clear and easy. thank you once again👌👌💕💕

[devmehta]

personally i can say best ever video on internet explaining how to deploy web app, crystal clear explanation but mam i have one question i have used multer for image upload and i am giving path of that in my vite.config.js file so how to deal with that while deploying app please answer mam

[hamzaazam]

im maked the three folder in my project websocket, frontend and backend. where can i upload the websocket folder on which website.

[sanketkamble]

hello. why did you deploy on two different servers? are they fast or something for node and react ?

[Uv_Yadav]

Can't we deploy frontend on render..
When i am doing so, It's saying no open http port detected

[afroz]

Hello, I followed all the steps and deployed backed but after clicking on link it says cannot get/..
Any help will be appreciated.

[thorenjp]

How can i deploy a json server api im unable to fetch api with my project after deployed on netlify 😢

[paramveer]

Thank you so much ma'am, i watched around 15 to 20 videos but nothing worked. I was very upset but now I'm so happy ❤ dher sara pyaar🙏🙏🙏🙏🙏🙏🙏🙏🙏

[csayantan]

backend and frontend separately is very wirdo idea for productions as it will publish whole data whoever hit the URL. it will be better if we can maintain these access from the application side only.

[thisaragunasekara]

Hii can i know how many applications can we deploy in this way only one web site?

[mrsecretstatus]

I have done all steps correctly but I am not to login into my application, I don’t why but I am getting loging successfully message and my cookies is storing correctly.

Can any one help me please

[djhhysf]

i have three files frontend, backend and admin panel. For admin i want to deploy it seperately or with the backend

[shashwatsingh]

At 3:19, is there any problem if we choose Compass instead of drivers ?

[mausam_]

I'm trying to access my web page and there is an error in the console:- failed to load resource: the server responded with a status of 404 actually in locally it's working fine .. pls help me

[ManpreetSingh-bkyc]

I was able to host both frontend and backend on render itself .why you host seprately?? by the way i hosted html css js express js mongo db without react website