Awesome list of Angular 2 seed repos, starters, boilerplates, examples, tutorials, components, modules, videos, and anything else in the Angular 2 ecosystem
Table of contents:
- Angular 2
- Universal
- TypeScript
- Dart
- Traceur
- Babel
- ES5
- Ionic 2
- Meteor
- NativeScript
- React Native
- Haxe
- Scala
- Security
- NgRx
Angular is a development platform for building mobile and desktop web applications.
#angular2channel on Freenode IRC Server#angular2hashtag on Twitter- Gitter Channel
- Angular 2 StackOverflow
- @AngularJS on Twitter
- /r/Angular2 Subreddit
- Angular Group on Facebook
- AngularJS on Google+
- AngularAir podcast and live broadcast
- Adventures in Angular podcast
- ng-newsletter email newsletter
- Angular Expo showcase
#ng-2 Slack Channelon AngularBuddies#angular2 Slack Channelon dartlang.slack.com (Sign up)
- @mhevery
- @IgorMinar
- @bradlygreen
- @naomitraveller
- @victorsavkin
- @tbosch1009
- @jeffbcross
- @karaforthewin
- @robwormald
List of Angular experts you should follow on Twitter (in no particular order). This list is by no means complete.
- Jack Franklin
- Thierry Chatel
- Uri Shaked
- Gonzalo Ruiz de Villa Suárez
- Sharon DiOrio
- John Papa
- Dan Wahlin
- Christian Weyer
- Todd Motto
- Tim Ruffles
- Wassim Chegham
- Aaron Frost
- Wilson Mendes
- Jared Williams
- Gerard Sans
- Pascal Precht
- Jeff Whelpley
- Raúl Jiménez
- Ciro Nunes
- Maxim Salnikov
- Deborah Kurata
- Minko Gechev
- {{ add_expert }}
- Official Angular 2 Material Design (GitHub)
- md2 Angular2 based Material Design components, directives and services are Accordion, Autocomplete, Collapse, Colorpicker, Datepicker, Dialog(Modal), Menu, Multiselect, Select, Switch, Tabs, Tags(Chips), Toast and Tooltip.
- ng2-material set of material2 examples and extra components (data table, dialog, ...) built on top of @angular2-material/core
- angular2-mdl Angular 2 components, directives and styles based on Material Design Lite
- mdl-ext Material Design Lite Ext (carusel, grid, lightbox, selectfield, sticky header, ...)
- Official Angular 2 Cheatsheet
- Dart API Cheatsheet
- Angular2 Dart cheatsheet
- Angular 2 Performance Checklist
Directives allow you to attach behavior to elements in the DOM.
Read more »
A component is a directive which uses shadow DOM to create encapsulate visual behavior. Components are typically used to create UI widgets or to break up the application into smaller components.
Read more »
A View is a core primitive used by angular to render the DOM tree.
Read more »
Templates are markup which is added to HTML to declaratively describe how the application model should be
projected to DOM as well as which DOM events should invoke which methods on the controller.
Read more »
Every component gets a change detector responsible for checking the bindings defined in its template.
Read more »
Angular 1.x has two APIs for injecting dependencies into a directive. Angular 2 unifies the two APIs, making the code easier to understand and test.
Read more »
Pipes can be appended on the end of the expressions to translate the value to a different format.
Read more »
WebWorker support in Angular2 is designed to make it easy to leverage parallelization in your web application.
When you choose to run your application in a WebWorker angular runs both your application's logic and the
majority of the core angular framework in a WebWorker.
Read more »
Http is available as an injectable class, with methods to perform http requests. Calling request returns an EventEmitter which will emit a single Response when a response is received.
- Testing Http services in Angular 2 with Jasmine
- Testing UI Components with the TestComponentBuilder
{{ help_out }}
Read more »
- Official Documentation
- Ahead-of-Time Compilation in Angular 2
- Building an Angular 2 Application for Production
- Demystifying Ahead-Of-Time Compilation In Angular 2
- Code Example with Webpack
- Code Example with Rollup
- Official web page
- Angular 2 Webpack Starter from AngularClass
- Angular 2 Webpack from preboot
- Angular 2 Nightly Webpack Starter
- Angular 2 Webpack with Visual Studio ASP.NET Core from Damien Bowden
- Angular 2 Typescript Webpack from schempy
- Angular 2 Webpack Tour of Heroes from michaelbazos - Tour of Heroes official typescript tutorial built with webpack
- Angular 2 Webpack + rxjs + modules
- Angular 2 ASP.NET Core Spa from SteveSandersonMS
- Ionic
- Angular 2
- Auth0
- thoughtram
- Angular 2 Template Syntax Demystified
- AngularClass - Angular 2 Fundamentals
- Egghead.io - Angular 2
- Egghead.io - Build Redux Style Applications with Angular2, RxJS, and ngrx/store
- udemy - Introduction to Angular 2
- udemy - Angular 2 with TypeScript for Beginners: The Pragmatic Guide
- udemy - The Complete Guide to Angular 2
- Pluralsight - Angular 2: First Look
- Pluralsight - Angular 2: Getting Started
- Channel9 - The Future of TypeScript: ECMAScript 6, Async/Await and Richer Libraries
- Channel9 - Creating Cross-Platform Apps with Angular 2
- Code School - Accelerating Through Angular 2
- Keynote – Brad Green, Igor Minar and Jules Kremer
- Testing strategies with Angular 2 – Julie Ralph
- Building native mobile apps with Angular 2 0 and NativeScript - Sebastian Witalec
- Angular 2 Data Flow – Jeff Cross, Rob Wormald and Alex Rickabaugh
- Iterative version upgrade strategies for large Angular applications – Jen Bourey
- Debugging Angular 2 Apps with Batarangle – Yuri Takhteyev and Igor Krivanov
- Building apps with Firebase and Angular 2 - Sara Robinson
- Better concepts, less code in Angular 2 - Victor Savkin and Tobias Bosch
- Modularity and Packaging for Angular2 Applications – Pawel Kozlowski
- Creating realtime apps with Angular 2 and Meteor - Uri Goldshtein
- ng-book 2
fullstack.io - Become a ninja with Angular 2
Ninja Squad - Angular 2 Development with TypeScript
Manning Publications - Angular 2 in Action
Manning Publications - Practical Angular 2
Leanpub - Switching to Angular 2
Packt Publishing - Testing Angular 2 Applications
Manning Publications - Rangle's Angular 2 training
Rangle.io
-
Victor Savkin
- Dependency Injection in Angular 1 and Angular 2
- Writing Angular 2 in Typescript
- Angular 2 Template Syntax
- The Core Concepts of Angular 2
- Two Phases of Angular 2 Applications
- Change Detection in Angular 2
- Better Support For Functional Programming In
- Angular 2 Bits Unified Dependency Injection
- Angular 2 Router
-
AngularClass
-
thoughtram
- Developing a tabs component in Angular 2
- Developing a zippy component in Angular 2
- Resolving Service Dependencies in Angular 2
- Forward references in Angular 2
- Host and Visibility in Angular 2's Dependency Injection
- Dependency Injection in Angular 2
- Routing in Angular 2 Depreciated
- Routing in Angular 2 Revisited
- Angular 2 Template Syntax Demystified - Part 1
- View Encapsulation in Angular 2
- Styling Angular 2 components
- Even better ES5 code for Angular 2
- Writing Angular 2 code in ES5
- The difference between Annotations and Decorators
-
Hristo Georgiev
-
Helgevold Consulting
- Material 2 - Angular team's Material Design components built on top of Angular 2
- Axponents: of Accessible Web Components (Dylan Barrell)
- ng2-bootstrap Native Angular2 Bootstrap 3&4 components
- ng2-charts Beautiful charts for Angular2 based on Chart.js
- ng2-dragula Drag and Drop so simple it hurts!
- ng2-file-upload Easy to use file upload directives
- ng2-handsontable Excel-like data grid / spreadsheet
- ng2-select Angular2 based replacement for select boxes
- ng2-safe-img Very tiny and safe img for Angular 2
- ng2-table Simple table extension with sorting, filtering, paging... for Angular2 apps
- ng2-smart-table Smart data table library with sorting, filtering, pagination & add/edit/delete functions.
- ng2-bs Experiments with Angular 2 directives for Bootstrap.
- ng-lightning Native Angular 2 components & directives for Lightning Design System
- ag-grid Advanced Datagrid for Pure Javascript / AngularJS 1.x / AngularJS 2 / Web Components
- angular2-grid A drag/drop/resize grid-based plugin directive for angular2.
- angular2-jwt Library for sending authenticated HTTP requests and decoding JWTs
- angular2-cookie Library that implements Angular 1.x $cookies service in Angular 2
- angular2-fontawesome Angular2 Components and Directives for Fontawesome
- angular2-locker Library for interfacing with Localstorage/session/cookies with in-memory backup
- angular2-google-maps Angular2 directives for Google Maps
- ng2-radio-group Angular2 directives for radio and checkbox inputs and radio input groups
- ng2-dropdown Dropdown menu for angular2 and bootstrap 3
- ng2-progress-bar Simple progress bar for angular2 and bootstrap 3
- ng2-tabs Tabs control for angular2 and bootstrap 3
- ng2-modal Modal window for angular2 and bootstrap 3
- ng2-paginator Pagination control for angular2 and bootstrap 3
- fuel-ui Bootstrap 4 components and directives for use in Angular 2
- prime-ng Collection of rich UI components for Angular 2
- ng2-ace Ace editor directive made for Angular 2
- ng2-storage A localStorage and sessionStorage wrapper written using ES6 Proxies for Angular 2
- ng2-fontawesome A small directive making font awesome even easier to use.
- ng2-sweetalert2 A wrapper for sweetalert2 for use with Angular 2.
- angular2-text-mask Angular 2 input mask directive
- ng2-fullpage Fullpage scrolling for Angular2 based on fullPage.js
- file-droppa Simple files drop and upload component with files list
- ng2-img-fallback Load placeholder image on image error
- angular2-data-table A feature-rich yet lightweight data-table crafted for Angular2
- angular2-busy Show busy/loading indicators on any promise, or on any Observable's subscription
- ng2-pdf-viewer PDF viewer component
- Covalent - a UI platform built on Angular 2.0 + Material Design
- angular2-infinite-scroll - An Infinite Scroll Directive for Angular2 (based on Observables)
- ng2-card - Card view component for Angular2
- Wijmo 5 - Set of UI components for Angular2
- ng2d3 - Native Angular2 Chart Rendering Framework with D3 for utils
- ng2-swipeable-card - Swipeable card component for Angular2
- ng2-date-picker - Highly configurable date picker built for Angular 2 applications
- ngSemantic - UI components based on Semantic UI
- vmware clarity - Mostly a CSS only framework but some components are ported to Angular 2
- fuel-ui OrderBy and Range pipes ported from Angular 1.x to Angular 2
- ng2-filter-pipe Pipe for filtering arrays
- ng2-pipes Bunch of useful pipes for Angular2
- Node.js
- Slush
- Yeoman
- Faristo
- Dart
- Stagehand
Universal (isomorphic) javascript support for Angular 2
- universal-starter - Angular 2 Universal starter kit by @Angular-Class
TypeScript lets you write JavaScript the way you really want to. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.
- TypeScript Official Website for TypeScript
- REPL Official TypeScript REPL that runs entirely in your browser
- TypeScript Repository (GitHub) Official GitHub Repo for TypeScript
- DefinitelyTyped Repository (GitHub) The repository for high quality TypeScript type definitions.
- Angular 2 Webpack Starter - An Angular 2 Webpack Starter kit featuring Angular 2 (Router, Http, Forms, Services, Tests, E2E), Karma, Protractor, Jasmine, TypeScript, and Webpack by @Angular-Class
- Angular 2 Seed Seed project for Angular 2 apps
- angular2-ts-seed - A complete, yet simple, starter for Angular 2 using TypeScript
- ng2-play A minimal Angular2 playground using TypeScript and SystemJS loader
- NG2 Lab A simple Angular 2 setup using TypeScript, SystemJS and Firebase that also includes a few examples of unit testing and CI with Travis and Saucelabs.
- Angular2Go Angular 2 Go !
- Angular 2 Samples Angular 2.0 sample components
- Todo app with Firebase, OAuth, and Immutable
- Spring Boot and Angular2 tutorial Angular2 practical example based on Rails tutorial.
- Angular 2 Goldilocks seed - A seed project for Angular 2 and TypeScript that is not too simple, yet not too complex. In fact it's just right!
- Angular 2 Starter - Simple Angular 2 Starter with Gulp workflow and Travis CI
- Angular 2 Leaflet Starter - A map application starter based on Angular 2 and Leaflet
- Angular 2 MapboxGL Starter - Another map application starter based on Angular 2 and MapboxGL JS
- Angular 2 reconnecting websockets quickstart - Simple counter using 2-way or 1-way reconnecting websockets communication
- ng2-start - Minimal setup to start creating an angular2 application
- ng2Boilerplate - The ultimate Angular 2 bootstrap single page app - touches on all key and advanced aspects of Angular2.
- angular2-demo Minimal Angular2 Demo using TypeScript / Sass / Npm Tasks
- Angular 2 Dashboard Starter - Ready to use dashboard control panel seed project based on Angular 2 and AdminLTE bootstrap theme.
- ng2-admin - Beautiful admin panel framework based on Angular 2, Bootstrap 4 and Webpack
- Angular 2 quickstart seed
- Angular 2 full code coverage - Solid tested SystemJS and gulp workflow ready for your code using Angular2 final release (2.1.0) .. Demonstrates unit testing and full code coverage
- Angular 2 webpack - Tour of Heroes official typescript tutorial built with webpack
- ng2-boiler - A bare-bones simple starter with Angular2, TypeScript and Webpack configured.
- Angular Webpack Starter - Angular Webpack Starter with AoT compilation, Lazy-loading, and Tree-shaking
- Reaper - Angular 2 Webpack Starter Boilerplate w/o 2269 dependencies
- famn - Angular 2 + FeathersJS application framework for both client and server side
- {{ add_your_repo }}
Ionic is the beautiful, open source front-end SDK for developing hybrid mobile apps with web technologies.
- Ionic Framework Official Website for Ionic Framework
- Ionic Documentation Official for Ionic Framework
Apache Cordova is a popular mobile application development framework using CSS3, HTML5, and JavaScript instead of relying on platform-specific APIs.
- Cordova Framework Official Website for Apache Cordova
- Cordova Documentation Official Documentation for Apache Cordova
- Angular 2 Seed CLI Admin (Template) Multiplatform Angular 2 project (Web, Mobile and Desktop) with a admin template applied.
Dart is an open-source, scalable programming language, with robust libraries and runtimes, for building web, server, and mobile apps.
- Dart Official Website for Dart
- Dartpad Dartpad lets play with Dart on-line, in a zero-install, zero configuration environment.
- Dart Organization (GitHub) Official GitHub Organization for Dart
- Pub Repository of packages of software for the Dart programming language.
- Dartisans The Official Dart Google+ community
- Dart Slack Channel The Official Dart Slack channel.
- Angular 2 Dart Quickstart A minimal quick start project.
- Hackernews App A HackerNews application made with Angular 2 for Dart
- Router Demo A basic example of Angular 2 router.
- {{ add_your_repo }}
Traceur is a JavaScript.next-to-JavaScript-of-today compiler
- Traceur Repository (GitHub) Official GitHub Repo for Traceur
The compiler for writing next generation JavaScript.
- Babel Official Website for Babel
- REPL Official Babel REPL that runs entirely in your browser
- Babel Repository (GitHub) Official GitHub Repo for Babel
- babel-angular2-app A skeleton Angular 2 app built with Babel and Browserify.
- angular2-fullstack-starter A full stack skeleton Angular 2 app built with Webpack/Babel.
- angular2-es6-starter A skeleton Angular 2 ES6 application built with Babel, Webpack, Gulp.
- angular2-es-seed A complete, yet simple, starter for Angular 2 using ES2016.
- angular2-babel-quickstart The super simple Angular 2 quickstarter with ES6/Babel
- {{ add_your_repo }}
- angular2-es6-todomvc Angular 2 TodoMVC implementation with ES6.
- ng1-ng2-webpack-lazy-uirouter Hybrid lazy-loading Angular1 + Angular2 using UI-Router, Webpack2 and Babel.
- {{ add_your_repo }}
- babel-preset-angular2 Babel presets for Angular2
- babel-plugin-type-assertion An experimental babel transformer plugin for rtts_assert
An ECMAScript language that includes structured, dynamic, functional, and prototype-based features.
Build Realtime Web and Mobile Apps With Angular and Meteor
- Angular Meteor Official Website for Angular Meteor
- Angular 2 Meteor
Build truly native iOS, Android and Windows Phone apps with Javascript and CSS. Try NativeScript open-source framework for cross-platform development.
- NativeScript Official Website for NativeScript
- Using NativeScript
React Native enables you to build world-class application experiences on native platforms using a consistent developer experience based on JavaScript
- React Native Official Website for React Native
Haxe is an open source toolkit based on a modern, high level, strictly typed programming language, a cross-compiler, a complete cross-platform standard library and ways to access each platform's native capabilities. General purpose language, with Haxe, you can easily build cross-platform tools targeting all the mainstream platforms natively. "Write once compile anywhere", with strong easily extendable macro system and powerfull, highly optimizing compiler with DCE (and f.e. using inline constructors). Can be used for server side rendering and in isomorphic way - possible to share the same source code compiling into client side in javascript and server side in pyhton (or java/php/node - can be choosen later/changed at scaling). Haxe code can contain (inline) any target language fragments (can be used to step by step porting), the externs mechanism provides access to the native APIs and libraries in a type-safe manner. Server, client, mobile (Android and iOS at once), desktop, embedded (Raspbery, award winning TIVO set top boxes), Playstation ... all can be reached natively with much less typing, more error-proof, more stable and compile-time type checked code even for non type-safe targets (f.e. JavaScript, PHP)!
- Haxe.org
- Haxe on Wikipedia
- Haxe Playground
- Haxe compiler targets compiler targets: C++, C#, Java, Python, PHP, ActionScript 3, and Flash or Neko bytecode
- Haxe Usage Survey results
- Haxe discussion group - community
- Haxe and Node.js
- Haxe: working with JavaScript libraries
- Learn haxe in Y minutes
- A success story for Haxe - about porting JavaScript to haxe targeting both JavaScript and C# "without interrupting the development of actual game by the rest of the team!", "AWESOME BONUS", "there are only benefits"
- News And Information For Haxe Developers
- {{ help_add_resources }}
- angular2haxe Haxe Language Bindings for Angular 2
- {{ add_your_repo }}
General purpose language; multiparadigm (object-oriented, functional, concurrent elements); statically typed, type-safe; focus: Web services.
- Angular 2 with OpenID Connect Implicit Flow from Damien Bowden
- Angular 2 bootstrap4 OAuth2 Webpack from Michael Oryl
- Angular 2 OAuth2 OIDC from Manfred Steyer
- Angular 2 authentication sample from auth0-blog
- Comprehensive Introduction to @ngrx/store
- Adding Redux With NgRx/store and Angular2 - Part 1
- Adding Redux with NgRx/store to Angular2 – Part 2 (Testing Reducers)
- Angular 2 & NgRx/store: The NgModel In Between Use Case (from Angular 1)
- Angular 2, Ngrx/Store & Ngrx/Effects – Intro To Functional Approach For A Chain Of Actions
