Deploy a React App with Vercel and Create React App

React is a popular open-source JavaScript framework, maintained by Facebook, for easily creating interactive single-page apps (SPAs).

In this guide, we will cover how to set up a React app with Create React App (CRA) and how to deploy it with Vercel.

Step 1: Set Up Your React Project

Get started by setting up a React app using the Create React App (CRA) CLI tool. With this, you can generate a project to get up and running with React.

Using npm, you can setup a React app with CRA with the following command in your terminal:

npm init react-app my-react-app && cd my-react-app

Bootstrapping a React app with Create React App through npm.

If you would prefer to use another method, see the Quick Start documentation for CRA.

Step 2: Deploying Your React Project with Vercel

To deploy your React app with a Vercel for Git, make sure it has been pushed to a Git repository.

Import the project into Vercel using your Git of choice:

After your project has been imported, all subsequent pushes to branches will generate Preview Deployments, and all changes made to the Production Branch (commonly "main") will result in a Production Deployment.

Once deployed, you will get a URL to see your app live, such as the following: https://create-react-app.now-examples.now.sh

Set up a React app with a few clicks using the Deploy button, and create a Git repository for it in the process for automatic deployments for your updates.