DEV Community

Shanu
Shanu

Posted on

Production-Grade Folder Structure of E-commerce App?

Hey Devs, In this post we are going to explore Production-grade folder structure for an e-commerce website. We will learn how to organize controllers and related components to build a production-grade application. The structure will look like this -

  • Controllers: Handles authentication, user management, product handling, order processing, cart management, payments, and admin tasks.
  • Models: Defines the database schema for users, products, orders, and more.
  • Services: Contains business logic and interacts with the models and controllers.
  • Routes: Maps API endpoints to the corresponding controllers.
  • Middleware: Manages authentication, error handling, and logging.
  • Utils: Provides utility functions for various operations.
  • Configuration: Stores settings for database, server, authentication, and other services.
  • Tests: Ensures the functionality of controllers, services, and routes.
  • Documentation: Provides API and architectural documentation.

Here’s a detailed folder structure for an e-commerce website, including controllers and other essential components:

E-Commerce Website Folder Structure:

src/
├── controllers/
│   ├── auth/
│   │   ├── AuthController.js
│   │   ├── RegistrationController.js
│   │   └── PasswordResetController.js
│   ├── users/
│   │   ├── UserController.js
│   │   ├── UserProfileController.js
│   │   └── UserSettingsController.js
│   ├── products/
│   │   ├── ProductController.js
│   │   ├── ProductCategoryController.js
│   │   ├── ProductReviewController.js
│   │   └── ProductStockController.js
│   ├── orders/
│   │   ├── OrderController.js
│   │   ├── OrderHistoryController.js
│   │   ├── OrderTrackingController.js
│   │   └── OrderCancellationController.js
│   ├── cart/
│   │   ├── CartController.js
│   ├── payments/
│   │   ├── PaymentController.js
│   │   └── PaymentRefundController.js
│   ├── admin/
│   │   ├── AdminDashboardController.js
│   │   ├── ProductManagementController.js
│   │   ├── OrderManagementController.js
│   │   ├── UserManagementController.js
│   │   └── SiteSettingsController.js
│   ├── notifications/
│   │   ├── NotificationController.js
│   │   └── AlertController.js
│   ├── reports/
│   │   ├── SalesReportController.js
│   │   └── UserActivityReportController.js
│   └── common/
│       ├── ErrorHandlerController.js
│       └── HealthCheckController.js
├── models/
│   ├── User.js
│   ├── Product.js
│   ├── Category.js
│   ├── Review.js
│   ├── Order.js
│   ├── Cart.js
│   ├── Payment.js
│   ├── Notification.js
│   └── Report.js
├── services/
│   ├── AuthService.js
│   ├── UserService.js
│   ├── ProductService.js
│   ├── OrderService.js
│   ├── CartService.js
│   ├── PaymentService.js
│   └── AdminService.js
├── routes/
│   ├── authRoutes.js
│   ├── userRoutes.js
│   ├── productRoutes.js
│   ├── orderRoutes.js
│   ├── cartRoutes.js
│   ├── paymentRoutes.js
│   ├── adminRoutes.js
│   ├── notificationRoutes.js
│   └── reportRoutes.js
├── middleware/
│   ├── authMiddleware.js
│   ├── errorMiddleware.js
│   └── loggingMiddleware.js
├── utils/
│   ├── emailUtils.js
│   ├── paymentUtils.js
│   └── validationUtils.js
├── config/
│   ├── databaseConfig.js
│   ├── serverConfig.js
│   ├── authConfig.js
│   ├── paymentConfig.js
│   └── emailConfig.js
├── tests/
│   ├── controllers/
│   │   ├── AuthController.test.js
│   │   ├── UserController.test.js
│   │   ├── ProductController.test.js
│   │   ├── OrderController.test.js
│   │   └── CartController.test.js
│   ├── services/
│   │   ├── AuthService.test.js
│   │   ├── UserService.test.js
│   │   ├── ProductService.test.js
│   │   ├── OrderService.test.js
│   │   └── PaymentService.test.js
│   ├── models/
│   │   ├── User.test.js
│   │   ├── Product.test.js
│   │   └── Order.test.js
│   └── routes/
│       ├── authRoutes.test.js
│       ├── productRoutes.test.js
│       └── orderRoutes.test.js
└── docs/
    ├── apiDocumentation.md
    └── architectureOverview.md
Enter fullscreen mode Exit fullscreen mode

Key Components Explained:

  1. controllers/: Manages the application's request handling. Each subdirectory represents a major functional area.

    • auth/: Handles authentication-related functionalities.
    • users/: Manages user accounts and profiles.
    • products/ (E-commerce): Manages content or product-related functionalities.
    • orders/ (E-commerce): Handles order processing and management.
    • cart/ (E-commerce): Manages shopping cart functionalities.
    • payments/ (E-commerce): Handles payment processing.
    • admin/: Administrative tasks and management.
    • notifications/: Manages notifications and alerts.
    • reports/: Handles reporting and analytics.
    • common/: Contains shared controllers for error handling and health checks.
  2. models/: Contains database schema definitions for the application.

  3. services/: Encapsulates business logic and interacts with models and controllers.

  4. routes/: Defines API routes and associates them with controllers.

  5. middleware/:

Contains middleware for authentication, error handling, and logging.

  1. utils/: Utility functions and helpers used throughout the application.

  2. config/: Configuration files for database, server, authentication, payment, and email settings.

  3. tests/: Contains unit and integration tests for controllers, services, models, and routes.

  4. docs/: Documentation related to API endpoints and system architecture.

This folder structure provides a clear separation of concerns, making it easier to manage, scale, and maintain both blog publishing and e-commerce applications.

Top comments (0)

Some comments may only be visible to logged-in visitors. Sign in to view all comments. Some comments have been hidden by the post's author - find out more