Data

Tools

Indexes

Applications

Experiments

Awesome

An open API service indexing awesome lists of open source software.

awesome-angular

:page_facing_up: A curated list of awesome Angular resources
https://github.com/PatrickJS/awesome-angular

Last synced: 9 days ago
JSON representation

  • Development Utilities

    • Performance

      • ngx-script-optimizer - A lightweight Angular library designed to supercharge your third-party script handling.
      • esbuild Bundle Size Analyzer - Visualize the contents of your esbuild bundle.
      • ngx-unused - Find declared but unused Angular classes in your codebase.
      • sonda - Universal visualizer and analyzer for JavaScript and CSS.
      • ng-reactive-lint - An Angular-specific linter enforcing optimal reactivity patterns with Signals and RxJS.
      • ngx-network-monitor - A lightweight Angular service to monitor network status: online/offline, connection quality (2G/3G/4G/5G), and ping latency.
      • ng-queuex - Experimental Angular ecosystem with React-like scheduler and signal-driven directives for fine-grained change detection.
      • ng-event-plugins - A tiny library for optimizing change detection cycles for performance sensitive events.
      • ngx-performance-diagnostics - Spot performance bottlenecks, excessive change‑detection cycles, and memory leaks in Angular apps with zero setup.
      • angular-rust-compiler - High-performance Angular AOT compiler written in Rust, providing full static compilation of Angular components and directives.
      • ngx-idle-monitor - A lightweight Angular service for tracking user activity, managing session timeouts, and syncing idle state across tabs.
      • ngx-worker-bridge - A lightweight, zero-boilerplate reactive bridge for Angular and React that makes Web Workers (Dedicated and Shared) as simple as calling a regular method.

    • Runtime

      • falso - All the Fake Data for All Your Real Needs.
      • runtime-config-loader - Angular library that provides an easy way to load a configuration JSON file for runtime configuration.
      • ngs-json-utils - A lightweight Angular library for easy JSON manipulation—deep clone, serialize, and deserialize with TypeScript support.
      • lbx-change-sets - Automatically tracks entity changes using an extendable base repository.
      • angular-compile - Angular Dynamic Compile. Convert strings to Angular components.
      • ngx-signal-hub - Lightweight Angular hub unifying callbacks with signal‑based event observation.
      • ngx-json-reader - Angular 17+ JSON reader/editor with multi-URL comparison and diffing.
      • ngx-compare-object - Angular utility to compare an original object with its modified version.
      • deepequalspure - JavaScript object deep equals service for Angular projects.
      • ng-noop - A minimal, DOM‑less Angular platform for custom runtimes, CLIs, servers, and experimental renderers.
      • ngx-api-mimic - This library allows you to mock data and simulate a fake API using Angular’s HTTP Interceptor.

    • SEO

      • ngaox - Boost Angular apps with seamless content integration, optimized SVGs, advanced SEO, and efficient social media management.
      • ngx-seo - Kwerri OSS: samvloeberghs.be + ngx-seo.
      • seo-analyzer - The library for analyze a HTML file to show all of the SEO defects.
      • Angular React SEO - Angular & React Examples SEO (Search engine optimization).
      • unhead - Full-stack `<head>` management for Angular applications.
      • seo-manager-pro - A powerful SEO manager for Angular, React, Vue, and Vanilla JS to easily set tags and structured data.
      • @davidlj95/ngx-meta - Quickly set Angular site metadata (meta tags, Open Graph, X Cards, JSON-LD) with SSR support.

    • Styling

      • Angular-Material-Tailwind-Integration - A stable, themeable set of CSS custom properties mapping Material Design System tokens to Tailwind CSS utility classes.
      • element-identifier - Create reliable, distinct CSS selectors to target DOM elements, and utilize a web component for visual inspection and selection.
      • ngx-angora-css - A JavaScript-based CSS framework that dynamically generates styles on page load.
      • ngx-classed - A library allows you to dynamically add or remove classes based on state.
      • ngx-css - An Angular abstraction for [Squid CSS](https://github.com/squidit/css).
      • panda - Easily use Panda, CSS-in-JS Framework, with Angular with its dedicated [integration](https://panda-css.com/docs/docs/installation/angular).
      • Super JSS - Super JavaScript Stylesheets is a tiny Angular runtime library that generates atomic CSS with breakpoints and theming.
      • ngx-mq - A declarative library that uses signals and the native [matchMedia API](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia) to manage media queries, with built-in breakpoint presets for Tailwind, Bootstrap, and Angular Material.
      • tokiforge - Framework-agnostic design token engine for React, Vue, Angular, Svelte & vanilla JS.
      • Theme-Kit - A unified design‑token SDK that centralizes your colors, typography, and spacing for seamless use across React, Vue, Angular, or any JavaScript project.
      • prime-ng-theme-fe - A visual theme designer for PrimeNG.
      • ngx-responsive-signals - Signal-based responsive breakpoints for Angular.
      • Material Theme Builder - Real-time Angular Material theming for your app.
      • ngx-theme-stack - Modern, SSR-safe Angular library for managing dark mode, light mode, and custom themes via Angular Signals.
      • ukit-css - JIT utility-first CSS engine — Tailwind-style on-demand class generation for any frontend stack (React, Vue, Angular, Svelte, Next.js, Astro, plain HTML).

  • External Lists

  • Framework Interoperability

    • Cross-Framework Integration

      • Stencil - Generate Angular component wrappers for your web components.
      • gong - Full‑stack framework with Go (Gin, Gorm, pure SQLite) backend and Angular Material frontend.
      • ngx-reactify - Library to make running Angular and React applications together easy.
      • ng-react-bridge - A lightweight Angular package that enables developers to seamlessly render React components inside Angular components using a directive.
      • @ngeenx/ngx-react - Embed React components or apps into Angular projects.
      • zero-angular - Angular bindings for [Zero](https://zero.rocicorp.dev/).
      • @retejs/angular-plugin - Angular plugin with a classic preset of node, connection, socket, and control components, built on [Rete.js](https://retejs.org/).
      • detector - A zero-dependency, TypeScript-first library for fast, universal detection of platforms, frameworks, browsers, and capabilities.
      • @oguimbal/ngx-react - Enables smooth integration of React and Angular components, or effortless migration between the two.
      • AnQst - Generates Angular services and native Qt widgets from a shared DSL, letting Angular apps compile into QWidget‑based C++ UIs via the AnQst CLI and host libraries.

    • External Integration

      • Sentry - A developer-first error tracking and performance monitoring platform.
      • GoodData - Integrate GoodData Visualizations into your Angular application.
      • DataDog - With the Datadog Angular integration, you can resolve performance issues quickly.
      • Elastic - Real User Monitoring JavaScript agent with Angular applications.
      • HyperFormula - Headless spreadsheet engine in TypeScript for formula parsing/evaluation, with an Angular integration demo.
      • Strich - A JavaScript library for real-time, multi-format barcode scanning directly in the web browser.
      • Pega - Angular SDK includes a bridge and DX components that connect the ConstellationJS Engine to an Angular-based design system.
      • Bit - Leverage Bit to build composable software.
      • Partytown - Relocate resource intensive third-party scripts off of the main thread and into a web worker.
      • Postcat - A lightweight, extensible API tool based on Angular and Electron.
      • angular-twitter-timeline - Angular Public Twitter Timeline Widget.
      • limitless-angular - A collection of powerful Angular libraries designed to enhance the Angular ecosystem and help developers build better applications with a focus on `Sanity.io` integration.
      • stream-chat-angular - Angular Chat SDK ➜ Stream Chat. Build a chat app with ease.
      • ngx-notion-cms - Render your Notion content through your Angular application as a CMS.
      • angular-rsocket - Connect to an [RSocket](https://rsocket.io/) server, handle streams/messages, and manage tokens via a provider.
      • ngx-wagmi - Connect Angular apps to Blockchain wallets and contract interactions.
      • Otter - Highly modular Angular framework with units for localization, testing, customization, and CMS-driven dynamic configuration.
      • fusio-sdk-javascript-angular - This SDK enables Angular apps to integrate with [Fusio](https://www.fusio-project.org/), used by projects like the [backend](https://github.com/apioo/fusio-apps-backend) and [developer](https://github.com/apioo/fusio-apps-developer).
      • ng-storyblok - A simple way to integrate [Storyblok](https://www.storyblok.com/) into your Angular application.
      • foblex2D - Angular library for 2D geometry with utilities for points, lines, vectors, shapes, and transformations, used in `Foblex Flow`.
      • @elastic/apm-rum-angular - Elastic APM Real User Monitoring for Angular applications.
      • Bloomreach Angular SDK - Provides simplified headless integration with [Bloomreach Content](https://www.bloomreach.com/en/products/content) for Angular-based applications.
      • ngx-signalr-websocket - A lightweight ASP.NET SignalR client for Angular.
      • Partytown - Relocate resource intensive third-party scripts off of the main thread and into a web worker.
      • Keploy - Record test cases and mocks by interacting with the Angular UI, and then test them using Keploy.
      • alterior - Isomorphic TypeScript framework for building modular services with seamless Angular integration.
      • 23blocks SDK - Build full-stack apps 10x faster with modular backend blocks.
      • DataDog - With the Datadog Angular integration, you can resolve performance issues quickly.
      • Elastic - Real User Monitoring JavaScript agent with Angular applications.
      • NativeScript - Provides platform APIs directly to the JavaScript runtime (with strong types) for a rich TypeScript development experience.

    • Wrappers

      • ckeditor5-angular - An official CKEditor 5 rich text editor component for Angular 2+.
      • ckeditor4-angular - An official CKEditor 4 rich text editor component for Angular 2+.
      • ngx-grapesjs - Angular wrapper library for [GrapesJS](https://grapesjs.com).
      • gojs-angular - A set of Angular components to manage [GoJS](https://gojs.net/latest/index.html) Diagrams, Palettes, and Overviews.
      • ngx-three - Use [Three.js](https://threejs.org) with your Angular project in a declarative way.
      • ngx-socket-io - [Socket.IO](https://socket.io/) module for Angular.
      • angular-three - Angular Renderer for [THREE.js](https://github.com/mrdoob/three.js).
      • ngx-sentry - Angular wrapper for [Sentry JavaScript SDK](https://github.com/getsentry/sentry-javascript).
      • ngx-fabric-wrapper - Angular wrapper library for [Fabric](http://fabricjs.com/).
      • ngx-three-globe - An Angular library that provides an interactive, 3D globe visualization built using `Three.js`.
      • ngx-tagify - Angular library that wraps [Tagify](https://github.com/yaireo/tagify/).
      • ngx-xapi - Lightweight Angular wrapper for [xAPI](https://xapi.com/).
      • ngx-pendo - A simple wrapper to load Pendo in Angular.
      • ngx-surreal - Lightweight Angular wrapper for the [SurrealDB](https://surrealdb.com/) JavaScript SDK.
      • ngx-filesize - Angular wrapper for [filesize.js](https://filesizejs.com/).
      • ngx-katex - A simple Angular wrapper for [KaTeX](https://github.com/KaTeX/KaTeX).
      • ngx-chessground - Angular wrapper for [chessground](https://github.com/ornicar/chessground).
      • ngx-barcode6 - An Angular component for Angular 9+ for creating 1-D barcodes based on [JsBarcode](https://github.com/lindell/JsBarcode).
      • ngx-viz - Simple Angular [viz.js](https://viz-js.com/) wrapper to render [DOT graphs](https://graphviz.org/doc/info/lang.html).
      • ngx-serializer - Angular wrapper of `@paddls/ts-serializer` library.
      • ngx-pocketbase - PocketBase Angular SDK for interacting with the [PocketBase API](https://pocketbase.io/docs). Based on the [PocketBase JavaScript SDK](https://github.com/pocketbase/js-sdk).
      • zag-angular - Angular wrapper for [zag](https://github.com/chakra-ui/zag).
      • seatsio-angular - Angular wrapper for rendering [Seats.io](https://www.seats.io/) seating charts.
      • ngx-kel-agent - Client library for Angular applications to integrate with [kel-agent](https://github.com/k0swe/kel-agent).
      • ngx-d3 - A [D3](https://d3js.org/) wrapper service for Angular applications inspired by [d3-ng2-service](https://github.com/tomwanzek/d3-ng2-service).
      • @interopio/ng - [IO Connect](https://interop.io/) Angular wrapper to simplify initializing and using IO Connect libraries in projects.
      • ngx-xyflow - Angular wrapper of [xyflow](https://github.com/xyflow/xyflow).
      • d3-cloud-angular - D3 Cloud component for Angular built upon [d3-cloud](https://github.com/jasondavies/d3-cloud).
      • lyne-angular - Angular wrapper for the [Lyne Web Components](https://github.com/sbb-design-systems/lyne-components).
      • ng-elementum - A modern fork of `@angular/elements` that enhances the integration of Angular components with the Web Components standard.
      • ngx-webdatarocks - Angular wrapper for [WebDataRocks](https://www.webdatarocks.com/). Follow this [example](https://github.com/WebDataRocks/pivot-angular) to integrate the WebDataRocks web reporting tool.
      • ngx-neoline - Angular wrapper for [NeoLine](https://tutorial.neoline.io/) N3 dAPI, detecting provider, awaiting READY, and exposing typed methods.
      • angular-email-editor - Drag-n-drop email editor by [Unlayer](https://unlayer.com/embed) as an Angular wrapper component.
      • cytoscape-angular - A production-ready Angular library providing sophisticated graph visualization capabilities using [Cytoscape.js](https://js.cytoscape.org/).
      • ngx-virtual-select - Component to integrate [Virtual Select](https://github.com/sa-si-dev/virtual-select) in Angular.
      • chat-widget-adapters - Angular wrapper for the [LiveChat](https://developers.livechat.com/) Chat Widget (JavaScript API).
      • angular-calendly - A modern Angular library that provides standalone components for embedding [Calendly](https://calendly.com/) scheduling widgets.
      • ngx-open-web-ui-chat - Angular component library for embedding [Open WebUI](https://openwebui.com/) chat with Socket.IO streaming, conversation history and markdown support.
      • ngx-highlight-js - Angular wrapper around [highlight.js](https://highlightjs.org/) for syntax highlighting.
      • ngx-apexgantt - Angular wrapper for [ApexGantt](https://github.com/apexcharts/apexgantt), a JavaScript library to create Gantt diagrams built on SVG.
      • ngx-linkifyjs - Angular [Linkify](https://github.com/nfrasser/linkifyjs) wrapper to auto-detect URLs, emails, hashtags, and mentions and convert them into HTML links.
      • ngx-apexsankey - Angular wrapper for [ApexSankey](https://github.com/apexcharts/apexsankey) - A JavaScript library to create Sankey diagrams.
      • ngx-apextree - Angular wrapper for [ApexTree](https://github.com/apexcharts/apextree) - a JavaScript library for creating organizational and hierarchical charts.
      • simplyfire - A lightweight Firestore API for Firebase cloud functions & Angular.
      • ngfire - A minimal Angular wrapper around the Firebase JS SDK.
      • ngx-simple-text-diff - Angular library for displaying text differences using the [diff](https://www.npmjs.com/package/diff) library.
      • rive-angular - Modern Angular wrapper for [Rive](https://rive.app/) animations with reactive state management, built with Angular signals and zoneless architecture.
      • @foisit/angular-wrapper - The AI-Powered Conversational Assistant for Angular Applications.
      • ngx-vis - Angular wrapper for [vis.js](https://visjs.org/).
      • atlas-editor - Angular wrappers that dynamically load the React‑based Atlaskit editor and side‑navigation web components.
      • flowchart-sequence-designer-angular - Angular wrapper for [flowchart-sequence-designer](https://github.com/ag-gr-hub/flowchart-sequence-designer).

  • Learning Resources

Programming Languages
TypeScript 1,354 JavaScript 69 HTML 47 SCSS 20 CSS 9 C# 5 Go 5 Rust 4 Shell 3 Vue 2
Categories
Third Party Components 1,076 Table of contents 432 Development Utilities 303 Learning Resources 128 Angular 117 Architecture and Advanced Topics 96 Angular Pulse 93 Framework Interoperability 91 Site Templates 76 State Management 73 Security and Authentication 71 Testing 62 Underlying Technologies 57 Angular-Inspired Solutions 36 External Lists 4
Sub Categories
Angular 255 Third Party Components 177 Wrappers 91 UI Libraries 72 Free Templates 67 Form Controls 67 Mixed Utilities 65 Internationalization 56 AI 49 Animations 43 HTTP 43 Forms 43 Data Grids 41 Authentication 40 Other State Libraries 39 Google Developer Experts on X 38 Blogs 37 CLI Tools 36 Editors 35 Notifications 33 Scroll 32 Generators and Scaffolding 31 RxJS 30 Charts 30 External Integration 30 Loaders 29 Icons 28 Dates 28 Analytics 27 TypeScript 27 UI Libraries built on Tailwind CSS 25 YouTube Channels 25 Carousels 24 NgRx 23 Form Validation 23 Layout 23 Helpers 22 DOM 22 Directives 22 Official Resources 22 Component 22 Images 21 UI Libraries built on Material 21 Books 19 Training 19 File Upload 19 IDE Extensions 19 Drag and Drop 19 Media 18 Router 18 Feature Flags 18 Accessibility 18 Builders 18 Calendars 17 Community 17 Visual Effects 17 UI Library and Framework Ionic 17 Captcha 17 Deployment 16 Storage 16 Viewers 16 Performance 16 Markdown 15 E2E 15 Styling 15 Updating Angular 15 Modals 14 Maps 14 Code Analysis 14 Angular Team on X 14 Linting 14 Pipes 14 QR Codes 13 Onboarding and Product Tours 12 JSON Forms 12 Runtime 11 Keyboard Mouse 11 NGXS 11 Security Best Practices 11 Role-Based Access Control 10 Documentation Tools 10 Desktop Applications 10 UI Libraries built on Bootstrap 10 Cross-Framework Integration 10 Tooltips 10 Payments 10 Server-Side Rendering 10 Exercises 9 Cheat Sheets 9 Loggers 9 Paid Templates 9 GraphQL 9 Angular Experts on X 9 UI Primitives 9 Debugging 8 Podcasts 8 Module Federation 8 Cookies 8 Certification Programs 7 PDF 7 SEO 7 Newsletters 6 Networking 6 CSV 5 Micro-Frontends 5 Editor Components 4 Layout Components 4 Printing 4 Guides 3 Style Guides 3 Monorepos 3 Editor and IDE Extensions 2 Bluesky 1
Keywords
angular 744 typescript 220 javascript 89 angular2 68 ngx 55 react 52 rxjs 44 library 41 ui 32 angular-components 31 vue 31 material 28 i18n 27 angular-material 26 components 26 angular-library 25 angular-cli 24 ngrx 23 tailwindcss 23 component 21 angular17 20 testing 20 svelte 19 frontend 19 npm 19 nodejs 18 state-management 17 admin-dashboard 17 signals 17 bootstrap 16 ng 16 icons 16 forms 16 angular4 15 angular5 15 translation 15 internationalization 15 jest 15 template 14 svg 14 angular18 14 nextjs 14 angular7 13 angular-component 13 grid 13 ionic 13 css 13 charts 13 material-design 13 ssr 12