# How to Deploy a React Site with Vercel

**Author:** Lee Robinson

---

This guide will show you how to deploy an React site and get your domain set up.

[React](https://reactjs.org/) is a JavaScript library for building user interfaces. There are multiple ways to build a React site, including:

- [Next.js](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fnextjs&template=nextjs&id=67753070&b=main&from=react-guide)
  
- [Create React App](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fcreate-react-app&template=create-react-app&id=67753070&b=main&from=react-guide)
  
- [Gatsby](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fgatsby&template=gatsby&id=67753070&b=main&from=react-guide)
  
- [Remix](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fremix&template=remix&id=67753070&b=main&from=react-guide)
  
- [Preact](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fpreact&template=preact&id=67753070&b=main&from=react-guide)
  
- [Ionic React](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fionic-react&template=ionic-react&id=67753070&b=main&from=react-guide)
  
- [Redwood](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fredwoodjs&template=redwoodjs&id=67753070&b=main&from=react-guide)
  

## Deploy React to Vercel

Vercel is a platform for deploying the fastest React sites. You can deploy your site with zero configuration to the best [frontend infrastructure](https://vercel.com/features/infrastructure).

- \*\*Develop: \*\*Build React sites that connect to your favorite APIs, databases, and content management systems.
  
- \*\*Preview: \*\*Integrate with any GitHub, GitLab, or Bitbucket repository for [instant continuous deployment](https://vercel.com/features/previews).
  
- \*\*Ship: \*\*Deploy your site to every edge node worldwide for the fastest React sites. Static files, Vercel Functions, the CDN, [and more](https://vercel.com/features/infrastructure).
  
- \*\*Monitor: \*\*Measure Core Web Vitals from actual devices your visitors are using with [Vercel Analytics](https://vercel.com/analytics/web-vitals) for Next.js or Gatsby.
  

## Built-in CI/CD for React sites

Vercel has integrations for [GitHub](https://vercel.com/docs/deployments/git/vercel-for-github), [GitLab](https://vercel.com/docs/deployments/git/vercel-for-gitlab), and [Bitbucket](https://vercel.com/docs/deployments/git/vercel-for-bitbucket) to enable CI/CD for your React site with zero configuration. Then, you can run [automated tests for performance and reliability](https://vercel.com/docs/concepts/deployments/checks) on every push. Pull and merge requests are deployed instantly to a unique URL, accessible to your entire team.

## Add your custom domain

After deploying, your new React site will automatically be assigned a `.vercel.app` suffixed domain. You can then add a [Custom Domain](https://vercel.com/docs/concepts/projects/custom-domains) on your choice, either from a third-party or [purchased through Vercel](https://vercel.com/domains).

## Deploy React to Vercel

### Start from a template

- [Next.js](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fnextjs&template=nextjs&id=67753070&b=main&from=react-guide)
  
- [Create React App](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fcreate-react-app&template=create-react-app&id=67753070&b=main&from=react-guide)
  
- [Gatsby](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fgatsby&template=gatsby&id=67753070&b=main&from=react-guide)
  
- [Remix](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fremix&template=remix&id=67753070&b=main&from=react-guide)
  
- [Preact](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fpreact&template=preact&id=67753070&b=main&from=react-guide)
  
- [Ionic React](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fionic-react&template=ionic-react&id=67753070&b=main&from=react-guide)
  
- [Redwood](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fvercel%2Fvercel%2Ftree%2Fmain%2Fexamples%2Fredwoodjs&template=redwoodjs&id=67753070&b=main&from=react-guide)
  

### Vercel CLI

1. Install the [Vercel CLI](https://vercel.com/cli) and run `vercel` to deploy.
   
2. Vercel will detect that you are using React and will enable the correct settings for your deployment.
   
3. Your application is deployed! (e.g. [create-react-template.vercel.app](https://create-react-template.vercel.app/))
   

### Vercel for Git

1. Push your code to your git repository (GitHub, GitLab, BitBucket).
   
2. [Import your React project](https://vercel.com/new) into Vercel.
   
3. Vercel will detect that you are using React and will enable the correct settings for your deployment.
   
4. Your application is deployed! (e.g. [create-react-template.vercel.app](https://create-react-template.vercel.app/))

---

[View full KB sitemap](/kb/sitemap.md)