fucking-awesome-angular

📄 A curated list of awesome Angular resources. With repository stars⭐ and forks🍴
https://github.com/correia-jpv/fucking-awesome-angular

Last synced: 3 days ago
JSON representation

Angular
- Builders
 - Angular Builders - This repo consolidates all the community builders (ES Build, Webpack, Jest, Bazel, and Timestamp) for the Angular build facade.
 - Jest Builder
 - Custom Webpack
 - Custom esbuild
 - Bazel - Provides an Angular CLI Builder, which can execute Bazel when triggered by ng build, ng test, etc.
 - Timestamp - This is explained in this 🌎 [article](medium.com/angular-in-depth/angular-cli-under-the-hood-builders-demystified-v2-e73ee0f2d811).
 - ngx-build-plus - Extend the Angular CLI's default build behavior without ejecting, e. g. for Angular Elements.
 - dotenv-run - Seamlessly load environment variables. Supports cli, esbuild, Rollup, Vite, Webpack, Angular, ESM and Monorepos.
 - ng-packagr - Compile and package Angular libraries in Angular Package Format (APF).
 - angular-env-builder - Builder to generate `src/environments/environment.ts` file based on your environment variables.
 - ngx-devkit-builders - This package contains Architect builders used to build and test Angular applications and libraries.
 - angular-static-assets-hash - Create a list of Angular static assets and a hash for each file.
 - ngx-schematic-builder - A tool for building Angular schematic projects. Compiles and packages your custom schematics, preparing them for publishing and use.
 - angular-rspack - <code> 12934⭐</code> <code>   870🍴</code> [Rspack](https://github.com/web-infra-dev/rspack)) plugin and tooling for Angular applications.
 - ngx-electronify - Angular CLI builder that runs your application in the desktop using Electron.
- CLI Tools
 - Official GitHub repository
 - angular-cli-diff - Easily upgrade your Angular CLI applications from one version to another 🚀.
 - ng-chrome-extension - Easily create Angular Chrome Extensions (manifest v3).
 - angular-cli-ssr-diff - Easily upgrade your Angular CLI SSR applications from one version to another 🚀.
 - firebase-framework-tools - Experimental addon to the <code>     ?⭐</code> <code>     ?🍴</code> [Firebase CLI](https://github.com/firebase/firebase-tools/)) to add web framework support.
 - lin - A CLI tool that translates locale JSONs using LLMs.
 - tailwind-init-cli - A one-command setup tool for Tailwind CSS in Angular, React, or Next.js projects!
 - js-stack - Modern CLI for scaffolding production-ready JavaScript full-stack projects, with customization and best-practice presets.
 - svger-cli - A lightweight CLI that transforms SVGs into optimized Angular components with zero dependencies.
 - alterforge - A CLI tool that scaffolds and manages modular microservice architectures with optional React or Angular frontends.
 - @MohamedBouattour/angular-clean-architecture - A CLI tool that generates Clean Architecture–based, production‑ready Angular features with clear, maintainable layers.
 - angular-web-cli - A flexible CLI tool designed to streamline workflows, automate tasks, and provide customizable utilities for developers.
 - Better-Fullstack - Scaffold production-ready fullstack apps in seconds. Pick your stack from 425 options — the CLI wires everything together.
 - i18n-fixer - Framework-agnostic CLI tool that finds hardcoded strings, missing i18n keys, and unused translations.
 - ng-create-with-config - A minimal tool to initialize a new Angular project with pre-configured Prettier, ESLint, Husky and Lint-staged.
 - fanstack - A lightweight CLI and architecture that automatically watches your Firebase functions and generates a strictly typed Angular service.
 - ngTooLazy - A Node.js CLI that scaffolds an Angular app with modern conventions, opinionated architecture, and starter boilerplate (guards, interceptors, layouts).
 - angular-cli-helper - A CLI tool that can initialize a full project structure with a built-in API service, authentication system, and HTTP interceptor.
 - ignite-ng - Start a new Angular 22 app with authentication, guards and a feature-based structure already in place.
- Deployment
 - angular-cli-ghpages - SSR does not work, and there can be some caveats, but you can host your Angular project on GitHub Pages.
 - analog-publish-gh-pages - A GitHub Action for the Deployment of an `Analog.js` app on GitHub Pages.
 - Genezio - The easiest way to write and host a serverless application.
 - ngx-config-orchestrator - Angular library for runtime configuration via external JSON, enabling “Build Once, Deploy Anywhere.”
 - deploy-with-git - Lets you deploy an Angular app directly to the 🌎 [Flux Network](runonflux.com/) from a Git repository.
 - @railwayapp-templates/angular-starter - One-click default Angular TS starter, utilizing Caddy to serve!
 - angular-deploy-bunny - Angular Architect builder (`ng deploy`) that syncs your build to a Bunny.net CDN Storage Zone using SHA256 incremental diffing, then purges the corresponding Pull Zone.
 - front-ready - Detects your Angular build settings, compiles the project, and uploads it to AWS S3 with optimized cache headers using a single command.
 - oSStack Deploy - A high-performance deployment platform inspired by Vercel; features zero-config deployments, automated framework detection, and real-time build streaming.
- Desktop Applications
 - create-tauri-app - Rapidly scaffold out a new Tauri app project.
 - angular-electron - Ultra-fast bootstrapping with Angular and Electron.
 - angular-tauri - Ultra-fast bootstrapping with Angular and Tauri.
 - electron - Build cross-platform desktop apps with JavaScript, HTML, and CSS.
 - neutralinojs - A lightweight, portable framework for building cross‑platform desktop apps with JavaScript, HTML, and CSS, running on Linux, macOS, Windows, Web, and Chrome.
 - nw.js - Chromium + Node.js runtime for native apps using HTML, JavaScript, and direct Node integration.
 - nw-angular-example - An example of integrating Angular with NW.js.
 - wails - Build desktop applications using Go & web technologies, including 🌎 [Angular](wails.io/docs/guides/angular/).
- Mobile Applications
 - ionic-angular-collect-icons - Library to group ionIcons and auto‑generate export files, simplifying addIcons() management in small projects.
 - Official Ionic GitHub repository
 - awesome-cordova-plugins - Native features for mobile apps built with Cordova/PhoneGap and open web technologies. Complete with TypeScript support.
 - ionic-angular-library - A collection of components and services that are useful for developing Ionic Angular applications.
 - IDEA-Ionic8-extra - 🌎 [IDEA's](www.iter-idea.com/) extra components and services built on Ionic 8, and distributed with different NPM packages.
 - ionic-header-parallax - This directive enables a parallax effect on `ion-header` elements to display a cover photo while on top of the page and transition to the normal toolbar when scrolling down.
 - ionx-search-select - Modern Angular/Ionic search & select with standalone components, signals, and full `ControlValueAccessor` support.
 - ionic-insta-api-wrapper - Lightweight Ionic/Cordova library for fetching Instagram content (Stories, Reels, posts, profiles) with login and cookie support.
 - ionic-adv-tooltip - Media-rich tooltips and popovers for Ionic Angular that render templates, images, videos, or live previews on any host.
 - PushApp-Capacitor - A Capacitor plugin for push notifications, in-app messaging, event tracking, and session handling in Ionic/Angular/Capacitor apps.
 - ng-native - Angular apps rendered as real native iOS and Android views.
 - symbiote-native - A stable native runtime utilizing React Native's core engine to drive real iOS/Android stacks directly from Angular.
 - Capacitor - The official cross-platform native runtime that powers modern Ionic applications.
- Official Resources
 - GitHub Repo
- Updating Angular
 - ng-morph - Code mutations in your project or schematics were never easier than now.
 - @fast-facts/ng-update - A GitHub Action that keeps your Angular CLI-based projects up-to-date via automated PRs based on `ng update`.
 - npx-app-updater - Alerts users to available updates when a new version is deployed.
 - ngx-update-app - Angular directive for updating app via service workers.
 - migration-planificator - Plan Angular migrations with precision AST analysis, calculate workload estimates, and generate interactive HTML dashboards.
 - ng-ceiling - Estimates the highest Angular version allowed by declared package compatibility and lists upgrade blockers.
Angular-Inspired Solutions
- Wrappers
 - gapi - Inspired by Angular and intended to provide complex Node.js GraphQL Backend applications with minimal effort.
 - GTPL - TypeScript library for reactive templates using Direct DOM and Proxy, inspired by Vue, Angular AOT, and JSX, in a compact 9KB package.
 - named-slots - Declarative "holes" for React components, inspired by slots in Vue, Svelte, Angular, and WebComponents.
 - npm-clang-format-node - Node wrapper for LLVM Clang's clang-format and git-clang-format native binaries inspired by <code>    98⭐</code> <code>    30🍴</code> [clang-format](https://github.com/angular/clang-format)).
 - reaktiv - Reactive Signals for Python with first-class async support, inspired by Angular's reactivity model.
 - ioc - A powerful and flexible Inversion of Control (IoC) container for TypeScript applications. Inspired by Angular and NestJS.
 - @joanpablo/reactive_forms - A Dart library using a model-driven approach for forms and validations, inspired by Angular's Reactive Forms.
 - sio - Silicia Framework: a fresh approach built upon Ionic, designed to streamline the development of hybrid applications and websites.
 - di - A lightweight dependency injection library, similar to <code> 12060⭐</code> <code>   708🍴</code> [InversifyJS](https://github.com/inversify/InversifyJS)) and <code>  4245⭐</code> <code>   166🍴</code> [typedi](https://github.com/typestack/typedi)).
 - angular-style-injector - A lightweight dependency injection container inspired by Angular's Injector.
 - needle-di - A lightweight, type-safe Dependency Injection (DI) library for JavaScript and TypeScript projects.
 - use-vue-service - Lightweight Vue 3 state management with dependency injection, inspired by Angular services.
 - UnReact.js - A modern framework combining the best of Angular and React for enhanced component communication.
 - indulgent - A lightweight set of TypeScript utilities designed for web development, free of external dependencies and optimized for solid runtime performance.
 - react-di-lite - Lightweight, hierarchical dependency injection for React inspired by Angular’s services.
 - injection-js - A fast, well‑tested JavaScript/TypeScript dependency injection library extracted from Angular’s `ReflectiveInjector`.
 - illuma - Angular-style dependency injection for TypeScript.
 - knifecycle - Manage your Node.js processes' lifecycle automatically with an unobtrusive dependency injection implementation.
 - rgenex - An Angular‑CLI–style generator for React that instantly scaffolds components, hooks, and pages.
 - rxor - Brings reactive signals to React, inspired by Angular Signals, Vue 3's `ref/computed`, and SolidJS.
 - @dmytrodemchenko/Signals - Zero‑dependency, glitch‑free reactive signals for TypeScript and JavaScript using an optimized Angular‑inspired push/pull architecture.
 - weave - A fine-grained reactive, signal-native UI framework.
 - use-component-store - Provides a bare minimum implementation of a component store for React using RxJS.
 - armature - A modern, type-safe HTTP framework for Rust heavily inspired by Angular and NestJS.
 - dom-harness - Framework agnostic DOM component test harness library inspired by Angular CDK's `ComponentHarness`.
 - media-observer - JavaScript observable resize (event listener) inspired by Angular Flex Layout Media Observer.
 - semantic-react-cli - A CLI tool that scaffolds React components, inspired by Angular's `ng generate`.
 - @coregx/signals - Type-safe reactive state management for Go, inspired by Angular Signals.
 - sigsharp - A computational dependency library for .Net inspired by Angular signals.
 - x-injection-reactjs - Powerful IoC library built on-top of InversifyJS inspired by Angular's DI for ReactJS.
Angular Pulse
- Community
  - angular-logos - This repository collects all Angular badges and logos.
  - Made with Angular - A showcase of web apps built with Angular.
  - Angular Popularity Analysis - An AI-era normalized statistical analysis of Angular’s popularity.
  - Angular Hub - Curated list of Angular events and communities.
Architecture and Advanced Topics
- Feature Flags
 - ngx-feature-toggle - Simplify managing feature toggles with this Angular directive.
 - @configcat/js-sdk - ConfigCat SDK for JavaScript provides easy integration for your application to 🌎 [ConfigCat](configcat.com/).
 - @configcat-labs/feature-flags-in-angular-sample-app - Example app that uses ConfigCat.
 - featurit-sdk-angular - Angular wrapper of the JavaScript client for the 🌎 [FeaturIT](featurit.com/) Feature Flag management platform.
 - ngx-feature-proxy - Angular feature flag library with Unleash; reactive and type-safe flag management with minimal setup.
 - ngx-feature-flags - An Angular‑first, enterprise‑ready feature‑flag layer that standardizes how flags are resolved, guarded, and rendered across Angular apps.
 - ngx-circuit - Streamlines feature‑toggle management with flexible options like boolean flags and percentage rollouts.
 - @rollgate/sdk-angular - Angular SDK for 🌎 [Rollgate](rollgate.io), a feature‑flag platform with scheduled releases and gradual rollouts.
 - Toggly - Angular SDK for 🌎 [Toggly](toggly.io/) feature flags.
- GraphQL
 - graphql-code-generator - Code generator for GraphQL schemas and operations, with flexible plugin support.
 - apollo-orbit - A fully-featured GraphQL client for Angular with modular state management.
 - apollo-dynamic-angular - Variant of Apollo Angular that allows dynamic selection sets for queries, mutations and subscriptions via a decorated schema.
 - ngx-graphql-client - A typed GraphQL client for Angular applications with full TypeScript support.
 - apollo-angular - A fully-featured, production ready caching GraphQL client for Angular and every GraphQL server.
- HTTP
 - ng-http-caching - Cache for HTTP requests in Angular application.
 - @ngify/http - Reactive Angular HTTP client with typed responses, streamlined errors, and request/response interception.
 - ng-http-loader - Smart Angular HTTP interceptor - Intercepts automagically HTTP requests and shows a spinkit spinner / loader / progress bar.
 - angular-odata - A fluent API for querying, creating, updating and deleting OData resources in Angular.
 - ng-memento - Makes your application faster by preventing the same HTTP requests from being called again in your Angular project.
 - ngx-suspense-of - Angular directive that adds suspense to your app.
 - ngx-repository - Easily create a strongly typed data client (HTTP REST or Firestore) in your Angular project.
 - ng-rest-client - This library simplifies HTTP requests by letting developers define RESTful API clients with method decorators.
 - ngx-sse-client - A simple **SSE** (Server Sent Events) client for Angular applications to replace the use of `EventSource`.
 - @connectrpc/connect-web - 🌎 [Connect](connectrpc.com/) provides cross-platform API libraries. 🌎 [@connectrpc/connect](www.npmjs.com/package/@connectrpc/connect) offers type-safe Protobuf APIs in TypeScript, and 🌎 [@connectrpc/connect-web](www.npmjs.com/package/@connectrpc/connect-web) adds browser support. See the <code>   166⭐</code> <code>    29🍴</code> [Angular example](https://github.com/connectrpc/examples-es/tree/main/angular)).
 - ng-httpclient-easy-network-stub - An easy class to mock a lot of network requests from the Angular HttpClient.
 - simply-direct - A fullstack communication library that bridges Angular and NestJS through real-time, bidirectional communication powered by WebSockets.
 - ng-error-handling - An Angular module designed for managing HTTP API error responses.
 - active-connect - A connection framework for Node.js, Angular, and WebSockets that simplifies real-time client–server communication with decorators and utilities.
 - ngx-http - A lightweight Angular library that enhances HTTP functionalities by providing types, static values, and utility functions.
 - ng-speed-test - A lightweight Angular library for checking internet speed.
 - ngx-hal - A datastore library with support for handling [HAL-formatted](http://stateless.co/hal_specification.html) HTTP requests.
 - trpc-angular - This repository offers two tRPC-based Angular packages: `@heddendorp/trpc-link-angular` for HttpClient, and `@heddendorp/tanstack-angular-query` for reactive data fetching.
 - my-http-resource - A reactive Angular HttpClient wrapper that streamlines requests by managing state, URL parameters, and configuration.
 - luminara - A modern, universal HTTP client built on native fetch, designed for reliable, scalable, and clear architecture.
 - ngx-cachr - A slim, signal-based caching library for Angular.
 - ngx-data-polling - Angular library with utilities to handle data polling in a declarative and type-safe way.
 - ngx-soap - A lightweight SOAP client built on <code>  3036⭐</code> <code>  1488🍴</code> [node‑soap](https://github.com/vpulim/node-soap)), fully compatible with Angular’s signals, standalone components, and modern features.
 - ngx-http-fetch-tracking - Angular library providing upload progress tracking for the Fetch API backend.
 - fetchquack - Angular‑ready HTTP client with an RxJS Observable wrapper and injection‑context support, offering lightweight Fetch‑based streaming, SSE, and upload/download progress handling.
 - ziflux - A zero‑dependency, signal‑native caching layer for Angular 21+ with stale‑while‑revalidate for resource()—instant navigations, background refreshes, no spinners.
 - ng-signal-query - A type‑safe Angular querying library built on signals that streamlines server state, infinite queries, mutations, and caching with high performance.
 - ngx-lite-cache - An Angular library that caches HTTP responses via HttpClient interceptors to cut redundant requests and boost performance.
 - ng-qubee - Angular query builder with reactive URIs (RxJS + Signals), typed pagination, 495+ tests, and multi‑driver support.
 - ngx-trpc-client - Reworked fork of Analog's <code>  3188⭐</code> <code>   331🍴</code> [TRPC package](https://github.com/analogjs/analog/tree/beta/packages/trpc)).
 - zx-angular-lazy-resource - Lazy helpers for Angular's signal-based `resource()` — defer loading until first access, and await the first settled value as a promise.
 - @stitchapi/angular - Streaming-first StitchAPI bindings that expose typed, validated calls as signals or observables with dynamic delta updates.
 - angular-fetcher - A modern, signal-based Angular library for seamless, type-safe remote API data management, handling fetching, mutations, and error tracking reactively.
 - @some-angular-utils/paginator - Simple, reliable pagination with two inputs: sliding window, jump buttons, disabled edges, and CSS-variable theming.
 - ngx-request-lock - An Angular library that binds a UI flow to the lifecycle of its HTTP requests.
 - ngx-api-client - This configurable `ApiService` extracts and standardizes ad-hoc `HttpClient` logic for handling base URLs, errors, retries, and loading states.
 - ngx-task - Signal-first controlled asynchronous actions for Angular with cancellation, lifecycle cleanup, and explicit concurrency policies.
 - ngx-smart-interceptor - Enterprise-grade, resilient, and intelligent HTTP Interceptor for modern Angular applications.
 - angular-query - An Angular-first data fetching library inspired by TanStack Query that uses Angular Signals for reactive queries, caching, and state management.
 - fetchwise - Simplify API integration with automatic retries, response validation, request and response interceptors, and generated API types.
 - ngx-nest-http - Angular HTTP client with Nest-style controllers, DTO validation, and declarative routing.
 - ngx-signal-query - Signal-first data fetching, caching, and mutations for Angular — inspired by TanStack Query.
 - signal-http-cache - Angular Signal-based HTTP caching library (queries, mutations, TTL, SWR).
 - ngx-esy-jsonapi - A lightweight Angular v20+ adapter for JSON API.
- Micro Frontends
 - micro-frontends-mindmaps - A mindmap summarizing micro-frontend concepts.
 - luigi - Enterprise-ready, technology-agnostic micro-frontend orchestration framework with out-of-the-box navigation and authorization features.
- Module Federation Vite
 - @native-federation/angular-adapter - The official reference implementation and starter template for using Native Federation with Angular.
 - @angulardevelopment/micro-frontend-monorepo - A scalable micro-frontend monorepo architecture using modern tooling (e.g., Nx / Turborepo / Webpack Module Federation / Vite).
 - micro-frontend-vite-vue-react-angular-ts - Multi-framework micro-frontends (Vue, React, Angular) integrated into a Vue.js shell using Module Federation.
 - Zephyr Cloud - An Angular application built with Vite bundler, showcasing fast development experience with modern tooling and 🌎 [Zephyr Cloud](docs.zephyr-cloud.io/) integration.
- Module Federation Webpack
 - ng-dynamic-mf - Truly dynamic modules at runtime with Module Federation.
 - module-federation-plugin - Plugin integrating Module Federation with Angular CLI for loading micro-frontends or plugins.
 - @module-federation/core - Core library allowing developers to share code and resources dynamically across multiple JavaScript applications.
 - webpack-module-federation-with-angular - Guide to learn about Webpack Module Federation with several Angular code demos.
 - mfe-crossframework - Module Federation project with Angular host and cross-framework remotes built without Nx.
 - ngx-mfe - Angular library for working with micro-frontends in Webpack 5 and the Module Federation plugin.
 - angular-mfe-poc - POC demonstrating micro-frontend architecture with Angular acting as the host.
 - web-fragments-migration-demo - Migration path from Angular monolithic SPA app, to micro-frontends featuring Qwik, Analog and Angular SSR.
- Monorepos
 - Nx - A build system with integrated tools and advanced CI features for maintaining and scaling monorepos locally and in CI.
 - Turbo - Turbopack (Rust bundler) and Turborepo (build system/monorepo tools) for JavaScript and TypeScript.
- Server-Side Rendering
 - angular-prerender - A command line tool to prerender Angular Apps.
 - ngx-sitemaps - Generate sitemaps from Angular prerendered routes.
 - ngx-bun - High-performance SSR/SSG adapter for Angular 19+ using Bun's built-in server.
 - bot-ssr - SSR for bots, instant CSR for users — fast loads and clean prerendered HTML for major crawlers, powered by <code>  1160⭐</code> <code>    86🍴</code> [isbot](https://github.com/omrilotan/isbot)).
 - ng-ssr-caching - Cache for server-side rendered pages in Angular SSR.
 - analog-tools - A collection of utilities and libraries designed to enhance and extend AnalogJS.
Development Utilities
- Accessibility
  - astral-accessibility - An open-source accessibility widget written in Angular.
  - angular-vlibras - An Angular library that integrates VLibras to automatically translate content into Brazilian Sign Language (Libras).
  - a11y-libraries - A range of accessibility solutions for Angular.
  - a11yguard - Delivers a zero‑dependency accessibility toolkit with cross‑framework primitives, idiomatic adapters, and a runtime audit mapped to EAA / EN 301 549.
  - ulam - Accessibility utilities for the modern web. Vanilla-first, with optional React, Remix, Vue, and Angular adapters.
  - aria-reach - ARIA accessibility anti-pattern analyzer for shared component libraries.
  - rgaa-source - Axe-core accessibility scanner mapping violations directly to source template lines. Features safe auto-fixes and French RGAA 4.1.2 audit grids.
  - a11y-devtools - Dev-only accessibility devtools overlay/scanner for Angular.
- AI
  - deep-chat - Fully customizable AI chatbot component for your website.
  - abbi-ng-ai-image-descriptor - Angular web app for AI-generated image descriptions. You need an OpenAI API key to use the tool.
  - Official Angular Examples Repo - Angular Examples using 🌎 [GenKit](firebase.google.com/docs/genkit) and AI.
  - agent-rules-kit - A CLI tool for AI that installs and configures rules to guide agents in technology stack best practices.
  - hashbrown - Framework for building joyful, AI-powered user experiences.
  - context7 - MCP Server with up-to-date code documentation for LLMs and AI code editors.
  - ngx-gen-ui - Lightweight Angular directive and service for streaming generative UI content via Firebase AI.

Programming Languages

TypeScript 1,036 JavaScript 61 HTML 25 SCSS 14 CSS 8 C# 6 Go 5 Rust 5 Python 2 C++ 2

ecosyste.ms

Data

Tools

Indexes

Applications

Experiments

Awesome

fucking-awesome-angular

Angular

Builders

CLI Tools

Deployment

Desktop Applications

Mobile Applications

Official Resources

Updating Angular

Angular-Inspired Solutions

Wrappers

Angular Pulse

Community

Architecture and Advanced Topics

Feature Flags

GraphQL

HTTP

Micro Frontends

Module Federation Vite

Module Federation Webpack

Monorepos

Server-Side Rendering

Development Utilities

Accessibility

AI