React 19 + TypeScript SPA with Vite, mobile responsive fixes, GitHub Actions CI/CD pipeline for automated deployment. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1.6 KiB
Aimpress Site
Commands
npm run dev # Start Vite dev server
npm run build # Type-check (tsc -b) then Vite build
npm run lint # ESLint
npm run preview # Preview production build
Architecture
React 19 + TypeScript single-page application built with Vite.
Entry point: src/main.tsx → src/App.tsx
Page structure (top to bottom in App.tsx):
InteractiveBackground— canvas/animated background layerHeaderHero,Benefits,Banner1,RealResults,Timeline,Banner2,ComparisonTable,BlogSection,ResourcesSection,ContactSectionFooter
Firebase: src/firebase.ts — handles form submissions (Firestore/Firebase backend).
Key Patterns
Component styling: Every component has a paired CSS file (ComponentName.tsx + ComponentName.css). Import the CSS directly in the component file.
Design tokens (defined in src/index.css :root):
--light-grey-100: #D3DDDE--dark-grey-100: #233038(page background)--dark-teal-100: #075056--orange-100: #FF5B04(primary accent)--yellow-100: #FCA82E--font-primary: 'Inter', sans-serif
Animations: Framer Motion for scroll-triggered and interactive animations. react-intersection-observer used alongside Framer Motion for viewport-based triggers.
Font: Self-hosted Inter (weights 300–900) loaded via @font-face in src/index.css, served from public/font/Inter/.
Base styles: CSS reset in src/index.css. Dark background (--dark-grey-100), light text (--light-grey-100).