Halifax Angular Meetup - Introduction to Angular

Transcript

1. ANGULAR WORKSHOP 1st Session - NG INIT
2. OUTLINE • What is Angular • Why use Angular • Community • CLI • Typescript • Angular Workspace • Components • Life Cycles • Decorators • Directives • Demo Post Component
3. Install At this point you must have node and NPM installed https://angular.io/guide/quickstart
4. What is Angular? • Angular is a SPA framework for building web apps • It’s written in TypeScript • Developed by google • Open source
5. Why would you learn Angular? Components - make reuse of html and functionality Data Binding - communication between components Modularity and Dependency Injection Good documentation and libraries
6. Differences between Angular and other options
7. Interest over time
8. Community • Angular 160.1k questions • Vue.js 32.4k questions • React.js 131.2k questions EVENTS
9. Overview • Learn the basics of Angular • Code along the first part of a social media app that we will be building throughout this series of workshops http://bit.ly/ng-halifax-repo
10. Component Life Cycle • ngOnChanges - called when an input binding value changes. • ngOnInit - after the first ngOnChanges. • ngOnDestroy - just before the component is destroyed. ngOnChanges ngOnInit ngOnDestroy
11. WORKSHOP
12. Overview • What is Angular • Why use Angular • Community • CLI • Typescript • Angular Workspace • Components • Life Cycles • Decorators • Directives • Demo Post Component
13. You made it!
14. What’s next • Services • Dependency Injection • HTTP Client
15. Resources https://angular.io https://angular.io/resources https://github.com/avatsaev/angu lar-learning-resources https://github.com/halifax-angular -meetup/Yakking/tree/post-feed