Serverless: a backend thing that gives superpowers to frontend developers - FrontCon 2019, Riga

Transcript

5. @slobodan_
6. @slobodan_
7. @slobodan_
8. @slobodan_
9. @slobodan_
10. @slobodan_
11. @slobodan_
12. @slobodan_
13. @slobodan_
14. @slobodan_
15. @slobodan_ How simple static website hosting should work?
16. @slobodan_ You should focus on your app only! And deployment should be simple.
17. @slobodan_ • Fast one command deployment • Cheap • Free if (almost) no one is using it • Caching + Auto-scaling
18. @slobodan_ That feature list sounds familiar!
19. @slobodan_
20. @slobodan_ But it also sounds like a feature list of…
21. @slobodan_ Serverless a backend thing that gives superpowers to frontend developers
22. @slobodan_ Before we continue…
23. @slobodan_ Slobodan Stojanovic CTO @ Cloud Horizon & Vacation Tracker co-author of Serverless Applications with Node.js book AWS Serverless Hero @slobodan_ serverless.pub
24. @slobodan_ So, serverless…
25. @slobodan_ So, serverless… Less servers? No servers? Or even more servers?
26. @slobodan_ So, serverless… No one cares about servers anymore!
27. @slobodan_ So, serverless… No one cares about servers anymore! (except service providers, hopefully)
28. @slobodan_ To, understand serverless, let's go a step back… What do you need to do to make your app function properly?
29. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Make your app available (deploy it) • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features)
30. @slobodan_ What's important for your users/customers? Or what's important to you, if you are building your app for yourself or for fun?
31. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features)
32. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features) ✔ ✔ Isn't cloud helping? Yes, with some things…
33. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features)
34. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features) Serverless is simply the next step! ✔ ✔
35. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features) Serverless is simply the next step! ✔ ✔ ✔ ✔
36. @slobodan_ Again, what's important for your business?
37. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features)
38. @slobodan_ And, what do you need to take care about with serverless?
39. @slobodan_ • Buy or rent a server • Install Operating System • Setup the server (libs, framework, etc.) • Write your code (business logic, etc.) • Deploy your code to the server • Make sure your app works (monitoring) • Manage server and software updates • Manage your app code (fixes + features)
40. @slobodan_
41. @slobodan_ But, you need servers to serve the app!
42. @slobodan_ "It is serverless the same way WIFI is wireless" Gojko Adzic (@gojkoadzic)
43. @slobodan_ What are the benefits of serverless?
44. @slobodan_ • Managed infrastructure, so you can focus on the business logic • Cheap • Auto-scaling and auto-failover • Per function isolation • Easy to start with (beginner friendly)
45. @slobodan_ But the most important one is…
46. @slobodan_ Pricing model of serverless
47. @slobodan_ • You are paying for used, not reserved capacity • Pay-per-execution model • If no one is using your app, it costs you $0 + there are generous free tiers
48. @slobodan_
49. @slobodan_ But pricing model doesn't give superpowers at least not to frontend developers
50. @slobodan_ But pricing model doesn't give superpowers at least not to frontend developers
51. @slobodan_ What is the frontend developer kryptonite? The Myth of the Fullstack Developer?
52. @slobodan_ What are some frontend developers with superpowers? Is anyone using serverless at all?
53. @slobodan_ Story time!
54. @slobodan_
55. @slobodan_
56. @slobodan_ How many DevOps team members you need to be able to handle 250 million preprocessor API requests per month? in your team (or to pay directly)
57. @slobodan_ 0 Yes, zero/null/nulla/nula…
58. @slobodan_ • Team of mostly frontend devs + one DevOps • Ruby on Rails backend • Many preprocessors that needs full isolation • > 200k requests/hour in peak • Unexpected peaks (you never know when some pen will become popular)
59. @slobodan_
60. @slobodan_
61. @slobodan_
62. @slobodan_
63. @slobodan_
64. @slobodan_ • Lack of resources • DevOps engineer recommended serverless • Frontend dev wrote a SASS converter • Everything worked, so frontend team migrates other preprocessors
66. @slobodan_ Results?
67. @slobodan_ • Full isolation between services • Auto-scaling (up to 5000 parallel requests) • Decreased infrastructure cost (250 million requests costs $1180/month) • More DevOps time for RoR part of the app • Frontend developers with superpowers
68. @slobodan_
69. @slobodan_ Vacation Tracker vacationtracker.io
70. @slobodan_ • In-company hackathon idea • Small startup with one full time developer (+ small help) • One mostly frontend developer • Slack chatbot + API + SPA dashboard
71. @slobodan_ To minimize initial cost and to speed up development, we used serverless from the beginning
72. @slobodan_ Current state of the system
74. @slobodan_ Ok, that's not true, it's more like this:
75. @slobodan_
76. @slobodan_ Results?
77. @slobodan_ • Almost 200 teams using the product • Current infrastructure cost is $0 • Fast development cycles • Easy refactoring, because of micro services • Reusable parts for our next products
78. @slobodan_ vacationtracker.io
79. @slobodan_ Btw, do you know the cost of your latest bug?
80. @slobodan_ We know the exact cost of our!
81. @slobodan_ $2.37 per week
82. @slobodan_ $2.37 Free tier got us covered :) per week
83. @slobodan_ Should you even fix a bug that costs you less than $20/month?
84. @slobodan_ No* * unless it affects user experience or it creates a larger damage
85. @slobodan_
86. @slobodan_ Nice, people are using serverless. But, where do I start?
87. @slobodan_
88. @slobodan_ A Single Page App or a static website
89. @slobodan_ npm install scottyjs -g
90. @slobodan_ An Express.js application or API
91. @slobodan_ What's the benefit? Beside being easy to deploy it
92. @slobodan_
93. @slobodan_ bit.ly/serverless-expressjs
94. @slobodan_ Not the best solution, because…
95. @slobodan_ A better API
96. @slobodan_ Claudia.js + Claudia API Builder claudiajs.com
97. @slobodan_ Looks the same, but it's not!
98. @slobodan_ Faster means cheaper! You pay per execution time, milliseconds matter
99. @slobodan_ P.S. You can do server-side rendering using similar approach! There are also Lambda@Edge and Cloudflare workers
100. @slobodan_ APIs are boring, GraphQL FTW! That's easy too!
101. @slobodan_ AWS AppSync aws.amazon.com/appsync
102. @slobodan_ • Serverless GraphQL • Preconfigured access to AWS data sources
 (DynamoDB, Lambda or Elastic Search) • Real-time data access and updates • Offline data synchronization • Authorizers • Minimize backend development
103. @slobodan_ "Oh, and I only hire front-end developers at this point. I have been the sole DevOps/backend/ middle-tier developer in the last two companies I started, and it’s been fine." Joe Emison (@JoeEmison)
104. @slobodan_ "With AppSync I could continue to be the CTO, do all the backend and middle-tier code, and support up to probably about a hundred front-end developers before I would need a dedicated backend developer." Joe Emison (@JoeEmison)
105. @slobodan_ A file converter
106. @slobodan_ Claudia.js or AWS Serverless Application Repository serverlessrepo.aws.amazon.com/applications
107. @slobodan_
108. @slobodan_ Want if you want just one tool with all these nice things
109. @slobodan_ AWS Amplify aws-amplify.github.io
110. @slobodan_ • Deployment (with and without CDN and HTTPS) • Auth using Amazon Cognito (+ social signins) • GraphQL backend using AppSync + real-time • Media storage using S3 • Nice client-side libraries for React and others • And much more…
111. @slobodan_
112. @slobodan_ Do we have time (and internet) for a short live demo?
113. @slobodan_
114. @slobodan_ Links to mentioned things
115. @slobodan_ • AWS Amplify - https://aws-amplify.github.io • Claudia.js - https://claudiajs.com • Scotty.js - https://github.com/stojanovic/scottyjs • Vacation Tracker - https://vacationtracker.io
116. @slobodan_ Summary
117. @slobodan_ • Serverless is easy to start with (beginner friendly) • No server maintenance and other boring things • Pay-per-usage model + it's cheap • You can deploy SPAs, APIs or GraphQL in minutes • It gives you superpowers!
118. @slobodan_ One more thing!
119. @slobodan_
120. @slobodan_ Serverless Applications with Node.js Use claudia40 promo code for 40% off serverless.pub/book @slobodan_