ProjectsCROP Frontend
Environment Configuration
Quick Start for New Developers
Environment Configuration
Quick Start for New Developers
- Copy example file:
cp .env.example .env.local-
Get secrets from team lead (Clerk keys, Stripe keys, MongoDB URI)
-
Start development:
bun devFile Structure
| File | Purpose | Git |
|---|---|---|
.env.example | Template with placeholders | ✅ Committed |
.env.local | Local development secrets | ❌ Ignored |
Note: Vercel manages production/preview environments through their dashboard. Do not commit .env.production or .env.preview files.
Required Variables
Authentication (Clerk)
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_xxx
CLERK_SECRET_KEY=sk_test_xxxGet from: https://dashboard.clerk.com
Payments (Stripe)
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_xxxGet from: https://dashboard.stripe.com/test/apikeys
API Gateway
NEXT_PUBLIC_API_GATEWAY_URL=https://api.crop-dev.app
NEXT_PUBLIC_SEARCH_API_URL=https://api.crop-dev.appMongoDB (Tires)
MONGODB_URI=mongodb+srv://user:password@cluster.mongodb.net/crop_devEnvironment URLs
| Environment | Frontend | API Gateway |
|---|---|---|
| Development | localhost:3000 | https://api.crop-dev.app |
| Preview | *.vercel.app | https://api.crop-dev.app |
| Production | clintontractor.net | https://api.crop.app |
Troubleshooting
Build fails with missing env:
- Ensure all
NEXT_PUBLIC_*variables are set - Vercel: check Environment Variables in project settings
Auth not working:
- Verify Clerk keys match the correct environment (test vs live)
- Check
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEYis set (client-side)
API calls fail:
- Check
NEXT_PUBLIC_API_GATEWAY_URLis correct - Verify CORS is configured on backend