Binarystarter Angular is a free, open-source full-stack boilerplate that pairs Angular 17 with Payload CMS v2 on an ExpressJS server inside an Nx monorepo, giving developers a pre-built foundation with authentication, SSR, and a dashboard.
What is Binarystarter Angular?
Binarystarter Angular is a free, open-source starter kit for building full-stack web applications with an Angular frontend, an ExpressJS backend, and the Payload headless CMS. It takes a Git clone and returns a working monorepo with two runnable apps: the Angular client at localhost:4200 and the Express server at localhost:8080. The project runs on Node v20, uses pnpm for dependencies and esbuild as the bundler, and is maintained by Florin Mateescu. It also includes Pulumi infrastructure-as-code files so the same TypeScript source can automate AWS or VPS deployments.
Key Features
- Nx.dev monorepo — Nx v17 organizes the backend and frontend as separate projects inside one workspace, with shared TypeScript libraries so API models are reused by the Angular app instead of duplicated.
- Payload CMS integration — The Express server runs Payload CMS v2, exposing an admin panel at /admin and a REST API at /api on port 8080.
- Angular 17 SSR and SPA — Static pages are server-side rendered, while routes under /c (for example /c/dashboard) behave as a lazy-loaded single-page app for authenticated users.
- Passport.js authentication — A shared auth system secures the Express API, the Angular client, and the Payload admin panel, with ready-made Angular pages for login and account flows.
- Standalone components — The Angular app is built with Angular 17 standalone components and lazy-loaded routes for the dashboard area.
- TailwindCSS and Angular Material — Both styling systems are pre-configured alongside I18n support for multi-language interfaces.
- Automated deployment — Pulumi infrastructure-as-code lets you generate and provision AWS or self-hosted VPS infrastructure directly from TypeScript.
Who is it for?
- Angular developers who want a production-style project structure without manually wiring together Express, a CMS, and a monorepo.
- Full-stack teams adopting Nx who need shared types between an Angular frontend and a TypeScript backend to avoid drift between API models and UI code.
- Startups and product teams building SaaS dashboards that need marketing pages (SSR) plus an authenticated client-side app with content managed from a headless CMS.
- Developers new to Payload CMS who want a reference implementation showing how Payload integrates with Express and an external Angular frontend.
What can you do with Binarystarter Angular?
- Prototype a CMS-driven product: manage content through the Payload admin panel at localhost:8080/admin and consume it in the Angular client via the Payload REST API.
- Build a dashboard app quickly: start from the lazy-loaded /c area that requires authentication and already includes layout, routing, and a dashboard shell.
- Ship to production on AWS or a VPS: use the Pulumi setup to deploy the monorepo to cloud infrastructure without writing separate Terraform or CloudFormation templates.
How does it work?
Clone the GitHub repository, ensure you have Node v20, pnpm, and the Nx CLI installed, then run "pnpm install" followed by "nx serve web" for the Angular app and "nx serve express" for the backend. The two dev servers start on localhost:4200 and localhost:8080 respectively, and the Payload admin becomes available at localhost:8080/admin.
FAQ
Is Binarystarter Angular free?
Yes, the boilerplate is free and open-source. It is published on GitHub under the binarystarter organization and can be cloned, modified, and reused without a license fee.
Which versions does Binarystarter Angular use?
The repo tracks the latest stable releases as of writing: Node v20, Payload CMS v2, Angular 17, Nx.dev v17, and pnpm as the package manager.
Does it include authentication?
Yes. Authentication and authorization are built on Passport.js and shared across the Express API, the Angular client, and the Payload CMS admin panel. The Angular app includes ready-made pages for these flows.
Can I use it for non-Angular projects?
The frontend is specifically Angular, so it is not designed for other frameworks. However, the Payload CMS and Express backend follow standard patterns and could potentially be reused, though the Nx workspace is Angular-oriented.
How do I get support?
The repository is maintained by Florin Mateescu, and the documentation is hosted at binarystarter.com. Questions and feedback can be directed to the maintainer's Twitter profile linked in the README.
