mirror of
https://github.com/pacnpal/thrillwiki_django_no_react.git
synced 2025-12-20 10:51:09 -05:00
d504d41de2
- Add complete backend/ directory with full Django application - Add frontend/ directory with Vite + TypeScript setup ready for Next.js - Add comprehensive shared/ directory with: - Complete documentation and memory-bank archives - Media files and avatars (letters, park/ride images) - Deployment scripts and automation tools - Shared types and utilities - Add architecture/ directory with migration guides - Configure pnpm workspace for monorepo development - Update .gitignore to exclude .django_tailwind_cli/ build artifacts - Preserve all historical documentation in shared/docs/memory-bank/ - Set up proper structure for full-stack development with shared resources
3.4 KiB
3.4 KiB
Authentication System Setup
Overview
This document outlines the setup of the authentication system, including both social and regular authentication.
Backend Changes
1. Package Installation
pip install django-allauth==0.65.1 dj-rest-auth==6.0.0 djangorestframework==3.15.2 django-cors-headers==4.5.0
2. Configuration Files Modified
-
thrillwiki/settings.py
- Added authentication apps
- Configured REST Framework
- Added CORS settings
- Added social auth providers
- Updated redirect URLs
-
thrillwiki/urls.py
- Added dj-rest-auth URLs
- Added social auth URLs
3. New Files Created
- accounts/adapters.py
- Custom social account adapter
- Handles missing emails
- Sets profile pictures from social providers
4. Modified Files
- accounts/views.py
- Added email collection endpoint
- Updated authentication views
- accounts/urls.py
- Added new authentication endpoints
Frontend Changes
1. Package Installation
npm install react-router-dom@6 axios@latest @react-oauth/google@latest
2. New Components Created
- src/contexts/AuthContext.tsx
- src/contexts/AuthProvider.tsx
- src/pages/Login.tsx
- src/pages/DiscordRedirect.tsx
- src/pages/EmailRequired.tsx
3. New Assets
- public/google-icon.svg
- public/discord-icon.svg
4. Modified Files
- src/App.tsx
- Added Google OAuth provider
- Added new routes
- src/api/client.ts
- Added authentication endpoints
- Added token handling
Development Environment Setup
Backend Setup
- Create REMOVED file:
DJANGO_SECRET_KEY=your_secret_key
DEBUG=True
ALLOWED_HOSTS=localhost,127.0.0.1
CORS_ALLOWED_ORIGINS=http://localhost:5173
# OAuth Credentials
GOOGLE_OAUTH2_CLIENT_ID=your_google_client_id
GOOGLE_OAUTH2_CLIENT_SECRET=your_google_client_secret
DISCORD_CLIENT_ID=your_discord_client_id
DISCORD_CLIENT_SECRET=your_discord_client_secret
# Database
DB_NAME=thrillwiki
DB_USER=postgres
DB_PASSWORD=postgres
DB_HOST=localhost
DB_PORT=5432
- Run migrations:
python manage.py makemigrations
python manage.py migrate
Frontend Setup
- Create REMOVED file:
VITE_API_URL=http://localhost:8000
VITE_GOOGLE_CLIENT_ID=your_google_client_id
VITE_DISCORD_CLIENT_ID=your_discord_client_id
- Install dependencies:
cd frontend
npm install
Testing Instructions
Backend Testing
- Start Django development server:
python manage.py runserver
- Test endpoints:
- Regular auth: http://localhost:8000/api/auth/login/
- Social auth: http://localhost:8000/api/auth/google/login/
- User info: http://localhost:8000/api/auth/user/
Frontend Testing
- Start Vite development server:
cd frontend
npm run dev
- Test flows:
- Regular login: http://localhost:5173/login
- Google login: Click "Continue with Google"
- Discord login: Click "Continue with Discord"
- Protected route: http://localhost:5173/settings
Testing Checklist
- Regular login/registration
- Google OAuth flow
- Discord OAuth flow
- Email collection for social auth
- Profile picture import
- Protected route access
- Token persistence
- Error handling
- Logout functionality
Notes
- Ensure all OAuth credentials are properly set up in Google Cloud Console and Discord Developer Portal
- Test all flows in incognito mode to avoid cached credentials
- Verify CSRF protection is working
- Check token expiration handling
- Test error scenarios (network issues, invalid credentials)