A full-stack portfolio and project hub for aetherwave — showcasing projects, interactive experiences, and personal branding. Built with a modern turborepo monorepo architecture.
| Technology | Purpose |
|---|---|
| Next.js 16 | React framework with App Router, SSR & ISR |
| React 19 | UI library with React Compiler support |
| TypeScript 5 | Type-safe development |
| Tailwind CSS 4 | Utility-first styling |
| ESLint | Linting and code quality |
| Technology | Purpose |
|---|---|
| Django 5.2 | Python web framework |
| Django REST Framework | RESTful API toolkit |
| Simple JWT | Token-based authentication |
| PostgreSQL 15 | Relational database |
| Gunicorn | Production WSGI server |
| WhiteNoise | Static file serving |
| Technology | Purpose |
|---|---|
| Turborepo | Monorepo build orchestration |
| Docker Compose | Local containerized development |
| Fly.io | Backend deployment platform |
| Vercel | Frontend deployment |
┌─────────────────────────────────────────────────────────────────┐
│ TURBOREPO MONOREPO │
├─────────────────────────────────────────────────────────────────┤
│ │
│ ┌─────────────────────────┐ ┌─────────────────────────────┐ │
│ │ apps/web │ │ apps/api/backend │ │
│ │ (Next.js 16) │ │ (Django 5.2) │ │
│ │ │ │ │ │
│ │ • Server Components │──▶ │ • REST API (/api/v1/) │ │
│ │ • Client Components │ │ • JWT Authentication │ │
│ │ • Server Actions │ │ • Projects & Tags CRUD │ │
│ │ • Tailwind CSS │ │ • PostgreSQL Database │ │
│ └─────────────────────────┘ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────────────────────────────────────┐│
│ │ packages/ ││
│ │ • config/ - Shared Tailwind configuration ││
│ │ • tsconfig/ - Shared TypeScript configuration ││
│ │ • images/ - Shared image assets ││
│ │ • ui/ - Shared UI components ││
│ └─────────────────────────────────────────────────────────────┘│
└─────────────────────────────────────────────────────────────────┘
- Next.js frontend makes server-side requests to the Django API
- Server fetch (
lib/server-api/) fetches data with ISR caching (5s revalidation) - Django REST API serves JSON data from PostgreSQL via ViewSets
- JWT tokens handle authentication for protected routes
| Route | Description |
|---|---|
/ |
Home page with splash screen and bio section |
/projects |
Portfolio grid displaying all projects |
/projects/[slug] |
Individual project detail page |
| Component | Purpose |
|---|---|
Navbar |
Responsive navigation with mobile hamburger menu |
Bars |
Decorative UI element |
Splash |
Hero/splash section on homepage |
Bio |
About/introduction section with canvas effects |
Projects |
Grid layout for project cards |
CanvasContext |
Interactive canvas with pixel sort effects |
ApiStatus |
Real-time API health indicator |
AuthModal |
Authentication modal dialog |
| Endpoint | Method | Description |
|---|---|---|
/projects/ |
GET | List all projects |
/projects/{slug}/ |
GET | Get project by slug |
/tags/ |
GET, POST | List/create tags |
/auth/token/ |
POST | Obtain JWT token pair |
/auth/token/refresh/ |
POST | Refresh access token |
- Project: Portfolio items with title, slug, tagline, description, images, tags, links, and metadata
- Tag: Categorization for projects (many-to-many relationship)
- Node.js 18+
- Python 3.11+
- Docker & Docker Compose (for containerized development)
- PostgreSQL 15 (or use Docker)
# Clone the repository
git clone https://github.com/yourusername/aetherport.git
cd aetherport
# Start all services
docker-compose up --build
# Access the application
# Frontend: http://localhost:3000
# Backend: http://localhost:8000/api/v1/cd apps/api/backend
# Create virtual environment
python -m venv venv
source venv/bin/activate # On Windows: venv\Scripts\activate
# Install dependencies
pip install -r requirements.txt
# Set environment variables
cp .env.example .env # Create and configure .env
# Run migrations
python manage.py migrate
# Start development server
python manage.py runserver# From root directory
npm install
# Start development (uses Turborepo)
npm run dev
# Or just the web app
cd apps/web
npm run devAPI_BASE_URL=http://localhost:8000/api/v1 # Server-side API URL
NEXT_PUBLIC_API_URL=http://localhost:8000/api/v1 # Client-side API URLSECRET_KEY=your-secret-key
DATABASE_URL=postgres://user:pass@localhost:5432/aetherport
DEBUG=Trueaetherport/
├── apps/
│ ├── web/ # Next.js frontend
│ │ ├── src/app/ # App Router pages & components
│ │ ├── lib/ # API clients & types
│ │ └── public/ # Static assets
│ └── api/backend/ # Django backend
│ ├── aether/ # Django project settings
│ ├── projects/ # Projects app (models, views, serializers)
│ ├── accounts/ # User accounts app
│ └── core/ # Core utilities
├── packages/
│ ├── config/ # Shared Tailwind config
│ ├── tsconfig/ # Shared TypeScript config
│ ├── images/ # Shared image assets
│ └── ui/ # Shared UI components
├── docker-compose.yml # Local development containers
├── turbo.json # Turborepo configuration
└── package.json # Root workspace config
The backend is configured for Fly.io deployment with automatic migrations on release.
cd apps/api/backend
fly deployThe frontend is configured for Vercel with preview deployments for PRs.
# Automatic via GitHub integration, or manually:
vercel --prodSee LICENSE for details.
Made with 💜 by etherchild