Production Deployment
This guide outlines the steps to deploy Blogify to a production environment using Railway for the FastAPI backend and Vercel for the Next.js frontend.
Prerequisites
Before starting, ensure you have the following:
- A GitHub repository containing your Blogify code.
- A Supabase project with Database, Auth, and Storage enabled.
- Accounts on Railway and Vercel.
1. Supabase Setup
Blogify relies on Supabase for data and authentication. Ensure your instance is configured:
- Database Tables: Ensure your PostgreSQL schema includes
postsanduserstables as defined in the backend models. - Storage: Create a public bucket named
imagesin Supabase Storage to handle post and profile image uploads. - Authentication: Enable Email/Password providers in the Supabase Auth settings.
- JWT Secret: Locate your JWT Secret in
Project Settings > API. This is required by the backend to verify user sessions.
2. Backend Deployment (Railway)
The FastAPI backend handles data logic and communicates with Supabase using the service role key.
- Connect Repository: Log in to Railway, create a new project, and connect your GitHub repository.
- Set Root Directory: Specify
backend/as the root directory for the service. - Build Configuration: Railway will automatically detect the
requirements.txt. Ensure the start command is set to:python -m uvicorn APP.main:app --host 0.0.0.0 --port ${PORT} - Environment Variables: Add the following variables in the Railway dashboard:
| Variable | Description |
| :--- | :--- |
| SUPABASE_URL | Your Supabase project URL. |
| SUPABASE_KEY | Your Supabase Service Role key (for admin access). |
| SUPABASE_JWT_SECRET | The JWT Secret from Supabase settings. |
| PORT | Set to 8080 (or leave as default). |
Once deployed, Railway will provide a public URL (e.g., https://backend-production.up.railway.app). Copy this URL for the frontend setup.
3. Frontend Deployment (Vercel)
The Next.js frontend is optimized for Vercel and handles the user interface and direct interactions with Supabase Auth/Storage.
- Import Project: In Vercel, import your GitHub repository.
- Set Root Directory: Select
frontend/as the root directory. - Framework Preset: Ensure "Next.js" is selected.
- Environment Variables: Add the following variables:
| Variable | Description |
| :--- | :--- |
| NEXT_PUBLIC_SUPABASE_URL | Your Supabase project URL. |
| NEXT_PUBLIC_SUPABASE_ANON_KEY | Your Supabase Anon key (client-side safe). |
| NEXT_PUBLIC_API_URL | The public URL of your Railway backend. |
- Deploy: Click "Deploy." Vercel will build the application and provide a production URL.
4. Final Configuration
CORS Settings
To allow the frontend to communicate with the backend, you must ensure the backend allows requests from your Vercel domain.
- In
backend/APP/main.py, verify thatallow_originsincludes your production Vercel URL. - If you used
["*"]for development, it is recommended to restrict this to your specific domain in production.
Supabase Redirect URLs
In the Supabase dashboard, navigate to Auth > URL Configuration and add your production Vercel URL to the Redirect URLs list. This ensures that authentication flows (like password resets or email confirmations) return users to the correct site.
Environment Variable Summary
Backend (.env)
SUPABASE_URL=https://your-project.supabase.co
SUPABASE_KEY=your-service-role-key
SUPABASE_JWT_SECRET=your-jwt-secret
Frontend (.env.local)
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
NEXT_PUBLIC_API_URL=https://your-backend-url.railway.app