Upgrade to Pro — share decks privately, control downloads, hide ads and more …

This is Angular

This is Angular

The Angular v12 was just released.

Here I am talking about the modern Angular. The list of things I am covering in this presentation:

Quick introduction to Angular
Angular feature set
Angular tooling
Angular ecosystem
Stability and support
Awesome community

Bf3acef686273e03fa4fdf125fdad3e9?s=128

Aliaksei Kuncevič

May 25, 2021
Tweet

Transcript

  1. kuncevic.dev This is Angular by ALIAKSEI KUNCEVIČ talk #40 v

    2.2 (24/05/2021)
  2. kuncevic.dev TOC ✅ Angular introduction ✅ Angular Ecosystem ✅ New

    Features
  3. kuncevic.dev ALIAKSEI KUNCEVIČ GDE | Mentor | Consultant https://twitter.com/kuncevic https://github.com/kuncevic

    https://linkedin.com/in/kuncevic
  4. kuncevic.dev @kuncevic COMMUNITY 📢 TEACHING 󰞹 🚀 PODCAST 🎙 OSS

    🤓 󰞵
  5. kuncevic.dev @kuncevic CREATOR 💡 Aurelia vs React vs Vue vs

    Svelte vs Ember vs Elm vs Angular frontendwatch.com
  6. kuncevic.dev Angular vs AngularJS v2+ v1.x

  7. kuncevic.dev AngularJS (v1.8) LTS ✅ January 1 — June 30,

    2018 AngularJS v1.x Active Development ✅ July 1, 2018 — Dec 31, 2021 AngularJS v1.8 LTS Period
  8. kuncevic.dev What Angular is well known for?

  9. kuncevic.dev Angular is well known for 👍 Comprehensive feature set

    👍 Excellent tooling 👍 Mature ecosystem 👍 Stability and support 👍 Awesome community
  10. kuncevic.dev What Angular offers? ✅ Component-based architecture ✅ Dependency injection

    ✅ Powerful rendering engine ✅ Reactivity powered by RxJS ✅ TypeScript is a first class citizen ✅ Predictable release cycles ✅ Developer productivity (CLI, Language Service, DevTools) ✅ Best practices and recipes
  11. kuncevic.dev Facts 💯 ✅ 1.8M+ angular.io hits p/m ✅ 11M+

    NPM downloads p/m ✅ 200K+ answers on StackOverflow ✅ 661 meetup groups in 335 cities in 63 countries
  12. kuncevic.dev Components Component-based Architecture

  13. kuncevic.dev Angular Component A B

  14. kuncevic.dev How Angular works? 🤖

  15. kuncevic.dev A C B

  16. kuncevic.dev Complexity 🤖

  17. kuncevic.dev Angular 12 is here!

  18. kuncevic.dev What is v12? ✅ SASS support in Single File

    Components (SFC) ✅ Critical CSS and fonts inlining ✅ TypeScript strict mode by default ✅ Tailwind native Support ✅ Webpack 5 production support ✅ IE 11 depreciation ✅ Standardized errors ✅ Angular DevTools ✅ Feature requests process
  19. kuncevic.dev angular.io/guide/roadmap

  20. kuncevic.dev Angular Ecosystem 😎

  21. kuncevic.dev Angular Ecosystem 😎 Platform (@angular/*) Community (OSS) +

  22. kuncevic.dev Angular Platform 🚀 Labs Protractor Forms PWA Language Services

    Router Elements CDK Universal Karma Compiler i18n Http Material Animations CLI
  23. kuncevic.dev Community 💡 Patterns Libraries Tools Style Guide

  24. kuncevic.dev 20+ UI component libraries CDK Material Bootstrap Prime NG

    Clarity Kendo UI Ignite UI NG Lightning Wijmo Materialize Onsen UI
  25. kuncevic.dev State Management NGXS NGRX Akita MobX Angular Redux Redux

    Observable
  26. kuncevic.dev RxJS

  27. kuncevic.dev Angular Release Cycles 🌀

  28. kuncevic.dev Predictable, transparent & incremental evolution Version 2 September 2016

    Version 4 March 2017 Version 5 November 2017 Version 6 May 2018 Version 7 October 2018 Version 8 May 2019 Version 9 Feb 2020 ... Version 12 May 2021
  29. kuncevic.dev Support policy and schedule ✅ All of major releases

    are supported for 18 months ✅ 6 months of active support, during which regularly-scheduled updates and patches are released ✅ 12 months of long-term support (LTS), during which only critical fixes and security patches are released.
  30. kuncevic.dev Support policy and schedule

  31. kuncevic.dev How to keep up with updates? 🤔

  32. kuncevic.dev ng update ng update @angular/cli @angular/core

  33. kuncevic.dev ng update @angular/cli @angular/core

  34. kuncevic.dev Update guide

  35. kuncevic.dev update.angular.io

  36. kuncevic.dev Tooling 🏗

  37. kuncevic.dev

  38. kuncevic.dev

  39. kuncevic.dev Angular CLI 🚀

  40. kuncevic.dev Angular CLI 🚀 ✅ Scaffolding commands ✅ ng add

    (setup npm package) ✅ Run unit and e2e tests ✅ Linting (eslint, codelyzer) ✅ Transpiling TypeScript ✅ Compiling LESS/SASS ✅ Dev/prod builds, code split (webpack) ✅ Tree-shaking/Minification ✅ *Monorepo support (libs, apps)
  41. kuncevic.dev Multiple projects? Multiple teams?

  42. kuncevic.dev Scale 🚀 2 1 3

  43. kuncevic.dev Enterprise Solution 💡

  44. kuncevic.dev 👀 frontendwatch.com 🎙 angularrocks.com 📧 kuncevic.dev

  45. kuncevic.dev Th nk you! @kuncevic

  46. kuncevic.dev NY QUESTIONS? @kuncevic