biohazard-vfx/docs/prd/06-technical.md
nicholai ed55376b9c
Some checks are pending
Build and Push to Docker Hub / Push Docker image to Docker Hub (push) Waiting to run
Build and Push Docker Image / build-and-push (push) Waiting to run
bmad-planning-complete
2025-09-24 10:54:01 -06:00

33 lines
2.6 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

Technical Constraints and Integration Requirements
Existing Technology Stack
- Languages: TypeScript
- Frameworks: Next.js 15 (App Router), React 19, TailwindCSS
- Database: Prisma (SQLite/Postgres depending on env), NextAuth; optional Cloudflare D1 for contact submissions [Approved]
- Infrastructure: Next build/start, Sentry for monitoring; no infra files for Vercel/CI in repo
- External Dependencies: framer-motion/motion, lenis, uploadthing, shadcn primitives, zod, react-hook-form
Integration Approach
- Database Integration Strategy: No schema changes required; augment only content display and forms; ensure Contact writes via existing patterns or route additions without breaking Prisma clients.
- API Integration Strategy: Reuse /api/* routes; add new endpoints cautiously (e.g., contact submissions) and version if needed. For contact persistence, allow optional integration with a Cloudflare Worker/D1 via server-side fetch, without impacting existing Prisma schema.
- Frontend Integration Strategy: Introduce tokens and new components incrementally; gate behind feature flags if needed; refactor pages to consume tokens with minimal churn.
- Testing Integration Strategy: Component tests for tokens and Sticky Split mechanics; route smoke tests; accessibility checks; performance snapshots.
Code Organization and Standards
- File Structure Approach: Keep src/app/* routes; add shared components under src/components/ui/* and src/components/patterns/sticky-split/*.
- Naming Conventions: PascalCase for components, kebab for route segments, token names as --bh-*.
- Coding Standards: ESLint + Prettier existing; maintain strict TS; avoid oneoff inline styles.
- Documentation Standards: Co-locate README.md per component/pattern for usage; update main docs after shard.
Deployment and Operations
- Build Process Integration: Ensure no increase in warnings; tree-shake unused fonts/components.
- Deployment Strategy: Incremental deploys; feature flags if needed; maintain redirects for IA adjustments.
- Monitoring and Logging: Extend Sentry breadcrumbs for navigation and key CTA events.
- Configuration Management: .env unchanged; add envs for contact handling only if required (e.g., Cloudflare credentials, D1 binding endpoint).
Risk Assessment and Mitigation
- Technical Risks: Global style regressions; performance drops from animation; font loading flashes.
- Integration Risks: Breaking admin routes/layouts; IA changes affecting deep links.
- Deployment Risks: CSS purge issues; caching of old assets.
- Mitigation Strategies: Token gating and gradual rollout; perf budgets (CLS/LCP targets); redirects and manual QA script; font preloading.