Angular Hackday Melbourne 2019 - Introduction to Angular

Transcript

1. Angular Hack Day Melbourne June 2019 Introduction to Angular Join the Conversation #AngularHackDayMelbourne @geo_ge
2. Senior Software Architect at SSW Gabriel George @geo_ge devzilla.io ▪ Love coffee! Learnt to drink black recently ▪ Love to play PC, PS4, and Nintendo Switch ▪ Used to want to be a doctor ▪ Just got married! Join the Conversation #AngularHackDayMelbourne @geo_ge
3. Get to know Angular Data and event bindings Starting your new Hello World app Parent and child component What do you need? Agenda
4. What is Angular? “A TypeScript-based open-source front-end web application platform led by the Angular Team at Google and by a community of individuals and corporations” - Wikipedia Join the Conversation #AngularHackDayMelbourne @geo_ge
5. Get to know Angular Data and event bindings Starting your new Hello World app Parent and child component What do you need? Agenda
6. Pre-requisites • NodeJs 8+ ➔ https://nodejs.org/ • Angular CLI ➔ https://cli.angular.io/ • Your preferred text editor / IDE • My recommendation: VSCode ➔ https://code.visualstudio.com/ Join the Conversation #AngularHackDayMelbourne @geo_ge
7. Get to know Angular Data and event bindings Starting your new Hello World app Parent and child component What do you need? Agenda
8. Demo time!
9. What we’ve learnt • ng commands • Angular app structure • Component • Module Join the Conversation #AngularHackDayMelbourne @geo_ge
10. Get to know Angular Data and event bindings Starting your new Hello World app Parent and child component What do you need? Agenda
11. Demo time!
12. What we’ve learnt • Interpolation {{}} • One-way data [] and event () binding • Two-way binding [()] Join the Conversation #AngularHackDayMelbourne @geo_ge
13. Get to know Angular Data and event bindings Starting your new Hello World app Parent and child component What do you need? Agenda
14. Demo time!
15. What we’ve learnt • Angular decorator @ • @Input • @Output • Event emitter Join the Conversation #AngularHackDayMelbourne @geo_ge
16. Thank you! @geo_ge devzilla.io info@ssw.com.au www.ssw.com.au Sydney | Melbourne | Brisbane
17. Resources • https://angular.io • https://bit.ly/ng-in-5min • https://rules.ssw.com.au/rules-to-better-angular Join the Conversation #AngularHackDayMelbourne @geo_ge