Overview
Documents a goal-tracking app's full stack, API endpoints, dependencies, and development tools for coaching workflows.
What this file does
Documents a goal-tracking app's full stack, API endpoints, dependencies, and development tools for coaching workflows.
When to use it
- Starting a new React-Express-TS project with shadcn/ui and Drizzle ORM
- Planning a coaching or mentoring app with goal entry management
- Choosing a stack for a full-stack TypeScript application with Vite
- Documenting an existing project's architecture and dependencies
Assumes this stack
Overview
This is a goal tracking application built with React, Express, and TypeScript. The app allows users to create, view, and manage goal entries for a coaching or mentoring system where "senseis" set goals for "ninjas" based on their current project status. The application features a clean UI built with shadcn/ui components and Tailwind CSS.
User Preferences
Preferred communication style: Simple, everyday language.
System Architecture
Frontend Architecture
- React with TypeScript: Modern React application using functional components and hooks
- Vite: Build tool and development server for fast development experience
- shadcn/ui + Radix UI: Comprehensive component library providing accessible UI primitives
- Tailwind CSS: Utility-first CSS framework for styling
- TanStack Query: Data fetching and state management for server state
- Wouter: Lightweight client-side routing
- React Hook Form: Form handling with validation
Backend Architecture
- Express.js: RESTful API server with TypeScript
- Memory Storage: In-memory data storage using Map data structure for goal entries
- Zod: Runtime type validation for API requests and responses
- Session-based Architecture: Simple stateless API design
Database Design
- Drizzle ORM: Type-safe database toolkit configured for PostgreSQL
- Schema Definition: Centralized schema in
shared/schema.tsfor type safety across frontend and backend - Goal Entries Table: Core entity storing date, sensei name, ninja name, current project, and two goals
API Structure
- REST Endpoints:
GET /api/goal-entries: Retrieve all goal entriesPOST /api/goal-entries: Create new goal entry with validationDELETE /api/goal-entries/:id: Delete specific goal entryDELETE /api/goal-entries: Clear all goal entries
- Error Handling: Centralized error handling with proper HTTP status codes
- Request Validation: Zod schema validation for all incoming requests
Key Features
- Goal Entry Management: Create, view, and delete goal entries
- Project Status Mapping: Predefined goal templates based on project completion status
- Data Export: CSV export functionality for goal entries
- Responsive Design: Mobile-first responsive UI
- Real-time Updates: Optimistic updates with TanStack Query
Development Tools
- TypeScript: Full type safety across the entire stack
- ESLint + Prettier: Code quality and formatting
- Hot Module Replacement: Development experience with Vite
- Path Aliases: Clean import paths using TypeScript path mapping
External Dependencies
Core Framework Dependencies
- @neondatabase/serverless: PostgreSQL database driver for Neon
- drizzle-orm: Type-safe database ORM
- drizzle-kit: Database migration and introspection tools
UI and Styling
- @radix-ui/*: Comprehensive set of unstyled, accessible UI primitives
- tailwindcss: Utility-first CSS framework
- class-variance-authority: Component variant management
- lucide-react: Icon library
State Management and Data Fetching
- @tanstack/react-query: Server state management and caching
- react-hook-form: Form state management
- @hookform/resolvers: Form validation resolvers
Development and Build Tools
- vite: Build tool and development server
- tsx: TypeScript execution for Node.js
- esbuild: JavaScript bundler for production builds
- @replit/vite-plugin-runtime-error-modal: Development error overlay
- @replit/vite-plugin-cartographer: Replit-specific development tools
Utility Libraries
- zod: Runtime type validation
- date-fns: Date manipulation utilities
- clsx: Conditional className utility
- nanoid: Unique ID generation
- wouter: Lightweight routing library
What's inside
7 sections covering architecture, API, features, dependencies, and development tools
Change this for your project
- Replace
richard523/cnwk-goal-trackerwith your own repository name - Replace
@neondatabase/serverlesswith your database driver if not using Neon - Replace
shared/schema.tswith your own schema file path if different
Where it goes
Keep it in your repository where the agent or team that needs it will read it.
Worth borrowing
- Separating shared schema between frontend and backend for type safety
- Using Zod for runtime validation on both client and server
- Organizing API endpoints around a single core entity with CRUD operations
Related Documents
GOOBY - Closing Store Marketplace
Defines a full-stack marketplace app for discovering closing retail stores in NY/NJ/CT/PA, with automated closure scanning and admin review.
Lua Code Obfuscator/Deobfuscator
Provides a full-stack web app for obfuscating and deobfuscating Roblox Lua scripts with a Monaco editor and PostgreSQL storage.
GREEN NODE - Project Overview
Describes a full-stack recycling platform with three runtime modes, provider architecture, and development scripts for Cochabamba, Bolivia.
ADN Systems DMR Peer Server
Documents a forked FreeDMR server for amateur radio DMR voice/data routing with bridges, proxies, scheduled voice announcements, and centralized security.