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
検証も兼ねて個人開発でHonoとかと向き合った話
Search
hanetsuki
April 23, 2024
Programming
1
1.9k
検証も兼ねて個人開発でHonoとかと向き合った話
2024.4.23
TechBrew in 東京〜業務外で取り組む 個人開発での学び〜
https://findy.connpass.com/event/313271/
hanetsuki
April 23, 2024
Tweet
Share
More Decks by hanetsuki
See All by hanetsuki
ソフトウェア開発ナニモワカラナイ
hanetsuki
0
110
Next.jsの今年一年を振り返る
hanetsuki
1
1.4k
大規模メディアにおけるNext.js とVercelのレンダリングとキャッ シュ戦略について
hanetsuki
4
3k
Next.jsチョットデキル!サイトの規模やページ特性に合わせた開発テクニック
hanetsuki
3
2.2k
Jamstackで事前に欲しいパーツ群を洗い出す
hanetsuki
1
360
2022年最新版 GatsbyJS + TypeScript + microCMS でブログを作る。
hanetsuki
1
12k
Next.jsで静的サイトを作成時 よく使っているライブラリまとめ
hanetsuki
5
18k
Next.jsで整える。デザインとロジックの分離
hanetsuki
5
4.4k
Other Decks in Programming
See All in Programming
Cloudflare MCP ServerでClaude Desktop からWeb APIを構築
kutakutat
1
630
短期間での新規プロダクト開発における「コスパの良い」Goのテスト戦略」 / kamakura.go
n3xem
2
210
歴史と現在から考えるスケーラブルなソフトウェア開発のプラクティス
i10416
0
240
PHPカンファレンス 2024|共創を加速するための若手の技術挑戦
weddingpark
0
110
為你自己學 Python
eddie
0
500
Beyond ORM
77web
11
1.5k
Zoneless Testing
rainerhahnekamp
0
150
Findy Team+ Awardを受賞したかった!ベストプラクティス応募内容をふりかえり、開発生産性向上もふりかえる / Findy Team Plus Award BestPractice and DPE Retrospective 2024
honyanya
0
130
PHPで作るWebSocketサーバー ~リアクティブなアプリケーションを知るために~ / WebSocket Server in PHP - To know reactive applications
seike460
PRO
2
720
開発者とQAの越境で自動テストが増える開発プロセスを実現する
92thunder
1
220
Итераторы в Go 1.23: зачем они нужны, как использовать, и насколько они быстрые?
lamodatech
0
1.2k
月刊 競技プログラミングをお仕事に役立てるには
terryu16
1
1k
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
427
64k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3.1k
GitHub's CSS Performance
jonrohan
1030
460k
Rails Girls Zürich Keynote
gr2m
94
13k
Docker and Python
trallard
43
3.2k
Gamification - CAS2011
davidbonilla
80
5.1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.2k
Visualization
eitanlees
146
15k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
The Cost Of JavaScript in 2023
addyosmani
46
7.1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
18k
Into the Great Unknown - MozCon
thekraken
34
1.6k
Transcript
TechBrewin 東京〜業務外で取り組む 個人開発での学び〜 検証も兼ねて個人開発で とかと向き合った話 Hono hanetsuki
自己紹介 hanetsuki @hantsuki_dev #TypeScript #Next.js #AB型 #子育て #日本酒 #アニメ #イラスト #漫画 #ゲーム #VTuber #Hono フロントエンド領域を主戦場とし、 浅く広くやっているモノづくり好きなWEBエンジニア。
最近のプライベートタイムは絵描き活動をしている。
個人開発やってますか?
私はどうして個人開発をしているのか 学習 開発意欲 課題解決
仕事でモダンな技術を取り入れたい I 今後新規プロダクトが立ち上がる時にProd起用できるようC I Prod起用することになった時に触れるように
今回は何を触る? 5 Remi& 5 Hon 5 Next.j# 5 Cloudflare 気になるスタックは色々あるけど...今回は、
今回は何を触る? on
with RPC
今回の技術モチベーション f Next.jsのRoute Handlersをいちいち定義したくなa f Remix on Hono on Cloudfrareとかも興味あったが..S
f Hono使ってみたa f Hono使ってみたa f Hono使ってみたa f Hono使ってみたい
Step. 1 本家公式ドキュメントを読み漁る
Step. 1 本家公式ドキュメントを読み漁る Hono - Ultrafast web framework for the
Edges https://hono.dev/
Step. 2 yusukebeさんのZennを読み漁る
Step. 2 yusukebeさんのZennを読み漁る Hono - Ultrafast web framework for the
Edges yusukebeさんの記事一覧 | Zenn https://hono.dev/ https://zenn.dev/yusukebe
Step. 3 気 完全に理解した になる
多分登壇の時間が押しているので 簡単に実装面の紹介
今回はa U Next.jsのApp Routerをベースとして Route HandlersにHonoを乗せていきまR U 最低限必要になってくるserver.tsとroute.ts のサンプルコードを紹介します。
/server.ts
/server.ts
/server.ts
/server.ts
/server.ts
/app/api/[...route]/route.ts
もう一歩深い使い方を試す Grouping routes for RPC
Grouping routes for RPC https://hono.dev/snippets/grouping-routes-rpc
c Hono on Next.js 結構おすすQ c 個人開発をしておくと、会社で新しいプロジェクトを立ち上げる時や 立ち上がった時に手をあげやすくな" c 注目の技術をキャッチアップしておくと社内で一目置かれる存在に?
Special Thank You 言語ロゴ:さわらつき さん(https://x.com/sawaratsuki1004) まとめ
「今年はフロントエンド20名を募集中!」 採用情報 フルリモート フルフレックス Vercel Sandbox使い放題 https://chot-inc.com/recruit
ご清聴ありがとうございました