How to Deploy a React App to Netlify
Deploy your Vite or Create React App project to Netlify. Build settings, redirects, environment variables, and custom domains.
Netlify for React apps
Netlify is ideal for static React apps and Vite-based projects. It offers continuous deployment from Git, form handling, serverless functions, and a generous free tier. If your React app doesn't need server-side rendering, Netlify is a great choice.
Build configuration
For Vite: build command is `npm run build`, publish directory is `dist`. For Create React App: build command is `npm run build`, publish directory is `build`. Netlify auto-detects most configurations, but verify these settings in your project's Build & Deploy settings.
Handling client-side routing
React apps with client-side routing (React Router) need a redirect rule. Without it, direct links to routes like /dashboard return 404. Create a `_redirects` file in your public folder with: `/* /index.html 200`. This tells Netlify to serve your app for all routes and let React Router handle them.
Environment variables
Add environment variables in Netlify's Site Settings > Environment Variables. For Vite apps, client-side variables must be prefixed with VITE_ (e.g., VITE_API_URL). For CRA, use REACT_APP_ prefix. Redeploy after adding variables - they're only available during build time.
Custom domain
In Domain Settings, add your custom domain. Configure DNS by pointing your domain to Netlify's load balancer or using Netlify DNS. SSL certificates are provisioned automatically through Let's Encrypt.
Need help with this?
Our team handles deploy & ship for AI-built apps every day. Get a fixed quote within 24 hours.
Start with a self-serve audit
Get a professional review of your app at a fixed price.
Security Review
Automated Security Scan
AI-powered analysis of your codebase. Get a detailed report with prioritized findings within 24 hours.
Get StartedSecurity Review
Manual Security Review
Expert engineer works on your project directly. Fixed scope, fixed price, no surprises.
Get a QuoteSecurity Review
Full Pentest
Enterprise-grade engagement tailored to your needs. Dedicated engineer, ongoing support.
Fix Bugs
Code Audit
AI-powered analysis of your codebase. Get a detailed report with prioritized findings within 24 hours.
Get StartedFix Bugs
Bug Fixing
Expert engineer works on your project directly. Fixed scope, fixed price, no surprises.
Get a QuoteFix Bugs
Ongoing Support
Enterprise-grade engagement tailored to your needs. Dedicated engineer, ongoing support.
Refactor Code
Code Audit
AI-powered analysis of your codebase. Get a detailed report with prioritized findings within 24 hours.
Get StartedRefactor Code
Refactoring
Expert engineer works on your project directly. Fixed scope, fixed price, no surprises.
Get a QuoteRefactor Code
Full Rewrite
Enterprise-grade engagement tailored to your needs. Dedicated engineer, ongoing support.
100% of your audit purchase is credited toward any paid service. Start with an audit, then let us fix what we find.
Related guides
How to Deploy a Next.js App to Vercel
The complete guide to deploying your Next.
Production Readiness Checklist for AI-Built Apps
The complete checklist before launching any AI-generated app.
Environment Variables Explained for Non-Technical Founders
What environment variables are, why they matter, and how to set them up correctly.
Related technologies
Need help with your app?
Tell us about your project. We'll respond within 24 hours with a clear plan and fixed quote.