Slide 1

Slide 1 text

TWO YEARS OF REACT NATIVE IOSOHO - 12 03 18

Slide 2

Slide 2 text

TWO YEARS OF REACT NATIVE ORTA THEROX @ORTA 1. WHY ARTSY MOVED 2. DOWNSIDES 3. OMAKASE 4. UPSIDES 5. BROWNFIELD 6. DEPLOYMENT

Slide 3

Slide 3 text

ORTA THEROX @ORTA

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

TWO YEARS OF REACT NATIVE The start-up Art.sy aims to do for visual art what Pandora did for music: become a source of discovery, pleasure and education.” “

Slide 7

Slide 7 text

Make art as popular as music Richard Serra -Betwixt the Torus and the Sphere https://artsy.net/artwork/richard-serra-betwixt-the-torus-and-the-sphere

Slide 8

Slide 8 text

The World’s Largest Database of Contemporary Art 2,000+ GALLERIES ~1,000,000 ARTWORKS 25+ AUCTION HOUSES 80,000 ARTISTS 700 MUSEUMS 60+ ART FAIRS —

Slide 9

Slide 9 text

— On the Internet

Slide 10

Slide 10 text

TWO YEARS OF REACT NATIVE Open Source by Default github.com/artsy

Slide 11

Slide 11 text

TWO YEARS OF REACT NATIVE Artsy Blog - React Native at Artsy - Intro to React Native for an iOS Developer - Workshop: React Native - Retrospective: Swift at Artsy - Exploration: Front-end JavaScript at Artsy in 2017 - On our implementation of React Native - Open Expectations Talks - try! Swift - Building Your Own Tools - this one!

Slide 12

Slide 12 text

2015: WHY MOVE? MOBILE TEAM SLOW NATIVE TOOLING QUALITY SEPERATION OF CONCERNS ARTSY.GITHUB.IO/BLOG/2016/08/15/REACT-NATIVE-AT-ARTSY/

Slide 13

Slide 13 text

ARTSY.GITHUB.IO/BLOG/2017/02/05/RETROSPECTIVE-SWIFT-AT-ARTSY/

Slide 14

Slide 14 text

?

Slide 15

Slide 15 text

GITHUB.COM/ARTSY/MOBILE/ISSUES/22

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

ANDROID DIFFERENT CODE FOR APP SCREEN VS HOST DEV TOOLS IMPROVEMENTS GITHUB.COM/ARTSY/MOBILE/ISSUES/22

Slide 18

Slide 18 text

COMPLEXITY

Slide 19

Slide 19 text

STATE CHANGES API INTERACTIONS STYLE USER INTERACTIONS HIERARCHY (V/VC) ROUTING

Slide 20

Slide 20 text

STATE CHANGES API INTERACTIONS STYLE USER INTERACTIONS HIERARCHY (V/VC) ROUTING

Slide 21

Slide 21 text

STATE CHANGES API INTERACTIONS STYLE USER INTERACTIONS HIERARCHY (V/VC) ROUTING

Slide 22

Slide 22 text

STATE CHANGES API INTERACTIONS STYLE USER INTERACTIONS HIERARCHY (V/VC) ROUTING

Slide 23

Slide 23 text

STATE CHANGES API INTERACTIONS STYLE USER INTERACTIONS HIERARCHY (V/VC) ROUTING

Slide 24

Slide 24 text

STATE CHANGES API INTERACTIONS STYLE

Slide 25

Slide 25 text

DOWNSIDES HOLD ON TO YOUR HAT NO, LIKE, SERIOUSLY, WE’RE GONNA TRY COVER A LOT OF THEM

Slide 26

Slide 26 text

517 DEPENDENCIES

Slide 27

Slide 27 text

NO ROADMAP MEH DEBUGGING ERROR REPORTING FOCUS ON WEB DEVELOPERS FEW NUANCED WRITE-UPS NATIVE COMPLEXITY + JS COMPLEXITY NEEDS NATIVE BUY-IN TO WIN JS “STIGMA”

Slide 28

Slide 28 text

LOSSY ABSTRACTIONS TESTING QUESTIONS UN-ANSWERED CHOICE PARALYSIS JS MOVES FAST

Slide 29

Slide 29 text

ARTSY OMAKASE - TYPESCRIPT - GRAPHQL - REACT - JEST - RELAY - STORYBOOKS - STYLED COMPONENTS - VS CODE ARTSY.GITHUB.IO/BLOG/2017/02/05/FRONT-END-JAVASCRIPT-AT-ARTSY-2017/

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

OWNING YOUR DEPENDENCIES

Slide 32

Slide 32 text

RELAY CORE GRAPHQL WORKING GROUP JEST CORE STORYBOOKS ORG CONTRIBUTIONS TO REACT / REACT NATIVE CONTRIBUTIONS TO TYPESCRIPT / DEFINITELY TYPED WRITE VSCODE EXTENSIONS DANGER

Slide 33

Slide 33 text

TRANSITION YOU CAN RELY ON THIS, BECAUSE WE DO

Slide 34

Slide 34 text

UPSIDES

Slide 35

Slide 35 text

- NO MORE MOBILE TEAM - CONSISTENT ABSTRACTIONS WITH WEB - OWN YOUR ENTIRE STACK - JS TOOLING - DEV CLOSER TO THE SPEED OF THOUGHT

Slide 36

Slide 36 text

EMISSION DEMO ADDING EMAIL TO THE PROFILE SCREEN

Slide 37

Slide 37 text

BROWNFIELD artsy/emission artsy/eigen [] emission.js AREmission.h AREmission.m ARSwitchBoardModule.h ARSwitchBoardModule.m ARArtistViewController.h ARArtistViewController.m [email protected] [email protected]

Slide 38

Slide 38 text

RN FOR FULL SCREENS NATIVE FOR: - IMAGE CACHING - NAVIGATION + ROUTING - ANALYTICS PRINCIPALS

Slide 39

Slide 39 text

DEPLOYMENT

Slide 40

Slide 40 text

DEPLOYMENT

Slide 41

Slide 41 text

JUST IN TIME DEPLOYS ONLY FOR ADMINS UPDATES JS TO MASTER LINKED TO A PR

Slide 42

Slide 42 text

SUMMARY 1. WHY ARTSY MOVED 2. DOWNSIDES 3. OMAKASE 4. UPSIDES 5. BROWNFIELD 6. DEPLOYMENT

Slide 43

Slide 43 text

ORTA THEROX @ORTA