Tweet
Tweet

Slide 1

Slide 1 text

I’ve got 99 problems but the server ain’t one @stefanjudis Modern architectures without maintaining servers

Slide 2

Slide 2 text

web

Slide 3

Slide 3 text

Building for the web

Slide 4

Slide 4 text

Frontend Backend Different responsibilities

Slide 5

Slide 5 text

Different responsibilities Frontend Backend Everybody stays on their side!

Slide 6

Slide 6 text

Frontend Backend Different responsibilities

Slide 7

Slide 7 text

Frontend Backend Different responsibilities

Slide 8

Slide 8 text

Frontend Backend Different responsibilities

Slide 9

Slide 9 text

Frontend Backend Different experts

Slide 10

Slide 10 text

Backend Different experts ๏ Servers ๏ Databases ๏ Scalability ๏ Security ๏ ... ... ...

Slide 11

Slide 11 text

Frontend Backend Different experts

Slide 12

Slide 12 text

Frontend Different experts ๏ Browsers ๏ Performance ๏ Responsive Web Design ๏ Progressive Web Apps ๏ ... ... ...

Slide 13

Slide 13 text

Frontend Backend Different experts

Slide 14

Slide 14 text

Frontend Backend Feature development

Slide 15

Slide 15 text

Frontend Backend Feature development Both sides are involved

Slide 16

Slide 16 text

Frontend Backend Feature development It takes time and money

Slide 17

Slide 17 text

Frontend Backend Feature development Will we succeed?

Slide 18

Slide 18 text

Frontend Backend Feature development Does it have to be like that?

Slide 19

Slide 19 text

Frontend world

Slide 20

Slide 20 text

Frontend world But these are just UI widgets!

Slide 21

Slide 21 text

Frontend world But these are just UI widgets! (are they?)

Slide 22

Slide 22 text

APIs Frontend world

Slide 23

Slide 23 text

WOULD YOU BUILD & MAINTAIN YOUR OWN MAPS WIDGET?

Slide 24

Slide 24 text

WOULD YOU BUILD & MAINTAIN YOUR OWN NEWSLETTER SOFTWARE?

Slide 25

Slide 25 text

WOULD YOU BUILD & MAINTAIN YOUR OWN REAL-TIME
 SUPPORT SOFTWARE?

Slide 26

Slide 26 text

WOULD YOU BUILD & MAINTAIN YOUR OWN CMS?

Slide 27

Slide 27 text

Writing good software is hard!

Slide 28

Slide 28 text

The world speaks JSON JSON JSON

Slide 29

Slide 29 text

“ So, isn't Contentful just a JSON API on top of a database?

Slide 30

Slide 30 text

Content Delivery API Content infrastructure Content Delivery API

Slide 31

Slide 31 text

Content infrastructure Content Delivery API {} {} {} {} {} {} {} {} {} {} {} {} {} {} {}

Slide 32

Slide 32 text

Content infrastructure Content Delivery API {} {} {} {} {} {} {} {} {} {} {} {} {} {} {} CONTENT DELIVERED BY FAST CDNs

Slide 33

Slide 33 text

Content Delivery API Content Preview API Content infrastructure Content Preview API

Slide 34

Slide 34 text

Name Image Mumford & Sons Name Image Mumford & Sons & Me JSON ???

Slide 35

Slide 35 text

Name Image Mumford & Sons Name Image Mumford & Sons & Me JSON JSON DELIVERY API PREVIEW API

Slide 36

Slide 36 text

YOUR EDITORS HAVE TO BE HAPPY (AND SAFE)

Slide 37

Slide 37 text

Content Delivery API Content Management API Content Preview API Content infrastructure Content Management API

Slide 38

Slide 38 text

How to evolve content in a JSON API?

Slide 39

Slide 39 text

Content infrastructure Content Management API

Slide 40

Slide 40 text

How do you do this with an API? Content infrastructure Content Management API

Slide 41

Slide 41 text

Migration Scripts Sandbox Environments Content infrastructure Content Management API

Slide 42

Slide 42 text

Content infrastructure Content Management API ctfl.io/content-deployment

Slide 43

Slide 43 text

These requirements are only touching the surface of content at scale

Slide 44

Slide 44 text

It's always more complicated than it looks!

Slide 45

Slide 45 text

It's always more complicated than it looks!

Slide 46

Slide 46 text

I wouldn't reinvent the wheel...

Slide 47

Slide 47 text

I wouldn't reinvent the wheel... ...because I have to maintain and scale that wheel later!

Slide 48

Slide 48 text

Platform as a Service (PaaS) Specialized Services on top of PaaS and IaaS Infrastructure as a Service (IaaS)

Slide 49

Slide 49 text

There is a service for everything!

Slide 50

Slide 50 text

App development today 50% use 2-5 APIs 9% use 25+ APIs Global Development Survey Vol. 1 © 2017 Evans Data

Slide 51

Slide 51 text

No content

Slide 52

Slide 52 text

Chris Coyier – "The All Powerful Front End Developer"

Slide 53

Slide 53 text

Nothing is for free

Slide 54

Slide 54 text

Nothing is for free Evaluate carefully and consider time and effort!

Slide 55

Slide 55 text

But how to connect all the dots? (watch out... buzzword approaching)

Slide 56

Slide 56 text

Serverless computing

Slide 57

Slide 57 text

“ Developers no longer have to think "that much" about Servers. Computing resources get used as services without having to manage around physical capacities or limits. www.quora.com/What-is-Serverless-Computing

Slide 58

Slide 58 text

SERVERLESS COMPUTING Cloud services Function as a service Serverless framework

Slide 59

Slide 59 text

SERVERLESS COMPUTING Cloud services Function as a service Serverless framework ¯\_(ϑ)_/¯

Slide 60

Slide 60 text

thepowerofserverless.info

Slide 61

Slide 61 text

“ You can take your front-end skills and do things that typically only a back-end can do. Chris Coyier

Slide 62

Slide 62 text

“ You can take your front-end skills and do things that typically only a back-end can do. Chris Coyier

Slide 63

Slide 63 text

“ You can take your front-end skills and do things that typically only a back-end can do. Chris Coyier

Slide 64

Slide 64 text

Function as a service aka Cloud Functions

Slide 65

Slide 65 text

Cloud functions No servers to maintain Automatically upscaling No payment for idle time

Slide 66

Slide 66 text

serverlesscalc.com

Slide 67

Slide 67 text

Cloud functions exports.sayHello = async (event) => { return 'Hello from Lambda!'; };

Slide 68

Slide 68 text

Cloud functions exports.sayHello = async (event) => { return 'Hello from Lambda!'; };

Slide 69

Slide 69 text

Cloud functions exports.sayHello = async (event) => { return 'Hello from Lambda!'; };

Slide 70

Slide 70 text

Cloud functions exports.sayHello = async (event) => { return 'Hello from Lambda!'; }; Lambda

Slide 71

Slide 71 text

Cloud functions exports.sayHello = async (event) => { return 'Hello from Lambda!'; }; API Gateway Lambda GET /.../eu-central-1.amazonaws.com/prod/ POST /.../eu-central-1.amazonaws.com/prod/ PUT /.../eu-central-1.amazonaws.com/prod/ ...

Slide 72

Slide 72 text

Cloud functions API Gateway GET /.../eu-central-1.amazonaws.com/prod/ POST /.../eu-central-1.amazonaws.com/prod/ PUT /.../eu-central-1.amazonaws.com/prod/ ... exports.sayHello = async (event) => { return { statusCode: 200, body: JSON.stringify({"msg": "Hello from Lambda!"}) }; }; Lambda

Slide 73

Slide 73 text

Cloud functions API Gateway GET /.../eu-central-1.amazonaws.com/prod/ POST /.../eu-central-1.amazonaws.com/prod/ PUT /.../eu-central-1.amazonaws.com/prod/ ... exports.sayHello = async (event) => { return { statusCode: 200, body: JSON.stringify({"msg": "Hello from Lambda!"}) }; }; Lambda Congratulations! You just created an HTTP endpoint

Slide 74

Slide 74 text

"Serverless weekend" module.exports.redirect = async ({ pathParameters }, context) => { };

Slide 75

Slide 75 text

"Serverless weekend" module.exports.redirect = async ({ pathParameters }, context) => { try { } catch (e) { console.log(e); return { statusCode: 500, body: e.message }; } };

Slide 76

Slide 76 text

"Serverless weekend" module.exports.redirect = async ({ pathParameters }, context) => { try { const { shortUrl } = pathParameters; const queryUrl = `https://cdn.contentful.com/spaces/${ process.env.SPACE_ID }/environments/master/entries?content_type=${ process.env.CONTENT_TYPE }&fields.shortUrl=${shortUrl}&access_token=${process.env.ACCESS_TOKEN}`; } catch (e) { console.log(e); return { statusCode: 500, body: e.message }; } };

Slide 77

Slide 77 text

"Serverless weekend" const got = require('got'); module.exports.redirect = async ({ pathParameters }, context) => { try { const { shortUrl } = pathParameters; const queryUrl = `https://cdn.contentful.com/spaces/${ process.env.SPACE_ID }/environments/master/entries?content_type=${ process.env.CONTENT_TYPE }&fields.shortUrl=${shortUrl}&access_token=${process.env.ACCESS_TOKEN}`; const response = JSON.parse((await got(queryUrl)).body); const redirect = response.items[0]; return { statusCode: 301, headers: { Location: redirect.fields.targetUrl } }; } catch (e) { console.log(e); return { statusCode: 500, body: e.message }; } };

Slide 78

Slide 78 text

"Serverless weekend" const got = require('got'); module.exports.redirect = async ({ pathParameters }, context) => { try { const { shortUrl } = pathParameters; const queryUrl = `https://cdn.contentful.com/spaces/${ process.env.SPACE_ID }/environments/master/entries?content_type=${ process.env.CONTENT_TYPE }&fields.shortUrl=${shortUrl}&access_token=${process.env.ACCESS_TOKEN}`; const response = JSON.parse((await got(queryUrl)).body); const redirect = response.items[0]; return { statusCode: 301, headers: { Location: redirect.fields.targetUrl } }; } catch (e) { console.log(e); return { statusCode: 500, body: e.message }; } }; www.my-links.online/ 99-problems

Slide 79

Slide 79 text

"Serverless weekend" const got = require('got'); module.exports.redirect = async ({ pathParameters }, context) => { try { const { shortUrl } = pathParameters; const queryUrl = `https://cdn.contentful.com/spaces/${ process.env.SPACE_ID }/environments/master/entries?content_type=${ process.env.CONTENT_TYPE }&fields.shortUrl=${shortUrl}&access_token=${process.env.ACCESS_TOKEN}`; const response = JSON.parse((await got(queryUrl)).body); const redirect = response.items[0]; return { statusCode: 301, headers: { Location: redirect.fields.targetUrl } }; } catch (e) { console.log(e); return { statusCode: 500, body: e.message }; } }; www.my-links.online/ 99-problems (yes, I bought this domain)

Slide 80

Slide 80 text

Google AWS Microsoft IBM Fn-as-a-service provider

Slide 81

Slide 81 text

webtask.io

Slide 82

Slide 82 text

webtask.io www.netlify.com/docs/functions/

Slide 83

Slide 83 text

webtask.io www.netlify.com/docs/functions/ Cloud functions will become a requirement to keep complexity low

Slide 84

Slide 84 text

WHEN TO "LAMBDA" low complexity 01 self-contained 02 03 short-lived

Slide 85

Slide 85 text

Perfect to connect services

Slide 86

Slide 86 text

You'll become a conductor

Slide 87

Slide 87 text

You'll become a serverless conductor

Slide 88

Slide 88 text

Serverless orchestration Slack ? ?

Slide 89

Slide 89 text

? ? module.exports.handleDiscourse = (event, context, callback) => { }; Serverless orchestration Slack

Slide 90

Slide 90 text

? ? module.exports.handleDiscourse = (event, context, callback) => { const post = JSON.parse(event.body).post; }; Serverless orchestration Slack

Slide 91

Slide 91 text

? ? module.exports.handleDiscourse = (event, context, callback) => { const post = JSON.parse(event.body).post; if (post && event.headers['X-Discourse-Event'] !== 'post_edited') { const { name, topic_title, topic_slug, topic_id, post_number } = post; } }; Serverless orchestration Slack

Slide 92

Slide 92 text

? ? module.exports.handleDiscourse = (event, context, callback) => { const post = JSON.parse(event.body).post; if (post && event.headers['X-Discourse-Event'] !== 'post_edited') { const { name, topic_title, topic_slug, topic_id, post_number } = post; // send it to Slack // ... // ... } }; Serverless orchestration Slack

Slide 93

Slide 93 text

www.contentful.com/slack/

Slide 94

Slide 94 text

Serverless orchestration Slack

Slide 95

Slide 95 text

Serverless orchestration Asset manipulation C Asset published

Slide 96

Slide 96 text

ctfl.io/image-watermark

Slide 97

Slide 97 text

twitter.com/randomMDN

Slide 98

Slide 98 text

twitter.com/randomMDN You can schedule functions!!!

Slide 99

Slide 99 text

Connecting services has never been easier

Slide 100

Slide 100 text

Spend your time building your business and not reinventing the wheel

Slide 101

Slide 101 text

API-driven architectures

Slide 102

Slide 102 text

APIs FTW!

Slide 103

Slide 103 text

APIs FTW! Use the right tool for the job!

Slide 104

Slide 104 text

Rethink you architecture!

Slide 105

Slide 105 text

No content

Slide 106

Slide 106 text

Every 6 hours CSS & JavaScript

Slide 107

Slide 107 text

Every 6 hours The Node.js process needs more and more memory

Slide 108

Slide 108 text

Every 6 hours Can this server handle high load?

Slide 109

Slide 109 text

I'M PAYING EVERY MONTH TO KEEP THIS RUNNING

Slide 110

Slide 110 text

IS IT TIME FOR THE JAM?

Slide 111

Slide 111 text

Thanks. @stefanjudis Slides