Slide 1

Slide 1 text

BUILDING
 BLOCKS
 FOR
 PRODUCT DEVELOPMENT @VilleImmonen
 Co-founder, Reindex

Slide 2

Slide 2 text

Idea

Slide 3

Slide 3 text

Build

Slide 4

Slide 4 text

JavaScript Fatigue JavaScript Fatigue

Slide 5

Slide 5 text

We live in the future

Slide 6

Slide 6 text

2016 2015 2014 2013 (Native) (2.0)

Slide 7

Slide 7 text

isomorphic universal
 cross-platform
 hot-reloadable
 functional reactive predictable
 JavaScript

Slide 8

Slide 8 text

isomorphic universal
 cross-platform
 hot-reloadable
 functional reactive predictable
 JavaScript Frontend Backend RESTful, Nginx, Node.js, Ruby, Python, Java, Scala, Clojure, Go, PostgresSQL, MySQL, MongoDB, Cassandra, Redis, RabbitMQ, CoreOS, Ansible, Docker
 microservices Here be dragons

Slide 9

Slide 9 text

Because we can’t.
 Because we have better things to do.

Slide 10

Slide 10 text

LOGIN FILE
 UPLOAD DATA
 STORAGE SEARCH API WEB SERVER

Slide 11

Slide 11 text

WEB SERVER

Slide 12

Slide 12 text

2011 2016 Spin up a server
 Install Linux Install NGINX
 Configure NGINX
 Deploy code/assets
 Maintain, monitor Surge

Slide 13

Slide 13 text

> surge Surge - surge.sh email: [email protected] token: ***************** project path: /Users/ville/Projects/reindex- starter-kit/public size: 3 files, 4.3 MB domain: squealing-land.surge.sh upload: [====================] 100% propagate on CDN: [====================] 100% plan: Free users: [email protected] IP address: 192.241.214.148 Success! Project is published and running at squealing-land.surge.sh > npm install -g surge

Slide 14

Slide 14 text

LOGIN

Slide 15

Slide 15 text

2011 2016 Code signup, login &
 reset password pages
 
 Code password storage (secure!),
 email sending, API…
 
 Deploy, maintain, monitor

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

DATA
 STORAGE

Slide 18

Slide 18 text

2011 2016 Code a backend with Rails/Node.js/Clojure/ Java… Deploy the backend
 
 Deploy a database
 
 Maintain, monitor, administer

Slide 19

Slide 19 text

2011 2016 Code a backend with Rails/Node.js/Clojure/ Java… Deploy the backend
 
 Deploy a database
 
 Maintain, monitor, administer

Slide 20

Slide 20 text

API

Slide 21

Slide 21 text

2011 2016 Design a RESTful API Build the endpoints using a web framework
 
 Write a client library, client-side cache and plumbing GraphQL

Slide 22

Slide 22 text

JSON { “speaker”: { “id”: 3, “name”: “Ville” “handle”: “@VilleImmonen”, “talks”: [{ “title”: “Building Blocks”, “event”: { “date”: “2016-02-15” } }] } }

Slide 23

Slide 23 text

JSON { “speaker”: { “id”: 3, “name”: “Ville” “handle”: “@VilleImmonen”, “talks”: [{ “title”: “Building Blocks”, “event”: { “date”: “2016-02-15” } }] } }

Slide 24

Slide 24 text

GraphQL { speaker { id name handle
 talks { title event date } } } }

Slide 25

Slide 25 text

GraphQL { speaker(id: 3) { id name handle
 talks { title event date } } } }

Slide 26

Slide 26 text

JSON { “speaker”: { “id”: 3, “name”: “Ville” “handle”: “@VilleImmonen”, “talks”: [{ “title”: “Building Blocks”, “event”: { “date”: “2016-02-15” } }] } }

Slide 27

Slide 27 text

Data requirements
 specified on the client

Slide 28

Slide 28 text

Type system

Slide 29

Slide 29 text

FILE
 UPLOAD

Slide 30

Slide 30 text

2011 2016 Client-side: preview, cropping, iframes/Flash for cross-domain… Server-side: queue/handle uploads,
 process with ImageMagick,
 store to S3 CDN for efficient delivery

Slide 31

Slide 31 text

SEARCH

Slide 32

Slide 32 text

2011 2016 Install Elasticsearch Implement indexing, client-facing API,
 API client and client-side cache Try to make it fast Deploy, maintain and monitor

Slide 33

Slide 33 text

LOGIN FILE
 UPLOAD DATA
 STORAGE SEARCH API WEB SERVER

Slide 34

Slide 34 text

No content

Slide 35

Slide 35 text

Build awesome things

Slide 36

Slide 36 text

Don’t spend your time doing
 what’s already been done

Slide 37

Slide 37 text

Thanks! @VilleImmonen
 www.reindex.io