This project is a fullstack web application boilerplate featuring:
- Strapi CMS (for content and user management)
- NestJS Server (for API, authentication, and business logic)
- Frontend Client (can be plain JavaScript/HTML/CSS, React, Angular, or Next.js)
It is designed for students to learn how to integrate a modern CMS, a robust backend, and a simple frontend, and to extend the system with new features, while delivering a production ready application for our clients.
By working with this project, you will learn:
- Modern Architecture Patterns: Understanding microservices, API gateways, and layered architecture
- CMS Integration: How to use Strapi as a headless CMS with custom content types
- Backend Development: Building REST APIs with NestJS, including authentication and data transformation
- Frontend Development: Creating responsive UIs with vanilla JavaScript, React, Angular or NextJS
- Database Design: Working with PostgreSQL and understanding content type schemas
- API Design: Creating clean, documented APIs with proper error handling
- Authentication: Implementing JWT-based authentication across multiple services
- Data Flow: Understanding how data moves between client, server, CMS, and database
sp2025-cms/
├── client/ # Plain JS frontend
│ ├── index.html # Main HTML file
│ ├── script.js # JavaScript logic
│ └── style.css # Styling
├── cms/ # Strapi CMS (Node.js)
│ ├── src/
│ │ ├── api/ # Content types and API endpoints
│ │ │ ├── article/ # Article content type
│ │ │ └── user/ # User content type
│ │ └── extensions/ # Custom extensions
│ ├── config/ # Strapi configuration
│ └── public/ # Static files and uploads
├── server/ # NestJS backend (Node.js)
│ ├── src/
│ │ ├── articles/ # Articles module
│ │ ├── auth/ # Authentication module
│ │ ├── shared/ # Shared DTOs and utilities
│ │ └── services/ # External service integrations
├── docs/ # Documentation files
└── README.md # This file
- Client communicates with the NestJS server via HTTP (REST API).
- NestJS server communicates with Strapi CMS via HTTP (REST API), acting as a secure proxy and business logic layer.
- Strapi CMS manages content (articles) and users, and exposes its own REST API.
The diagram shows the complete data flow: Client applications (React/Angular/No Framework) communicate with server applications (NestJS/.NET), which in turn interact with Strapi CMS, which stores data in PostgreSQL database.
The documentation has been organized into focused guides for easier navigation:
- How to Install and Setup - Complete installation guide
- How to Configure Environment - Environment variables and database setup
- How to Start the Applications - Running all services
- How the System Works - Complete data flow architecture
- Technology Stack Overview - Deep dive into technologies used
- How to Use the Application - Authentication and content management
- API Reference - Complete API endpoints documentation
- How to Add New Features - Adding content types and API endpoints
- How to Troubleshoot Issues - Common problems and solutions
- How to Expand the Project - Advanced enhancements and extensions
- Learning Resources - Documentation links and tutorials
For a quick start, follow these steps:
- Install and Setup: Complete installation guide
- Configure Environment: Environment setup
- Start Applications: Running all services
- Learn the System: How the system works
- Strapi CMS: Headless CMS for content management
- NestJS Server: Backend API with business logic and security
- PostgreSQL: Primary database for all data storage
- Plain JavaScript Client: Simple frontend demonstration
For detailed technology information, see Technology Stack Overview.
Complete API documentation is available at API Reference.
For development guides and troubleshooting:
For comprehensive learning resources:
Happy coding! 🚀