Paul van Dam, Coolblue, Rotterdam — Introducing and Implementing React at Coolblue

Slide 1

Slide 1 text

Introducing and implementing React. React Amsterdam 2016, by Paul van Dam 1

Slide 2

Slide 2 text

• Why React? • JavaScript fatigue • Integration 2

Slide 3

Slide 3 text

Paul van Dam  3

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Faceted Navigation.  5

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Framework vs UI library.  7

Slide 8

Slide 8 text

Leland Richardson - Engineer at AirBnB.  "Reusability/portability: React components are extremely reusable Refactorability: React tends to make your code very easy to refactor and iterate on.” In your opinion, what are the biggest advantages of using React? 8

Slide 9

Slide 9 text

9 Agile ❤ React

Slide 10

Slide 10 text

Brands using React.  10

Slide 11

Slide 11 text

The simplest code is the code that you don’t need to write at all. 11

Slide 12

Slide 12 text

JavaScript fatigue.  Saul: “How’s it going?” Me: “Fatigued.” Saul: “Family?” Me: “No, Javascript.” Eric Clemmons 12

Slide 13

Slide 13 text

Focus.  13

Slide 14

Slide 14 text

Fail often.  14

Slide 15

Slide 15 text

Learning curve.  15

Slide 16

Slide 16 text

Expand.  16

Slide 17

Slide 17 text

FRAMEWORK MODULE MODULE MODULE MODULE 17

Slide 18

Slide 18 text

Integration.  18

Slide 19

Slide 19 text

Integration.  ESLINT UNIT TEST PULL REQUEST BUILD / DEPLOY STUFF 19

Slide 20

Slide 20 text

Semantic Versioning.  ^3.0.2 3.19.34 ^0.14.2 0.14.9 20

Slide 21

Slide 21 text

• It assumes developers follow the rules of versioning • It assumes releases are perfect 21

Slide 22

Slide 22 text

• Fixed versions in package.json • Check in /node_modules/ • npm shrinkwrap 22

Slide 23

Slide 23 text

• HMR • React 15 / Webpack 2 • Dropping karma/phantomjs in favour of Ava/Enzyme 23

Slide 24

Slide 24 text

THANK YOU. Paul van Dam  @paulvdam #reactamsterdam 24