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
620
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
460
再実装 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
AI時代のドメイン駆動設計-DDD実践におけるAI活用のあり方 / ddd-in-ai-era
minodriven
23
9k
KessokuでDIでもgoroutineを活用する / Go Connect #6
mazrean
0
110
Microsoft Orleans, Daprのアクターモデルを使い効率的に開発、デプロイを行うためのSekibanの試行錯誤 / Sekiban: Exploring Efficient Development and Deployment with Microsoft Orleans and Dapr Actor Models
tomohisa
0
210
自作OSでDOOMを動かしてみた
zakki0925224
1
1.4k
管你要 trace 什麼、bpftrace 用下去就對了 — COSCUP 2025
shunghsiyu
0
470
The state patternの実践 個人開発で培ったpractice集
miyanokomiya
0
150
一人でAIプロダクトを作るための工夫 〜技術選定・開発プロセス編〜 / I want AI to work harder
rkaga
13
2.8k
Terraform やるなら公式スタイルガイドを読もう 〜重要項目 10選〜
hiyanger
13
3.2k
Portapad紹介プレゼンテーション
gotoumakakeru
1
130
A Gopher's Guide to Vibe Coding
danicat
0
170
SOCI Index Manifest v2が出たので調べてみた / Introduction to SOCI Index Manifest v2
tkikuc
1
110
コンテキストエンジニアリング Cursor編
kinopeee
1
710
Featured
See All Featured
The Language of Interfaces
destraynor
160
25k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Facilitating Awesome Meetings
lara
55
6.5k
Git: the NoSQL Database
bkeepers
PRO
431
65k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.6k
Typedesign – Prime Four
hannesfritz
42
2.8k
The Art of Programming - Codeland 2020
erikaheidi
55
13k
Making Projects Easy
brettharned
117
6.3k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.4k
Statistics for Hackers
jakevdp
799
220k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Code Reviewing Like a Champion
maltzj
525
40k
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 ありがとうございました