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
Hydrogenで 2022年〜を感じる
Search
Ryusou
December 15, 2021
Programming
0
610
Hydrogenで 2022年〜を感じる
PWA Night vol.34 ~2021年最後はLT会!〜
https://pwanight.connpass.com/event/231422/
Ryusou
December 15, 2021
Tweet
Share
More Decks by Ryusou
See All by Ryusou
Astro 3.0入門
nozaki
0
450
再実装 React Testing Library
nozaki
0
210
microCMSでimgixに入門する
nozaki
0
1.1k
Jamstack Conf 2021を見てブログ構成を見直した話
nozaki
1
1.3k
ユーザーが編集中の状態管理について考えよう
nozaki
3
6.8k
はじめてのUniversal JavaScript
nozaki
1
2.4k
Other Decks in Programming
See All in Programming
Advanced Micro Frontends: Multi Version/ Framework Scenarios @WAD 2025, Berlin
manfredsteyer
PRO
0
440
型で語るカタ
irof
1
810
Git Sync を超える!OSS で実現する CDK Pull 型デプロイ / Deploying CDK with PipeCD in Pull-style
tkikuc
4
450
AIともっと楽するE2Eテスト
myohei
9
3.1k
Claude Code で Astro blog を Pages から Workers へ移行してみた
codehex
0
150
Android 16KBページサイズ対応をはじめからていねいに
mine2424
0
650
リッチエディターを安全に開発・運用するために
unachang113
1
240
AI時代の『改訂新版 良いコード/悪いコードで学ぶ設計入門』 / ai-good-code-bad-code
minodriven
24
10k
AIコーディングエージェント全社導入とセキュリティ対策
hikaruegashira
12
7.3k
iOS開発スターターキットの作り方
akidon0000
0
180
ソフトウェア設計とAI技術の活用
masuda220
PRO
25
6.7k
The Niche of CDK Grant オブジェクトって何者?/the-niche-of-cdk-what-isgrant-object
hassaku63
1
690
Featured
See All Featured
Being A Developer After 40
akosma
90
590k
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Site-Speed That Sticks
csswizardry
10
720
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Designing for humans not robots
tammielis
253
25k
Done Done
chrislema
184
16k
The World Runs on Bad Software
bkeepers
PRO
70
11k
GraphQLとの向き合い方2022年版
quramy
49
14k
How STYLIGHT went responsive
nonsquared
100
5.6k
Thoughts on Productivity
jonyablonski
69
4.7k
Writing Fast Ruby
sferik
628
62k
Fireside Chat
paigeccino
37
3.5k
Transcript
Hydrogenで 2022年〜を感じる @ryusou
Hydrogenとは? Shopifyが開発している React basedのフレームワーク https://hydrogen.shopify.dev/ ※現在開発者プレビュー段階のものになり ます。
Hydrogenの注目ポイント ①React Server Componentsをいち早く試せる React は正式リリースされていない(α) Hydrogenは独自にラップすることで実現している → DEMO
Hydrogenの注目ポイント ①React Server Componentsをいち早く試せる useQuery(useShopQuery) Hooksがサーバー側で動く....!!
Hydrogenの注目ポイント ②「ヘッドレス」コマース + UIの提供 コマンド一つでECサイトの雛形が作れる TailwindCSS/Headless UIを利用 Next.js/Gatsby側にUIを組み込むこともできるらしい ヘッドレス 良い =独自にUIを組み立てられる 微妙 =作るの大変(表裏一体ではあるが..)
Hydrogenの注目ポイント ③ ViteでPWA(試したわけではないので....) vite-plugin-pwa: https://www.npmjs.com/package/vite-plugin-pwa
まとめ Hydrogenには2022〜がつまっていた ヘッドレスコマース..etc + ヘッドレスUI は 流行りそう 外部APIは部分的に部分的に採用するのが 良さそう
りゅーそう 株式会社 microCMS エンジニア Twitter @ryusou_mtkh イベントやっているので、ぜひ!
良いお年を! @ryusou ありがとうございました