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
Creating rich universal React apps powered by R...
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Akihito Koriyama
September 30, 2017
Technology
8.1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Creating rich universal React apps powered by RESTful PHP
phpnw17 unconf session
See more about BEAR.Sunday
http://bearsunday.github.io
Akihito Koriyama
September 30, 2017
More Decks by Akihito Koriyama
See All by Akihito Koriyama
存在論的プログラミング: 時間と存在を記述する
koriym
5
1.1k
BEAR.Sunday Framework Masterclass
koriym
0
71
Be Framework: 生命システムとしての存在理解
koriym
0
170
新世界の理解
koriym
0
250
AI Centric
koriym
0
570
app-state-diagram
koriym
0
170
OOP, Double Dispatch and Visitor Pattern
koriym
3
220
BEAR.Sunday 2014-2024
koriym
0
100
イベント駆動コンテンツ (a.k.a Webアプリケーションの効率を再定義するBEAR.Sundayの分散キャッシングフレームワーク)
koriym
5
9.8k
Other Decks in Technology
See All in Technology
データ組織の転換期 一足飛びしない段階的戦略
leveragestech
PRO
0
140
テックカンファレンス三大ステークホルダーの文化人類学 ─ 違いを認め合う関係性作り
bash0c7
5
1.5k
Data Hubグループ 紹介資料
sansan33
PRO
0
3.1k
なぜ、あなたのエージェントは言うことを聞かないのか
segavvy
1
610
AIがコードを書く時代、人間は何を保証するのか———馬場さんと考える、開発者に求められる新しい責任と価値 - TECH PLAY
netmarkjp
0
1k
大 AI 時代におけるC# の事情 ~ぶっちゃけトークを交えながら~
nenonaninu
1
610
Webの技術とガジェットで子どもも大人も楽しめるワクワク体験を提供する / Qiita Tech Festa Day 2026
you
PRO
1
330
NYC Summit 2026 におけるAmazon Bedrock AgentCore のアップデート
ren8k
3
300
AI時代の強いチームの作り方
yuukiyo
23
13k
新しい SLO が良い感じにハマっている話
z63d
4
1.9k
クラウドを使う側から、作る側へ / 大吉祥寺.pm 2026前夜祭
fujiwara3
8
2k
システム監視入門
grimoh
5
790
Featured
See All Featured
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
330
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
How to make the Groovebox
asonas
2
2.3k
Designing Powerful Visuals for Engaging Learning
tmiket
1
470
Building Applications with DynamoDB
mza
96
7.1k
Amusing Abliteration
ianozsvald
1
240
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
We Have a Design System, Now What?
morganepeng
55
8.2k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
6k
Odyssey Design
rkendrick25
PRO
2
740
What does AI have to do with Human Rights?
axbom
PRO
1
2.3k
Done Done
chrislema
186
16k
Transcript
Creating rich universal React apps powered by RESTful PHP Akihito
Koriyama (@koriym) phpnw17 12.00 @ Manchester Conference Centre
None
None
GET /menu
None
8FC
$POTPMF
GET /menu .. 200 OK Then ?
IUUQTFOXJLJQFEJBPSHXJLJ"⒎PSEBODF
no affordance 8IBUJTUIFQPTTJCJMJUZPGUIFBDUJPO
None
None
rel=“order” ! *U`TUIFQPTTJCJMJUZPGUIFBDUJPOz
/order but how ?
None
OPTIONS /order
None
(FOFSBUFGSPNQIQEPD
POST /order?name=latte ☕
None
GET /order?id=123
None
OPTIONS /payment
PUT: the payment should be idempotent
IUUQTXXXJOGPRDPNKQBSUJDMFTXFCCFSSFTUXPSLqPX Resource interface for state machine URI as a state
" " "
None
CURIEs (Compact URI) IUUQTFOXJLJQFEJBPSHXJLJ$63*&
GET rels/?rel=todo
None
201 POST /order/?name=latte 200 PUT /payment?order_id&card_num=123&expire=101018 URIs as an event
source BQQMJDBUJPOSFTPVSDFMPH
Hypermedia API
= REST API
None
REST != CRUD over HTTP
REST != Return JSON with pretty URI
REST should be hypermedia driven
Hypermedia Driven Development
None
IUUQTXXXXPSHJOUFHSBUJPOXPSLTIPQQIZQFSNFEJBPSJFOUFEEFTJHOQEG
IUUQTXXXJOGPRDPNKQBSUJDMFTXFCCFSSFTUXPSLqPX
IUUQKTPOTDIFNBPSH
JOQVUWBMJEBUJPO
None
Backend Frontend
REST API • Discoverable • Self Descriptive • Hypermedia constraint
Separation of Responsibilities
200 GET / Get the link of APIs 200
OPTIONS /todo Get the communication options available 201 POST /todo?title=run Create new resource and get the URI of new resource in location header 200 GET /todo?id=1 Get the created resource = headless application REST App
Headless REST application / CMS + template engine =
HTML application
Headless REST application / CMS + JS UI application
= ?
None
SSR (Sever Side Rendering)
None
None
None
None
$MJFOU4JEF3FOEFSJOH 4FSWFS4JEF3FOEFSJOH
$43 443
4FSWFS4JEF
1)13&45"QQ +46*"QQ
None
PHP First Rich UI App • PHP - Routing
- Application logic - Domain logic • JS (SSR + CSR) - View logic - UI logic
Benefit • Performance + Caching • HTTP Status Code, Header
• HTML Header (OGP / Twitter card) • SEO • Only when needed
SSR Performance
None
IUUQTUFTJFHJUIVCJPTOBQTIPUQFSGPSNBODF
7KT 4PVSDF$PEF 7KT *OUFSOBM 4OBQTIPU &YUFSOBM 4OBQTIPU /P 4OBQTIPU TOBQTIPU
+4MJCSBSJFT 3FBDUBQQ 4OBQTIPU 7KT
IUUQTHJUIVCDPNLPSJZN,PSJZN#BSBDPB JOEFYKT #BSBDPB 5XJH A framework agnostic SSR interface
Other REST Oriented Framework
BEAR.Sunday • “Everything is a resource” • 100% DI, Multi
application at once • No BC break
@koriym Thanks @BEARSunday