Local apps are demos. Deployed apps are products. Deploy both frontend and backend to free hosting services and connect them with production environment variables.
Your full-stack AI app running live on the internet: FastAPI backend on Railway, React frontend on Vercel, connected via environment variables.
import os # Read allowed origins from environment variable FRONTEND_URL = os.getenv("FRONTEND_URL", "http://localhost:3000") app.add_middleware( CORSMiddleware, allow_origins=[FRONTEND_URL], allow_methods=["*"], allow_headers=["*"] )
// Use environment variable for backend URL export const API = process.env.REACT_APP_API_URL || 'http://localhost:8000';
Push your backend folder to a GitHub repository (separate from frontend).
Go to railway.app → New Project → Deploy from GitHub → select backend repo.
In Railway Variables, set: ANTHROPIC_API_KEY and FRONTEND_URL (set to your Vercel URL, which you'll get in the next step — use a placeholder first).
Set start command: uvicorn main:app --host 0.0.0.0 --port $PORT. Railway provides the PORT env var automatically.
Generate Domain → copy the Railway URL (looks like your-app.up.railway.app).
Push your React frontend to GitHub.
Go to vercel.com → New Project → Import from GitHub → select frontend repo.
In Environment Variables, add: REACT_APP_API_URL = your Railway backend URL.
Deploy. Vercel detects Create React App automatically and runs npm run build.
Once deployed, copy the Vercel URL and update the FRONTEND_URL variable in Railway. Redeploy Railway.
Two URLs cross-reference each other. Railway needs the Vercel URL for CORS. Vercel needs the Railway URL for API calls. Deploy both with placeholder values first, then update both once you have the final URLs.
Want live instruction and hands-on projects? Join the AI bootcamp — 3 days, 5 cities.
Before moving on, confirm understanding of these key concepts: