Hi guys, so this is my third article in Hashnode, and I am excited to share with you my modest knowledge about deploying the MERN project.

1- deploy the backend project

So to deploy your backend project, there are multiple options the one I use personally is Render it's so simple and efficient platform, first of all, you have to create an account using your Github and give access to Render to your repositories, then in your dashboard, you click new and choose web service

after that, you connect the repository of your project in my case "MERNProducts"

if you didn't find your repo then go to configure account and give access to Render to that repo

then you fill out the form

Name: choose whatever name you want

Region: leave it as default

Branch: choose your branch

Root directory: the root of your backend project in my case it's "server"

build command: Choose Yarn

start command: depends on your config but in most cases, it's either "npm start" or "npm run dev"

add your env variables in the advanced section

after that, you click on Create web service and congrats your backend project is live

🎉

2- deploy your front-end project

to deploy your front-end project there are multiple choices but the one I use personally is Netlify which is simple, fast and efficient.

First, you have to create a Netlify account using your GitHub and choose "import an existing project"

choose "Deploy with GitHub"

finally, you fill out this form:

Base directory: directory of your front-end code which is usually in client

publish directory: the directory where your built project is placed in, if you are using a vite setup change it to "dist".

and add your env variables

Organize your env files (optional):

if you have a vite setup create two env files, one call it ".env.development" where you store your local env variables for example, your VITE_API_LINK equals to "localhost:5000", and the second one name it ".env.production" where your VITE_API_LINK equals to the API production link for example "myproject.render.com"

so that's it, your MERN project is deployed 🎉.

like and comment if you like the article