Django-Frontend CORS Issue Resolution
Budget: €30 – €250 EUR
PROJECT CONTEXT
We have a recruitment and client management platform consisting of:
Frontend apps:
A public form site where candidates and clients submit their applications.
An internal dashboard app used by the admin and staff to manage those submissions.
Both are built with Next.js (TypeScript), use Supabase authentication, and are deployed on Vercel.
Backend:
A Django REST API hosted on Render.com.
It handles:
Candidate and client submissions
Approvals / rejections
CV generation
Email automation via Supabase + SendGrid
Database & services:
PostgreSQL (via Supabase)
Redis (for caching)
SendGrid (SMTP) for transactional emails
CURRENT ISSUES
CORS / Network Errors
The public frontend cannot submit forms to the API (blocked by CORS).
Browser error:
Access to XMLHttpRequest has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
The same problem occurs when trying to upload a profile photo through the dashboard app.
Form Validation
A validation error appears for one of the fields (comfortableWithPets), which might be related to missing or mismatched field definitions.
GOAL
Fix backend and form submission issues so that:
Candidate form submits successfully
Client form submits successfully
Profile photo uploads work correctly
Backend sends proper CORS headers
Supabase signup continues functioning (email confirmation already fixed)
TECH STACK
Backend
Django 3.2
Django REST Framework
django-cors-headers
Python 3.10
Hosted on Render (Gunicorn)
Frontend
Next.js (TypeScript + Axios)
Hosted on Vercel
Uses Supabase client SDK for auth
Environment
Supabase (PostgreSQL + Auth)
SendGrid SMTP
Redis cache
TASKS FOR FREELANCER
Fix CORS configuration in Django:
Verify django-cors-headers is correctly configured.
Ensure middleware order is correct (CorsMiddleware must be first).
Confirm proper allowed origins for both frontends.
Test with curl or browser DevTools to confirm headers like:
Access-Control-Allow-Origin
Access-Control-Allow-Methods
Ensure form submissions and file uploads return valid responses (201 Created).
Verify Supabase signup integration still works after CORS fix.
Test both frontends to ensure end-to-end form functionality and profile photo upload.
ACCESS PROVIDED
Render backend access
Supabase project credentials (for testing)
GitHub repository for Django backend
Temporary Vercel preview link (optional)
SendGrid credentials (if needed for email testing)
We have a recruitment and client management platform consisting of:
Frontend apps:
A public form site where candidates and clients submit their applications.
An internal dashboard app used by the admin and staff to manage those submissions.
Both are built with Next.js (TypeScript), use Supabase authentication, and are deployed on Vercel.
Backend:
A Django REST API hosted on Render.com.
It handles:
Candidate and client submissions
Approvals / rejections
CV generation
Email automation via Supabase + SendGrid
Database & services:
PostgreSQL (via Supabase)
Redis (for caching)
SendGrid (SMTP) for transactional emails
CURRENT ISSUES
CORS / Network Errors
The public frontend cannot submit forms to the API (blocked by CORS).
Browser error:
Access to XMLHttpRequest has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
The same problem occurs when trying to upload a profile photo through the dashboard app.
Form Validation
A validation error appears for one of the fields (comfortableWithPets), which might be related to missing or mismatched field definitions.
GOAL
Fix backend and form submission issues so that:
Candidate form submits successfully
Client form submits successfully
Profile photo uploads work correctly
Backend sends proper CORS headers
Supabase signup continues functioning (email confirmation already fixed)
TECH STACK
Backend
Django 3.2
Django REST Framework
django-cors-headers
Python 3.10
Hosted on Render (Gunicorn)
Frontend
Next.js (TypeScript + Axios)
Hosted on Vercel
Uses Supabase client SDK for auth
Environment
Supabase (PostgreSQL + Auth)
SendGrid SMTP
Redis cache
TASKS FOR FREELANCER
Fix CORS configuration in Django:
Verify django-cors-headers is correctly configured.
Ensure middleware order is correct (CorsMiddleware must be first).
Confirm proper allowed origins for both frontends.
Test with curl or browser DevTools to confirm headers like:
Access-Control-Allow-Origin
Access-Control-Allow-Methods
Ensure form submissions and file uploads return valid responses (201 Created).
Verify Supabase signup integration still works after CORS fix.
Test both frontends to ensure end-to-end form functionality and profile photo upload.
ACCESS PROVIDED
Render backend access
Supabase project credentials (for testing)
GitHub repository for Django backend
Temporary Vercel preview link (optional)
SendGrid credentials (if needed for email testing)