A list of helpful material to develop using Angular
Current Angular version:
UPDATED REPO LINKS!
For Angular 1.x education please visit https://github.com/timjacobi/angularjs-education
For Angular 2+ education please visit https://github.com/timjacobi/angular-education
Contributing
Please send a pull request to add any links and use the issues for general questions, thanks!
Introduction
- Official Angular Design Docs (Google Drive)
- Official Angular 2 - 5 min quickstart
- Angular2 - First Impressions (Minko Gechev)
- Angular 2 Series: Introduction (Ionic Team)
- Video: Keynote on Angular 2 (Misko Hevery, Rado Kirov)
- All About Angular 2.0 (Rob Eisenberg)
- The awesomeness of Angular 2 (Ciro Nunes)
- Angular 2 and the future of HTML5 apps (Brad Green)
- From Angular 1.x ng-repeat to Angular 2 NgFor with Component
- Migrating A Component From Angular 1.x to Angular 2
- Angular 2: Attribute @Directive() & Creating An Infinite Scroll Directive
- Angular 2 – Communication Between Components & Components Design
Angular 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)
- Comprehensive Introduction to @ngrx/store
- Video: @ngrx/store in 10 minutes (egghead.io)
Angular Explained
- Exploring Angular 2
- Two Phases of Angular 2 Applications (Victor Savkin)
- Angular 2 Template Syntax (Victor Savkin)
- Change Detection in Angular 2 (Victor Savkin)
- Functional Programming in Angular 2 (Victor Savkin)
- Unified Dependency Injection (Victor Savkin)
- The Core Concepts of Angular 2
- Angular 2 Template Syntax (John Lindquist)
- Angular 2 - Binding (es5)(John Lindquist)
- Angular 2 - Hello World (es5)(John Lindquist)
- Video: Zone.JS (Brian Ford)
- Angular 2 Series: Components (Ionic Team)
- Video: Angular Router (Brian Ford)
- The difference between Annotations and Decorators (Pascal Precht)
- Video: Data binding in Angular 2 (Misko Hevery)
- Dependency Injection in Angular 2 (Pascal Precht)
- Angular 2 Server Rendering (gdi2290 and Jeff Whelpley)
- Shadow DOM Strategies in Angular 2 (Pascal Precht)
- Routing in Angular 2 (Pascal Precht)
- Styling Angular 2 Components (Pascal Precht)
- Even better ES5 code for Angular 2 (Pascal Precht)
- Angular 2 Template Syntax Demystified - Part 1 (Pascal Precht)
- Introduction to Angular 2 – The fundamentals of Components (Aleksey Novik)
- Host and Visibility in Angular 2's Dependency Injection (Pascal Precht)
- Angular 2 Cheat Sheet (WIP)
- Forward References in Angular 2 (Christoph Burgdorf)
- Resolving Service Dependencies in Angular 2 (Pascal Precht)
- Angular 2: Event Emitters(Shawn Mckay)
- Angular 2: Properties(Shawn Mckay)
- Angular 2: Pipes(Shawn Mckay)
- How to set up Angular2 unit tests (Dima Kuzmich)
- How does Angular 2 Change Detection Really Work ?
- How to run Angular 2 in Production Today ?
- The Ultimate Angular CLI Reference Guide (Jurgen Van de Moere)
Angular Forms
- Video: AngularJS 2.0 Forms - Extending Todo app with Forms Validation (Ajden Towfeek)
- Forms in Angular 2 (Victor Savkin)
- Angular 2 Forms (David East)
- The Ultimate Guide to Forms in Angular 2 (ng-book)
- Angular 2 Form Builder and Validation Management (Cory Rylan)
- JavaScript/JSON powered FORMS for ANGULAR 2 (ng2-formly)
- Introduction to Angular 2 Forms - Template Driven, Model Driven or In-Between
Angular Docs
Angular applications documentation tools
-
Compodoc : "The missing documentation tool for your Angular 2 application", integrate well with npm scripts
-
AngularDoc : Website that display "Architectural analysis and visualization for Angular 2 projects", integrate only with a github repository
Angular Integrations
Tutorials
- Video: AngularJS 2.0 Overview - ToDo Application in 20 minutes
- Video: An Angular2 Todo App: First look at App Development in Angular2
- Creating a Super Simple Todo app Using Angular 2 (Sandeep Panda)
- Developing A Tabs Component in Angular 2 (Pascal Precht)
- Developing a zippy component in Angular 2 (Pascal Precht)
- Angular 2 Singleton Service (Raúl Jiménez)
- Angular 2 Shadow DOM Emulation (Dylan Barrell)
- Injecting Parents into Angular2 Components (Dylan Barrell)
- An Introduction to Angular 2 (Jesus Rodriguez)
- Video: Getting started with Angular 2 developer preview
- Video: Creating d3 components with Angular2 and TypeScript (gdi2290 and Aysegul Yonet)
- Video: Migrating an Angular 1.x app to Angular 2 (David East)
- Complete guide of Angular 2
- recursive treeview in angular 2.0 (Torgeir Helgevold)
- How to publish a library for Angular 2 on npm (Olivier Combe)
- Angular 2 Observable Data Services (Cory Rylan)
- Angular 2 Text Snippet Directive (Cory Rylan)
- In-depth Guide: Creating Your First Angular 2 Component (Thomas Greco, Scotch.io)
- @AngularClass - Angular 2 Fundamentals
- @TutorialEdge - Angular Fundamentals
- Angular 2 Tutorial: Create a CRUD App with Angular CLI (Todd Motto, Jurgen Van de Moere)
- Understanding Component Architecture: Refactoring an Angular App (Jurgen Van de Moere)
Components
- Element Angular Angular UI library
- Awsome Angular Components
- Axponents: of Accessible Web Components (Dylan Barrell)
- Simple Example Components: TreeView, Grid, Input Values and Bindings, Core Directives, How to ignore view bindings (Torgeir Helgevold)
- ng-bootstrap Angular 2 powered Bootstrap by the angular-ui/bootstrap team
- 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-table Simple table extension with sorting, filtering, paging... for Angular2 apps
- angular2-data-table Yet table extension with sorting, filtering, paging...
- [file-droppa] (https://github.com/ptkach/fileDroppa) Angular2 file upload and file list directives
- angular2-google-maps Angular2 directives for Google Maps.
- angular2localization An Angular 2 library to translate messages, dates and numbers.
- primeng collection of rich UI components for Angular2.
- Angular2 Infinite Scroll Directive Infinite Scroll Component
- ng2-bs3-modal Angular2 Bootstrap3 Modal Component
- ng2-swipeable-card Material Design Angular2 Swipeable Card Component
- ngx-pipes Useful pipes for Angular2 and beyond!
- ngx-charts - Declarative Charting Framework for Angular2 and beyond!
- ngx-datatable A feature-rich yet lightweight data-table crafted for Angular2 and beyond!
- ngx-ui - Style and Component Library for Angular2 and beyond!
- ng2-inline-editor An Angular 2 Component to edit inline any text.
- angular2-circle-progress Simple Angular 2 Circle Progress Component
- od-virtualscroll Observable-based virtual scroll implementation in Angular
Boilerplates
- Angular CLI - Official command-line generator for Angular 2 apps
- Github: ng2-play (Pawel Kozlowski)
- Github: ng2-lab (Roland Groza)
- Github: Angular2 Babel App
- Github: Angular2 Sandbox (Gion Kunz)
- Yeoman: generator-modern-web-dev (NG2, TypeScript, ES2015, SASS, ... and completely separate build system) (Sebastien Dubois)
- Yeoman: generator-angular2 (Chris Wheatley)
- Yeoman: generator-mcfly-ng2 (Avi Haiat)
- Slush: slush-angular2 (Ryan Usumi)
- slush-ng2-play Generator of minimum Angular2 with ES6, based on ng2-play from pkozlowski-opensource
- Plunkr: Angular2 + Typescript Template (@radotzki)
- Plunkr: Angular2 + ES6 Template
- Github: Angular2 + Webpack + TypeScript (gdi2290 AngularClass)
- Github: Angular2 + TypeScript in baby steps (Zia Khan)
- Github: Angular2 Seed TypeScript (Minko Gechev)
- Github: Angular2 Minimalist Starter (Roger Padilla)
- Github: Angular2 + TypeScript: Seed Project (@ghpabs) Fully automated development workflow using Gulp.
- Github: Angular2 Starter for TypeScript (Antony Budianto) Complete Gulp Workflow
- Github: Angular2 Starter for Javascript in ES6 Automated Gulp workflow with example CRUD application.
- Github: Angular2 Seed TypeScript (Matthias Schuetz) A complete, yet simple, starter for Angular 2 using TypeScript.
- Github: Angular2 boilerplate on steroids (Pedro Eugenio) This is an Angular 2 fullstack project boilerplate on steroids! Aimed at reaching top notch performance levels.
- Github: Laravel Angular2 Material Boilerplate Laravel and Angular 2 integration.
Example Apps
- Yatrum.com - App for Travellers
- ng2do (David East)
- ng-conf 2015 Demo (Microsoft)
- ng2chat (Rob Wormald)
- angular2-tuber (Alex Hawkins) A YouTube Search Engine built with Angular2
- ng2-random-user (Kent C. Dodds) Simple Random User Card getter using randomuser.me
- hn-ng2 (Harry Wolff) Hacker News implemented with Angular2. Dart version (Andres Araujo)
- NG2 Challenges Challenges to help you learn and understand the evolving Angular2 Framework.
- Angular 2 and Express - Heroku ready (Vlado Tešanović)
- cart2 (Ciro Nunes)
- Developing a MEAN app with Angular 2.0 (Arvind Ravulavaru)
- JWT authentication in Angular 2 (mgonto and gdi2290)
- Add authentication to an Angular 2 app
- Angular Reading Position Indicator
- d3 directives from Angular 1 to Angular 2 (gdi2290)
- Angular 2 Carousel component with Bootstrap
- Angular 2 Bootstrap Style Modal (Shlomi Assaf)
- Chat Application using RxJS (ng-book)
- Todo app with Firebase, OAuth, and Immutable
- Angular 2 Table pagination example + Java Spring Backend
- Dribbble Clone using Angular 2
- Angular2 Leaflet Starter
- Angular2 MapboxGL Starter
- Angular 2 & TypeScript implementation of the Responsive Dashboard (RDash) admin dashboard theme @ziyasal
- Angular 2 Chosen wrapper
- Angular 2 Money, dates and datetimes input handling
- Auth0, Angular 2: The new horizon
- Angular 2 Blog
- Angular 2 Samples(Torgeir Helgevold)
- angular2-demo Minimal Angular2 Demo using TypeScript / Sass / Npm Tasks
- TV Tracker
- Go Game
- Stock Portfolio
- Echoes Player open source app in ng2
- Sequence Alignment Calculator (@radotzki)
- Directive checking if an element is within the browsers visual viewport (@k3nsei)
- Directive checking if clicked inside elementRef or outside (@k3nsei)
- Angular 2 Chess (@shlomiassaf)
- MeetUpEvent (Angular2, Firebase)
- SoundCloud API client with Angular2, NgRx/Store and NgRx/Effects
- Angular 2 AOT (Ahead-of-Time) Compilation with Webpack
- Ng-Chat - Angular 2 Websocket Messenger Application
- Angular Admin Dashboard
- Efficient virtual scrolling demo RxJS / Angular Material / Reactive Forms / SystemJS
Live Code Experiments
- Angular 1 with Angular 2 Dependency Injection (Rob Wormald)
- angular2-playground (Sekib Omazic)
- jsBin ES5 Angular 2 (gdi2290)
Angular Material
Stack Overflow Questions
Classes
- Free Udemy Course - Angular 2 Fundamentals
- Udemy - The Complete Guide to Angular 2
- Udemy - Angular 2 with TypeScript for Beginners: The Pragmatic Guide
- Udemy - Introduction to Angular 2
- Udemy - Angular 2 - Concepts, Code and Collective Wisdom
- Egghead.io Angular 2
- Angular Boot Camp
- AngularClass
- Web Age Solutions - Angular 2 Programming
- Angular 2 For Beginners With Typescript (inc. Firebase App)
- Angular University - Premium Quality Tutorials on Angular 2 and its Ecosystem
Books
- Rangle.io : Introduction to Angular 2 and ngCourse2
- ng-book 2 (Ari Lerner)
- Become a ninja with Angular
- Angular 2 in action
- Angular 2 - A Practical Introduction to the New Web Development Platform
- Practical Angular 2
- Angular 2 Development with TypeScript
- Switching to Angular 2
- Mastering Angular 2 Components
- Testing Angular 2 Applications
Tools
- Babel plugin for Angular @ annotations
- Angular2 Snippets for Sublime Text
- Angular 2 Style Guide WebStorm Live Templates
- Codelyzer - A set of tslint rules for static code analysis of Angular 2 TypeScript projects.
Opinions
Social Media
- Gitter Channel
- #angular2 on Twitter
- @angularjs on Twitter
- #angularjs at Freenode
- Angular2 Group on Facebook
- Angularjs on Google+
- /r/Angular2 on Reddit
Angular Dart
- Angular2 Dart API cheatsheet
- Angular2 Dart cheatsheet
- Angular2 Dart Gnome Tutorial app
- Angular2 Dart Router demo