React tools
for better
Angular apps Martin Hochel
@martin_hotell
Slide 2
Slide 2 text
Hello Vikings !
▪ @ngPartyCz meetup founder
▪ Author of ngMetadata
▪ Member of @skate_js, @ngParty
▪
▪
Martin Hochel
Principal SE, GDE
Prague / Czech Republic
@martin_hotell
github.com/Hotell
Slide 3
Slide 3 text
Fight !
Slide 4
Slide 4 text
Fight
leads
to the dark side
Twi r ne m a s
Slide 5
Slide 5 text
We can be all friends !
Slide 6
Slide 6 text
How ?
Slide 7
Slide 7 text
Tools Architecture
Libraries
Slide 8
Slide 8 text
Baseline
Slide 9
Slide 9 text
CLI Tools
Libraries
Architecture
Slide 10
Slide 10 text
Disclaimer: Tombstones ahead
sorry about that
Slide 11
Slide 11 text
Tools
Slide 12
Slide 12 text
Task runner/package manager
Slide 13
Slide 13 text
Tools: task runner
Slide 14
Slide 14 text
Tools: task runner
Slide 15
Slide 15 text
Tools: package manager
Slide 16
Slide 16 text
Formatting
Slide 17
Slide 17 text
Tools: Formatting
T li
Slide 18
Slide 18 text
Tools: Formatting
Slide 19
Slide 19 text
Tools: Formatting conflicts with linter
Slide 20
Slide 20 text
Tools: Formatting - let robots do the work
Slide 21
Slide 21 text
Unit Testing
Slide 22
Slide 22 text
Unit Testing
Kar
Jas
Slide 23
Slide 23 text
Unit testing
Slide 24
Slide 24 text
Unit testing: add Jest to @angular/cli
Slide 25
Slide 25 text
Unit testing: speed
karma-chrome:
14.911s
karma-phantomjs:
13.119s
jest:
4.970s
Slide 26
Slide 26 text
Unit testing: Jest - Snapshots
Slide 27
Slide 27 text
Unit testing: Jest - Interactive watch mode
Slide 28
Slide 28 text
Unit testing: Jest - much more awesomeness
- Powerful mocking features ( ES2015 mo s, as s )
- Code coverage - 0CJS `jest --coverage`
- Pluggable ( run Puppeteer with Jest )
- Huge ecosystem
- jest-axe ( a11y )
- jest-images-snapshots
Slide 29
Slide 29 text
E2E Testing
Slide 30
Slide 30 text
E2E Testing
Pro c
Sel u
Slide 31
Slide 31 text
E2E Testing
A node.js tool to automate
end-to-end web testing
Slide 32
Slide 32 text
E2E Testing: add TestCafe to @angular/cli
Slide 33
Slide 33 text
E2E
demo
Slide 34
Slide 34 text
E2E Testing: summary
- TestCafe ( Fast, 100% reliable, just NodeJS ! )
- Windows, MacOS, Linux
- Chrome, Firefox, Safari, Opera, Edge, IE, Custom
- CI integration
- TypeScript