React Deployment
Deployment
What is Deployment?
Deployment means taking your local React app and putting it on a live server, so anyone on the internet can access it via a URL. Vercel and Netlify are popular platforms for deploying front-end apps like React.
Deployment with Vercel
About Vercel
- Made by the creators of Next.js.
- Great for React, Next.js, static sites, or any frontend framework.
- Free plan with global CDN.
Steps to deploy on Vercel
1. Push your code to GitHub (or GitLab / Bitbucket)
- Make sure your React project is committed and pushed
2. Sign up at vercel.com
- Use your GitHub account to signed
3. Import your project
- Click “New Project”.
- Select your repository.
- Vercel auto-detects Create React App.
4. Configure & Deploy
- Usually you can just click “Deploy”.
- It builds automatically and gives you a live URL.
5. Automatic redeploy
- Every time you push to your repo, Vercel rebuilds & redeploys.
Deployment with Netlify
About Netlify
- Popular for JAMstack (React, Vue, static sites).
- Free plan with CI/CD, instant rollbacks, forms, functions, etc.
Steps to deploy on Netlify
1. Push your code to GitHub (or GitLab / Bitbucket)
- Make sure your React project is committed and pushed.
2. Sign up at netlify.com
- Link your GitHub account.
3. New site from Git
- Choose your repo.
- Netlify detects React and sets:
- Build command: npm run build
- Publish directory: build
4. Deploy site
- It builds and gives you a live URL.
5. Continuous deployment
- Push to main branch → auto