Skip to content

Latest commit

 

History

History
86 lines (71 loc) · 4.21 KB

File metadata and controls

86 lines (71 loc) · 4.21 KB

Lightning AI Workspace

Overview

Lightning AI Workspace is a milestone-driven platform for building AI tools with Lightning (Bitcoin) integration and community rankings. It features a landing page with a waitlist signup, a product showcase with upvoting functionality, and project tracking with progress phases. The app uses a dark "horizon gradient" theme with Orbitron and Inter fonts for a futuristic aesthetic.

User Preferences

Preferred communication style: Simple, everyday language.

System Architecture

Frontend

  • Framework: React 18 with TypeScript
  • Routing: Wouter (lightweight client-side router)
  • State/Data Fetching: TanStack React Query for server state management
  • Styling: Tailwind CSS v4 (using @tailwindcss/vite plugin) with CSS custom properties for theming
  • UI Components: shadcn/ui (new-york style) built on Radix UI primitives
  • Build Tool: Vite
  • Path Aliases: @/ maps to client/src/, @shared/ maps to shared/

Backend

  • Framework: Express 5 (ESM)
  • Language: TypeScript, executed via tsx
  • API Pattern: RESTful JSON API under /api/ prefix
  • HTTP Server: Node.js http.createServer wrapping Express

API Endpoints

  • POST /api/waitlist — Add email to waitlist (validates with Zod, handles uniqueness)
  • GET /api/products — Get all launched products
  • POST /api/products/:id/upvote — Upvote a product by ID

Data Layer

  • ORM: Drizzle ORM with PostgreSQL dialect
  • Database: PostgreSQL via pg Pool (requires DATABASE_URL environment variable)
  • Schema Location: shared/schema.ts — shared between client and server
  • Schema Push: npm run db:push uses drizzle-kit push
  • Validation: Zod schemas generated from Drizzle schemas via drizzle-zod

Database Tables

  1. users — id, username (unique), password
  2. projects — id, name, description, status (phase text), progress, satsEarned, isPublic, userId (FK to users)
  3. waitlist — id, email (unique), createdAt
  4. products — id, name, category, upvotes, author, url

Storage Pattern

  • IStorage interface defines all data access methods
  • DatabaseStorage class implements the interface using Drizzle queries
  • Exported as singleton storage instance

Development vs Production

  • Development: Vite dev server runs as middleware on the Express HTTP server with HMR support (server/vite.ts)
  • Production: Client is built to dist/public/, server is bundled with esbuild to dist/index.cjs, static files served by Express
  • Build Script: script/build.ts handles both Vite client build and esbuild server bundling, with an allowlist of dependencies to bundle for faster cold starts

Project Structure

client/           — Frontend React application
  src/
    components/ui/  — shadcn/ui component library
    hooks/          — Custom React hooks
    lib/            — Utilities (queryClient, cn helper)
    pages/          — Page components (Home, not-found)
    assets/         — Static assets referenced in code
server/           — Backend Express application
  index.ts        — Entry point, middleware setup
  routes.ts       — API route registration
  storage.ts      — Data access layer
  db.ts           — Database connection
  vite.ts         — Vite dev server integration
  static.ts       — Production static file serving
shared/           — Code shared between client and server
  schema.ts       — Drizzle table definitions and Zod schemas
migrations/       — Drizzle migration output directory

External Dependencies

  • PostgreSQL — Primary database, connected via DATABASE_URL environment variable
  • Radix UI — Headless UI primitives (dialog, dropdown, tabs, tooltip, etc.)
  • TanStack React Query — Client-side data fetching and caching
  • Drizzle ORM + drizzle-kit — Database ORM and schema management
  • Zod — Runtime validation on both client and server
  • Google Fonts — Inter and Orbitron font families loaded via CDN
  • Replit Plugins@replit/vite-plugin-runtime-error-modal, @replit/vite-plugin-cartographer, @replit/vite-plugin-dev-banner (dev only)
  • connect-pg-simple — PostgreSQL session store (available but not yet wired up)