Angular
in 2018 Summer
![](https://s3.amazonaws.com/media-p.slid.es/uploads/345677/images/2756726/angular_high.png)
Laco
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/3888213/2.png)
2018-09-01
DevFest Tokyo 2018
About Me
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/3888213/2.png)
- laco / Suguru Inatomi
- Work@Kaizen Platform
- Organizer of
Angular Japan User Group - Angular Contributor
Angular Introduction
Are you doing
Frontend Development?
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5201772/pasted-from-clipboard.png)
-
Languages
-
Styling
-
Frameworks
-
Tooling
-
Performance
-
etc...
Many Decisions
Let's try Angular!
DEMO TIME!
-
Component-Orient
-
HTML Template + Data Binding
-
CSS Scoping
-
Dependency Injection
-
Official Packages
-
Testing helper
-
etc...
Angular as a framework
-
Easy to start
-
Less time to look for awesome libraries
-
-
Easy to learn
-
Documentations
-
Sharable knowledges
-
-
High Quality
-
Well-maintained always
-
Verified by Google
-
Advantage
-
Developer Tools
-
Cross platform integration
-
Mobile Web
-
Mobile Native
-
Service Side
-
Angular as a platform
Stackblitz
![](https://c.staticblitz.com/assets/packs/blitz_logo-11cebad97cad4b50bc955cf72f532d1b.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4642611/stackblitz.com_.png)
Angular PWA
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5012185/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5012194/pasted-from-clipboard.png)
Ionic
Native app w/ Angular + WebView
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4642824/carbon__2_.png)
NativeScript
Native UI from Angular Component
![](https://developer.telerik.com/wp-content/plugins/lazy-invitation/images/ns-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4642825/carbon__3_.png)
Angular Universal
Server-Side Angular
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5012195/pasted-from-clipboard.png)
-
Angular on Node.js
-
Official Support
-
@angular/platform-server
-
- Versioning / Release Schedule
- Component Libraries
- Interop with Web
- Communities
Angular as an ecosystem
-
Semantic Versioning
-
Major.Minor.Patch
-
-
Release Schedule
-
Patch / Week
-
Minor / Month
-
Major / 6 Months
-
Versioning / Releasing
Long Term Support
For Each Major Version
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5201848/Angular_LTS.png)
Component Libraries
Angular Material
Official Material Design Components
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4642873/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054556/pasted-from-clipboard.png)
Clarity
Made by VMware
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054562/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054563/pasted-from-clipboard.png)
Ignite-UI
Made by Infragistics
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054565/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054566/pasted-from-clipboard.png)
Component Dev Kit
Component Library Helper
The Angular CDK gives developers solid, well-tested tools
to add common interaction patterns with minimal effort.
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4644184/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054595/pasted-from-clipboard.png)
Web Ecosystem
Angular Elements
Create Web Components
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054596/pasted-from-clipboard.png)
Communities
1.4M Angular Developers
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054607/pasted-from-clipboard.png)
790+ local meetups
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5054608/pasted-from-clipboard.png)
ng-japan: 300+ attendees
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4735774/pasted-from-clipboard.png)
Angular in Japan
- ng-japan/who-use-angular-in-japan
-
30 companies registered.
- Let's add your company!
Future of Angular
-
Angular Ivy
-
Angular Console
-
Angular for Designers
Initiatives
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5020118/pasted-from-clipboard.png)
-
New View Engine
-
For App Users
-
Small bundle
-
-
For Developers
- Faster build
-
Simple API
-
(expert) Meta programming?
Angular Ivy
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5202029/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5202072/pasted-from-clipboard.png)
- Angular for Great DX
- Framework + Platform + Ecosystem
- New 3 Initiatives
- Ivy: Framework improvement
- Angular Console: DX improvement
- Angular For Designers: Visual Programming
Conclusion
Let's Join us!
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4371446/pasted-from-clipboard.png)
angular.jp
Online Documentation
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/4371568/pasted-from-clipboard.png)
Slack / Spectrum
Chat / Thread
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5203543/spectrum_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/5203547/Slack_App_Icon.png)
Thanks!
![](https://s3.amazonaws.com/media-p.slid.es/uploads/550205/images/3888213/2.png)
Laco
Angular in 2018 Summer
By Suguru Inatomi
Angular in 2018 Summer
DevFest Tokyo 2018
- 5,580