Agent skill
Project Architecture
Overview of the project's tech stack, directory structure, and architectural patterns.
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/development/project-architecture
SKILL.md
Project Architecture & Tech Stack
Tech Stack
- Framework: Next.js 15 (App Router)
- Language: TypeScript
- Styling: Tailwind CSS v4, CSS Modules (for specific components)
- Docs/Content: Docusaurus (in
textbook/directory) - Auth: Better Auth (
better-auth) - Database: PostgreSQL (NeonDB)
- ORM: Drizzle ORM
- UI Components: Lucide React icons, Custom components
Directory Structure
/app: Next.js App Router pages and layouts./components: Reusable UI components./auth: Authentication related components (forms, etc.).
/lib: Utility functions and shared logic.auth-client.ts: Better Auth client configuration.auth.ts: Better Auth server configuration.
/db: Database schema and connection logic./drizzle: Migrations./textbook: Docusaurus instance for documentation/content./src: Docusaurus source files.
Key Patterns
- Hybrid App: Combines a Next.js web app (marketing, auth, dashboard) with a Docusaurus documentation site.
- Auth Integration: Shared authentication state between Next.js and Docusaurus via cookies/sessions (handled by
AuthBar). - Styling: Global Tailwind styles in
app/globals.css. Docusaurus has its own theme intextbook/src/css/custom.css.
Development
- Run root app:
npm run dev:root - Run docs app:
npm run dev:docs - Run both:
npm run dev
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?