Skip to main content

Project Structure & Organization

Directory Structure​

LyfeAI-Provider-06.02/
├── app/                    # Next.js 14 App Router
│   ├── actions/           # Server actions for data mutations
│   ├── admin/             # Admin dashboard pages
│   ├── analytics/         # Analytics dashboard
│   ├── care-plans/        # Care plan management
│   ├── communication/     # Provider communication
│   ├── dashboard/         # Main dashboard
│   ├── login/             # Authentication pages
│   ├── mychart-auth/      # MyChart integration
│   ├── orders-results/    # Lab/imaging orders
│   ├── patient-portal/    # Patient-facing portal
│   ├── patients/          # Patient management
│   └── scheduling/        # Appointment scheduling
├── components/            # React components
│   ├── admin/            # Admin-specific components
│   ├── ui/               # shadcn/ui components
│   └── [feature].tsx     # Feature components
├── docs/                  # Docusaurus documentation
│   ├── memory-bank/      # Project knowledge base
│   └── tasks/            # Task tracking
├── hooks/                 # Custom React hooks
├── lib/                   # Core services & utilities
├── public/                # Static assets
├── scripts/               # Database SQL scripts
├── styles/                # Global styles
└── types/                 # TypeScript definitions

Key Architectural Layers​

1. Presentation Layer (app/ & components/)​

  • App Router Pages: Server-first rendering
  • Components: Reusable UI elements
  • Loading/Error Boundaries: Graceful state handling

2. Business Logic Layer (lib/)​

  • Services: Core business logic
  • Utilities: Helper functions
  • Hooks: Shared React logic

3. Data Layer (app/actions/ & lib/)​

  • Server Actions: Data mutations
  • Mock Repositories: In-memory data
  • FHIR Services: Healthcare data handling

4. Infrastructure Layer (scripts/)​

  • Database Schema: PostgreSQL setup
  • Migrations: Schema evolution
  • Sample Data: Test datasets

File Naming Conventions​

  • Components: PascalCase (PatientSummary.tsx)
  • Utilities: camelCase (use-auth.ts)
  • Actions: kebab-case (patient-actions.ts)
  • Pages: kebab-case folders
  • Types: PascalCase interfaces/types

Module Organization​

Feature-Based Structure​

Each major feature has:

  • Page component in app/
  • Related components in components/
  • Server actions in app/actions/
  • Types in component files or types/

Shared Resources​

  • UI components in components/ui/
  • Common utilities in lib/
  • Global types in types/
  • Hooks in hooks/

Import Patterns​

Absolute Imports​

import { Button } from '@/components/ui/button'
import { useAuth } from '@/lib/use-auth'

Relative Imports​

Used within the same feature module:

import { PatientHeader } from './patient-header'

Code Organization Best Practices​

  1. Single Responsibility: Each file has one clear purpose
  2. Colocation: Related code stays together
  3. Barrel Exports: Index files for clean imports
  4. Type Safety: TypeScript throughout
  5. Server/Client Separation: Clear boundaries

Build & Output Structure​

.next/                     # Build output
├── server/               # Server-side code
├── static/               # Static assets
└── cache/                # Build cache

out/                      # Static export (if used)

Environment Structure​

  • Development: Local development with hot reload
  • Production: Optimized builds with caching
  • Test: Isolated test environment

This structure supports scalability, maintainability, and clear separation of concerns throughout the application.