Deploy Your App
1
Build your app
Run the build command for your React project:This creates a
- Vite
- Other Build Tools
dist folder with your production files.2
Create a Storage Zone
- In the Bunny dashboard, go to Storage → Add Storage Zone
- Enter a name for your zone (e.g.,
my-react-app) - Select a main storage region closest to your primary audience
- Click Add Storage Zone
Take note of your Storage Zone Password from the FTP & API Access section—you’ll need this for uploads.
3
Upload your files
Open your Storage Zone and upload the contents of your build folder (typically
dist) to the root of your storage zone.Automate uploads with the Storage API
Automate uploads with the Storage API
For CI/CD pipelines, use the Storage API:
4
Create a Pull Zone
- Go to CDN → Add Pull Zone
- Enter a name for your Pull Zone
- Set Origin Type to Storage Zone
- Select the Storage Zone you created earlier
- Click Add Pull Zone
https://your-pullzone-name.b-cdn.net.Configure Client-Side Routing
React apps using React Router need all routes to serveindex.html so the client-side router can handle navigation. Configure this using your Storage Zone’s error handling settings.
1
Navigate to your storage zone
Log in to your Bunny dashboard, go to Storage in the left navigation, and select your storage zone.
2
Open Error handling settings
Open the Error handling page.
3
Set the 404 file path
Enter
/index.html in the 404 File path field.4
Enable 404 to 200 rewrite
Check the box for Rewrite 404 to 200 status code and click Save.
5
Test
Navigate directly to a route in your app (e.g.,
/dashboard) to confirm it loads correctly.Add a Custom Domain
To serve your React app from your own domain, follow the Custom Hostname guide.Environment Variables
If your React app uses environment variables for API endpoints, ensure they’re set correctly for production. Create a.env.production file:
- Vite
- Other Build Tools
bash VITE_API_URL=https://api.example.com Environment variables are embedded at build time. Rebuild and redeploy after
changing them.
Summary
1
Build
Run your build command to generate production files.
2
Upload
Upload your build folder contents to a Storage Zone.
3
Connect
Create a Pull Zone pointing to your Storage Zone.
4
Configure routing
Set up error handling to serve
index.html for client-side routing.