Vercel combines the best developer experience with an obsessive focus on end-user performance, which enables frontend teams to do their best work.
This post outlines how to deploy React App to Vercel host for free. You might be interested in other free deployment options:
- How to deploy a React App to Firebase host for free
- How to deploy a React App to Cloudflare host for free
# Deploy React Apps on Vercel
- Demo Site: https://xyz-vercel.vercel.app/
- Github repo here
Create react app
npx create-next-app project-name
cd project-name
yarn
yarn dev
Install Vercel tools CLI
The Vercel command-line interface enables instant cloud deployment and local development.
npm i -g vercel
Login Vercel using CLI
vercel login
You will be prompted to enter an email, where a link will redirect you to a verification page. Click the VERIFY button to proceed.
After this, you will see below result in CLI:
Setup Vercel project from CLI
Note: you can also create a project using Vercel console, but using CLI is more convenient.
- Run the below command
cd project-name
vercel
You need cd into the folder where React App is created. Follow the instructions as shown below:
- Confirm YES.
- Create a new Vercel project, by typing "y".
- Input a project ID, e.g. "xyz-vercel", choose a directory where the code resides.
- Overwrite the default settings if needed.
- You might wish to override the build command if necessary
After a few seconds, your app will be deployed to Vercel and a URL will be given: e.g. https://xyz-vercel.vercel.app/
Open a browser window, and type the url: https://xyz-vercel.vercel.app/
Now, your app is deployed to Vercel! Happy coding, happy deploying!
Top comments (4)
It was realy helful. Thanks!
Do we need to push node modules also, if we want to deploy on Vercel ?
no need to push node modules
Thank you for sharing