Building an Angular component Library

on YouTube ↗29m

" summary

Concrete outcome: a reusable Angular component library implemented as a monorepo with each component as its own project, published as npm packages. Uses ng-packagr to produce Angular Package Format artifacts, a private registry (Verdaccio) to host packages, and per-component semantic versioning so squads can upgrade independently. Includes unit tests, shared linting, a demo app and published demo documentation site; the library is in active use and reduces UI divergence across teams.

AI-written summary · about

" chapters (8)

1. 0:00Intro
2. 1:40Context: KPN Grip
3. 2:43Context: Multiple Teams
4. 4:46Context: Tribe Model Pitfalls
5. 6:37Solution: Component Library
6. 8:44Ingredients
7. 18:07Publishing flow
8. 22:11Lessons Learned: Best Practices

" related talks

• 26mLearnings from building a component libraryThomas Pink, Fabian Friedl · NG-DE Conference 2019
• 24mCase Study: Creating a Component Library in React JSKathryn Grayson Nanz · NationJS Frontrunners React 2019
• 41mManaging a (component) zoo - DIY web component cataloguesSebastian Schürmann · Dutch PHP Conference 2019
• 25mFrom Design Systems to Component LibrariesGagik Arustamyan | ReactConfAM19 · React Conf Armenia 2019
• 20mEngineering Scalable Angular ComponentsAlex Rickabaugh · EnterpriseNG 2021
• 46mBuilding Reusable Components ... That Are Actually ReusableCory House · Connect.Tech 2021
• 44mBest Practices on building a UI component library for your companyDavid Wells · Full Stack Fest 2016
• 01h 12mMake Web Development Fun Again, with Web ComponentsBryan Ollendyke, Michael Potter · DrupalCamp NJ 2019