Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
The Future of Rails - Take 2
Search
Ryan Bigg
May 10, 2018
Programming
160
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
The Future of Rails - Take 2
The 2nd version of my talk on the Future of Rails. A more streamlined version.
Ryan Bigg
May 10, 2018
More Decks by Ryan Bigg
See All by Ryan Bigg
Hiring Juniors - RubyConf Indonesia 2019 Closing Keynote
radar
1
470
Web Directions - Code Leaders - Hiring Juniors
radar
0
710
The Future of Rails
radar
1
180
Exploding Rails
radar
9
1.9k
Hiring Juniors
radar
2
490
The Perfect Coding Test
radar
0
160
Your First Developer Job
radar
1
130
Hiring Juniors
radar
2
310
Rails Pacific - Multitenancy with Rails
radar
0
310
Other Decks in Programming
See All in Programming
【DroidKaigi 2026】「アクセシビリティを利用するとき、 アクセシビリティもまたこちらを利用している」 〜マルウェアによる攻撃と防衛について〜
halunoyo
0
330
AI時代に学ぶ 好きなルール 嫌いなルール Linter編
shorty5121
0
810
信頼性の目標を誰も求めてない
shubox
0
480
AIエージェント時代のコードレビューを設計する
nogu66
5
2.5k
DynamoDBの基礎を振り返りながらベクトル検索機能を理解する
musan
3
260
レビュー履歴をAIに食わせて、 Compose移行を加速するs
shihochan
0
260
Go を使い始めて 2 ヶ月の学び / My first two months with Go
contour_gara
0
420
高専キャリア LT 発表内容
crysta1221
6
5.5k
Kiroで創り、AgentCoreで繋ぐ!AWSで実践する「AI-DLC」から「AIエージェント統合」までの最新地図
licux
2
280
ALB ログから Trace を気合で繋げる技術
fohte
7
860
AI駆動開発にグラフDBを重ねてみた
satoshi256kbyte
2
720
業務時間外もAIに働いてもらう話
colorful12
3
9.9k
Featured
See All Featured
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
520
Information Architects: The Missing Link in Design Systems
soysaucechin
1
1.1k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
510
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
290
Paper Plane
katiecoart
PRO
2
53k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
232
55k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.9k
Speed Design
sergeychernyshev
33
2.1k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
230
Thoughts on Productivity
jonyablonski
76
5.4k
Paper Plane (Part 1)
katiecoart
PRO
1
10k
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
450
Transcript
Mentor / Author / Developer
FUTURE PREDICTIONS ARE OFTEN WRONG
ISN’T RAILS THE FUTURE OF RAILS AS YOU KNOW IT
TODAY
TO KNOW THE FUTURE LOOK TO THE PAST
APIs
APPLICATION PROGRAMMING INTERFACE
APIs ARE HOW PROGRAMS TALK TO EACH OTHER
Your App API Third Party App
APIs ARE AN AGREED CONTRACT
Your App Third Party App API “Can you give me
data about employees?”
API “Sure, here’s my data” Third Party App Your App
SOAP
“Please send me all your employee data” In the past…
(1998) SOAP APIs
<?xml version='1.0' encoding='UTF-8'?> <S:Envelope xmlns:S="http:// schemas.xmlsoap.org/soap/ envelope/"> <S:Body> <GetEmployeeData />
</S:Body> </S:Envelope> In the past… (1998) SOAP APIs
--uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd Content-Type: text/xml <?xml version='1.0' encoding='UTF-8'?><S:Envelope xmlns:S="http:// schemas.xmlsoap.org/soap/envelope/"><S:Body /></S:Envelope> --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd
Content-Id:<
[email protected]
> Content-Type: application/octet-stream Content-Transfer-Encoding: binary "User/Employee ID","First Name","Employment Details Hire Date","Username","Division","Company Country","Location","Department","Cost Center","Team","Supervisor","Manager User Sys ID","Contract Type","Gender" --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd-- In the past… (1998) SOAP APIs
--uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd Content-Type: text/xml <?xml version='1.0' encoding='UTF-8'?><S:Envelope xmlns:S="http:// schemas.xmlsoap.org/soap/envelope/"><S:Body /></S:Envelope> --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd
Content-Id:<
[email protected]
> Content-Type: application/octet-stream Content-Transfer-Encoding: binary "User/Employee ID","First Name","Employment Details Hire Date","Username","Division","Company Country","Location","Department","Cost Center","Team","Supervisor","Manager User Sys ID","Contract Type","Gender" --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd-- SOAP APIs In the past… (1998)
SOAP SIMPLE
Retrieved: Tuesday, 8th May, 2018. --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd Content-Type: text/xml <?xml version='1.0'
encoding='UTF-8'?><S:Envelope xmlns:S="http:// schemas.xmlsoap.org/soap/envelope/"><S:Body /></S:Envelope> --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd Content-Id:<
[email protected]
> Content-Type: application/octet-stream Content-Transfer-Encoding: binary "User/Employee ID","First Name","Employment Details Hire Date","Username","Division","Company Country","Location","Department","Cost Center","Team","Supervisor","Manager User Sys ID","Contract Type","Gender" --uuid:1fe211a2-9207-4981-b1ba-95c51dc9dadd--
SOAP IS NOT A GOOD API
Q: “DO YOU KNOW SOAP?” A: NOPE NOPE NOP
None
None
None
None
JSON IS GOOD
[ { "User/Employee ID": "ryan001", "First Name": "Ryan", "Username": "ryanbigg",
. . . } . . . ] And then… (circa 2001)
JSON JAVASCRIPT
JSON Third Party App Your App “Can you give me
data about employees?”
JSON “Sure, here’s my data” Third Party App Your App
[ { "User/Employee ID": "ryan001", "First Name": "Ryan", "Username": "ryanbigg", . . . } . . . ]
HAPPENED THEN RAILS HAPPENED
A browser JavaScript, CSS, Images, and Rails The Monolith And
then and then (circa 2011) Database Makes your app look great Makes your app do stuff
A browser React App Frontend App Backend App Now… (2018)
The Duolith Database Rails App
A browser React App Frontend App Backend App Now… (2018)
Database Rails App Makes your app look great Makes your app do stuff
A browser React App Frontend App Backend App Now… (2018)
Database Rails App SeparaEon of Concerns
Rails Apps In the past
Rails Apps Now
A browser React App Frontend App Backend App The Duolith
Database Rails App Now… (2018)
A browser Frontend App Backend App “Views”, CSS, JS, etc.
Controllers, models, etc. React App Database Rails App Now… (2018)
HOW DO THESE THINGS TALK ? A browser React App
??? Database Rails App
APIs ARE HOW PROGRAMS TALK TO EACH OTHER Slide #7:
A browser React App JSON API Recently… Database Rails App
A browser React App “Show me a post” Recently… Database
Rails App
A browser React App “Okay, here’s the post” Recently… Database
Rails App
JSON APIs POST COMMENT #1 COMMENT #2 GET /api/posts/1 GET
/api/posts/1/comments
GET /api/posts/1 { "id": 1, "title": "Hello World", "body": "This
is my blog's first post." "author": "Ryan Bigg" } JSON APIs
GET /api/posts/1/comments [ { text: "Great first post!", by: "Totally
not Ryan" }, ... ] JSON APIs
A browser React App /api/posts/:id /api/comments … Currently… JSON APIs
Need to build lots of these… Database Rails App /api/posts
EVERYONE DOES THIS
EVEN FACEBOOK
WELL… THEY DID
GET /api/posts/1 { "id": 1, "title": "Hello World", "body": "This
is my blog's first post." "author": "Ryan Bigg" } JSON APIs Problem #1
GET /api/posts/1 { "id": 1, "title": "Hello World", "body": "This
is my blog's first post." "author": "Ryan Bigg”, “comments”: [ { “id”: 1, ... } ] } JSON APIs Problem #2
JSON APIs POST COMMENT #1 COMMENT #2 GET /api/posts/1 GET
/api/posts/1/comments
Facebook iOS App Facebook Servers 1. Get news feed items
2. Here are your items 3. Get comments 4. Here are the comments 5. Fetch user data 6. Here are the users
JSON IS GOOD BUT WE CAN DO BETTER
None
/graphql Now (and the future) Only one endpoint (born 2012)
Database Rails App A browser React App
Fetching a Post query postQuery { post(id: 1) { id
title body author } } { "data": { "post": { "id": 1, "title": "Hello World", "body": "First post!”, "author": "Ryan Bigg", } } } Query Response GRAPHQL
query postQuery { post(id: 1) { id title body author
} } { "data": { "post": { "id": 1, "title": "Hello World", "author": "Ryan Bigg", } } } Query Response GRAPHQL Ignoring a field
Post + Comments query postQuery { post(id: 1) { id
title body author comments { text by } } } { "data": { "post": { "id": 1, "title": "Hello World", "body": "First post!”, "author": "Ryan Bigg", "comments": [ { text: "Great first post!", by: "Totally not Ryan" }, ... ] } } } Query Response GRAPHQL
GRAPHQL POST COMMENT #1 COMMENT #2 POST /graphql
query postQuery { ... } query commentQuery { comment(id: 1)
{ text user } } { "data": { “post”: { ... }, “comment”: { text: "Great first post!", user: "Totally not Ryan” } } } Query Response GRAPHQL Two queries at the same Eme
Facebook iOS App Facebook Servers 1. Get news feed items,
their comments and their users 2. Here’s everything
GRAPHQL IS BEST
ISN’T RAILS THE FUTURE OF RAILS AS YOU KNOW IT
TODAY
Rails Apps Now
The future… A browser React App Frontend App Backend App
Database Rails App
✉:
[email protected]
Thanks! : @ryanbigg ▶: hIp:/ /bit.ly/radar-for
hIps:/ /developer.github.com/v3/ API Examples REST + JSON hIps:/ /developer.github.com/v4/ GRAPHQL
hIps:/ /www.howtographql.com/ Learn these: GraphQL hIps:/ /reactjs.org/tutorial/tutorial.html React
hIps:/ /www.sandimetz.com/99boIles/ Read these: 99 BOTTLES hIps:/ /www.poodr.com PRACTICAL OBJECT-ORIENTED
DESIGN IN RUBY
hIps:/ /bit.ly/exploding-rails-talk hIps:/ /speakerdeck.com/radar/exploding-rails hIps:/ /leanpub.com/exploding-rails Exploding Rails hIps:/ /github.com/radar/twist-v2
MY EXAMPLE APPLICATION