ngAir 84 - Creating Angular 2 UI Libraries with Kyle Ledbetter

2016-10-28

Creating Angular 2 UI Libraries ● Intros to everyone and their interest in creating UI Libraries ● CSS and handling styles in UI libraries ● How do you embed css in ui components for distribution? ● How can you distribute sass/less files as well? ● How do you manage parent/children component communication? For example with a tabs component ● What are the important points to check when you want to make your component compatible with AoT?

Creating Angular 2 UI Libraries

● Intros to everyone and their interest in creating UI Libraries

● CSS and handling styles in UI libraries

● How do you embed css in ui components for distribution?

● How can you distribute sass/less files as well?

● How do you manage parent/children component communication? For example with a tabs component

● What are the important points to check when you want to make your component compatible with AoT?

● How do you build the project where you dev the components (use cli, roll your own server/build/etc)?

● How do you make ui components that work on all environments (browser, web workers, electron, server side, nativescript…)

● Managing documentation for how users consume/implement your components

● What is your strategy for testing your components?

● What is on your wish list that would make everyone’s lives easier?

Tips & Picks

● Justin

○ Example of component lib: https://github.com/ocombe/ng2-translate

○ Games!
Civilization 6 https://www.civilization.com/
Red Dead Redemption 2 http://www.rockstargames.com/videos/video/11600
Nintendo Switch https://youtu.be/f5uik5fgIaI

● Jeff

○ Logan https://www.youtube.com/watch?v=Div0iP65aZo

○ Life Lessons Learned on AngularAir https://devchat.tv/adv-in-angular/114-aia-life-lessons-from-angular-air-jeff-whelpley-angular-remote-conf

● Wesley

○ Change detection: http://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html

○ AoT compilation for webpack:

■ https://www.npmjs.com/package/@ngtools/webpack

■ https://github.com/angular/angular-cli/tree/master/tests/e2e/assets/webpack/test-app

● Kyle

○ Getcovalent.com would be my plug

○ Guardians 2! https://www.youtube.com/watch?v=2WhQcK-Zaok

● Dmitriy