63 lines
3.2 KiB
Markdown
63 lines
3.2 KiB
Markdown
---
|
|
title: "Next.js + FastAPI Fullstack"
|
|
aliases: [nextjs-fastapi, nextjs-stack]
|
|
tags: [nextjs, fastapi, python, typescript, fullstack]
|
|
sources: [01 Projects/enterprise-ai-hub-nexus, 01 Projects/sandbox-notebookllamalm-nextjs, 01 Projects/Oliver-ai-bot_2.0, 01 Projects/ppt-tool]
|
|
created: 2026-04-15
|
|
updated: 2026-04-15
|
|
---
|
|
|
|
# Next.js + FastAPI Fullstack
|
|
|
|
Used for the most complex Oliver AI platforms. Next.js App Router handles SSR + auth; FastAPI handles AI workloads + data.
|
|
|
|
## Key Takeaways
|
|
- Next.js 14/15 App Router is the choice for production Oliver AI platforms
|
|
- Paired with FastAPI backend (Python AI workloads, DB operations)
|
|
- Azure AD PKCE auth lives in Next.js layer
|
|
- Docker Compose orchestrates all services
|
|
- Qdrant for vector search (RAG projects), Redis for caching/queuing
|
|
|
|
## When to Use
|
|
- Complex, multi-user AI platforms needing SSR, SEO, or M365 integration
|
|
- When the frontend state is complex enough to warrant Next.js routing
|
|
- Production deployments with multi-service architectures
|
|
|
|
## Key Details
|
|
- **Next.js versions:** 14 (Enterprise Nexus), 15 App Router (Sandbox NotebookLM)
|
|
- **Package manager:** npm (standard), `uv` for Python backend (Sandbox)
|
|
- **Auth:** Azure AD PKCE in Next.js; backend validates tokens
|
|
- **API pattern:** `src/lib/api.ts` (axios wrapper) → FastAPI backend
|
|
- **State:** Zustand (auth store in Sandbox NotebookLM)
|
|
- **Real-time:** WebSocket chat routes in FastAPI (Sandbox NotebookLM)
|
|
|
|
## Projects Using This Pattern
|
|
- [[01 Projects/enterprise-ai-hub-nexus/Enterprise AI Hub Nexus|Enterprise AI Hub Nexus]] — Next.js 14 + FastAPI + PostgreSQL + Redis + Qdrant + Celery
|
|
- [[01 Projects/sandbox-notebookllamalm-nextjs/Sandbox NotebookLM|Sandbox NotebookLM]] — Next.js 15 + FastAPI + Python 3.13 + uv + PostgreSQL + Redis + ElevenLabs
|
|
- [[01 Projects/Oliver-ai-bot_2.0/Oliver AI Bot 2.0|Oliver AI Bot 2.0]] — Next.js + FastAPI (MVP, 85% backend complete)
|
|
- [[01 Projects/ppt-tool/Oliver DeckForge|Oliver DeckForge]] — Next.js :3000 + FastAPI :8000 + nginx :80
|
|
|
|
## Architecture Pattern
|
|
```
|
|
Browser → Azure AD PKCE (auth)
|
|
↓
|
|
Next.js (SSR + App Router)
|
|
src/lib/api.ts → FastAPI backend
|
|
├── AI service (Claude/Gemini/LlamaIndex)
|
|
├── PostgreSQL (data)
|
|
├── Redis (cache/queue)
|
|
└── Celery workers (async jobs)
|
|
```
|
|
|
|
## Gotchas & Lessons
|
|
- Next.js 15 App Router + React 19 is cutting edge — expect breaking changes in dependencies
|
|
- `python-pptx` must be pinned to 0.6.23 for stable PPTX generation (Sandbox NotebookLM)
|
|
- `max_tokens` defaults are too low for document generation — increase to 16000+ for long outputs
|
|
- nginx reverse proxy needed when Next.js + FastAPI must share a single public port (DeckForge pattern)
|
|
- Celery beat for scheduled tasks (SharePoint sync in Enterprise Nexus) needs careful token refresh logic
|
|
|
|
## Related
|
|
- [[wiki/tech-patterns/fastapi-python-docker|fastapi-python-docker]] — backend details
|
|
- [[wiki/tech-patterns/azure-ad-msal-auth|azure-ad-msal-auth]] — auth layer
|
|
- [[wiki/architecture/rag-architecture|rag-architecture]] — RAG pattern used by Nexus
|
|
- [[wiki/tech-patterns/redis-celery-worker-queue|redis-celery-worker-queue]] — async processing
|