Recommended
More Related Content
What's hot
What's hot (15)
Viewers also liked
Viewers also liked (13)
Similar to Organized by Technology Partner Component Oriented Architecture with Angular 2
Similar to Organized by Technology Partner Component Oriented Architecture with Angular 2 (20)
Organized by Technology Partner Component Oriented Architecture with Angular 2
- 1. Organized by Technology Partner
- 2. Component Oriented Architecture with Angular 2 B Y S H I V A N K A D E S I L V A
- 3. AngularJS Meetup 2016 Scope - Component Oriented Architecture - Introduction to Angular 2 components - Interaction of Angular 2 components - Componentization We are not designing pages, we are design systems of components. S T E P H E N H E Y
- 4. AngularJS Meetup 2016 Component Oriented Architecture • Building the application in small reusable software components • Not a new concept • Components are the basic building blocks of Angular 2 app
- 5. AngularJS Meetup 2016 Angular 2 Components • Angular 2 component consists of • HTML • CSS • JavaScript • Two types of components • Presentational/Dumb components • Container/Smart components
- 6. Component Blueprint AngularJS Meetup 2016 Module Template HTML + CSS (view) Component Class JavaScript (Controller/ViewModel) Event Binding ( ) Property Binding [ ] Component Service Classes JavaScript (Model) Zone
- 7. Data Binding AngularJS Meetup 2016 Template <html> <title>HTML</title> <body> This is HTML! </body> </html> <HTML> Component Interpolation {{ }} Property Binding [ ] Event Binding ( ) Two way Binding [( )]
- 8. Component Blueprint AngularJS Meetup 2016 Container Component Container/Component Component Component Container/Component Component Component
- 9. Event Binding AngularJS Meetup 2016 Component Interaction Property Binding RC CC CC CC CC CC CC Module Service
- 10. Componentization AngularJS Meetup 2016 Navbar Product Price Search Search Price Product Title Title Online Auction About Services Contact FooterCopyright © Online Auction 2016 Carousel Product Name 24.99 Lorem Ipsum is simply dummy text of the printing and typesetting industry Product Product Name 24.99 Lorem Ipsum is simply dummy text of the printing and typesetting industry Product
- 11. Thank you