1. Structure

Project Structure Documentation

This document provides an overview of the project’s file structure and organization for the WMIAdminTheme 2025 project.

Common Structure Overview

The project follows a standard React application structure with some additional directories for specific features:

wmiadmintheme2025/
├── src/                    # Main source code
│   ├── components/        # Reusable UI components
│   ├── pages/            # Page components
│   ├── layout/           # Layout components
│   ├── context/          # React context providers
│   ├── types/            # TypeScript type definitions
│   ├── constants/        # Application constants
│   ├── assets/           # Static assets
│   └── lib/              # Utility functions
├── public/               # Public static files
├── dist/                 # Production build
└── config/              # Configuration files

Key Directories Explained

1. Source Code (src/)

The main development directory containing all application code.

2. Components (src/components/)

  • Reusable UI components
  • Organized by feature/type
  • Includes UI, forms, charts, etc.

3. Pages (src/pages/)

  • Page-level components
  • One directory per feature/page
  • Contains page-specific components

4. Layout (src/layout/)

  • Application layout components
  • Header, sidebar, main layout
  • Navigation structure

5. Supporting Directories

  • context/ - State management
  • types/ - TypeScript definitions
  • constants/ - App constants
  • assets/ - Static resources
  • lib/ - Utility functions

Configuration Files

Located in the root directory:

  • package.json - Dependencies and scripts
  • tsconfig.json - TypeScript config
  • vite.config.ts - Build config
  • tailwind.config.js - Styling config
  • Other config files for linting, formatting, etc.