Your all-in-one real-world Angular starter β built for learning, productivity, and scaling.
Crafted with β€οΈ to showcase real best practices in action: standalone components, signals, routing, i18n, authentication and more.
π₯ Live Demo
Demo example
Whether you're just starting with Angular or looking for a solid base for your next app, this project has you covered.
- β Beginner-friendly: Clean code, best practices, and detailed structure.
- β Production-ready: Real APIs, authentication, modular architecture.
- β Feature-rich: Not just a to-do list! Real-world logic youβll use in any serious project.
- β Made with love: Built by passionate developers, for the community.
npm i npm start
This app connects to a real backend powered by NestJS, PostgreSQL, and Prisma, deployed on Fly.io. You can explore the codebase here.
| β Angular 21 | Using the latest version |
| β Internationalization | i18n with English and Spanish |
| β Authentication | JWT-based, real login flow |
| β Routing & Guards | Functional guards with lazy-loaded routes |
| β Responsive Design | Mobile-first layouts with Flexbox and Grid |
| β APIs | Example integration with the PokeAPI |
| β Shoelace Components | Accessible and modern UI components |
| β NgOptimizedImage | Fast image loading with Angular's directive |
| β SSG & Prerendering | Static Site Generation for index and PokΓ©mon pages |
| β Animations | Smooth transitions with Angular Animations |
| β Clean Architecture | Modular folder structure following best practices |
| β SASS & BEM | Maintainable and scalable styling |
| β Tests E2E | Using Playwright and also with best practices (POM) |
| β Lighthouse | Verifying web performance with defined thresholds |
| π§ͺ Testing | Unit (coming soon!) |
- Component & service testing with Vitest!
We love feedback! If something doesn't work or you think of a cool new feature, open an issue or contribute directly with a PR.
This project is licensed under the MIT License.