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
2.1k
検証も兼ねて個人開発で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
AIを用いて実践してきた開発方法について
hanetsuki
1
68
ソフトウェア開発ナニモワカラナイ
hanetsuki
0
200
Next.jsの今年一年を振り返る
hanetsuki
1
1.5k
大規模メディアにおけるNext.js とVercelのレンダリングとキャッ シュ戦略について
hanetsuki
4
3.4k
Next.jsチョットデキル!サイトの規模やページ特性に合わせた開発テクニック
hanetsuki
3
2.4k
Jamstackで事前に欲しいパーツ群を洗い出す
hanetsuki
1
420
2022年最新版 GatsbyJS + TypeScript + microCMS でブログを作る。
hanetsuki
1
12k
Next.jsで静的サイトを作成時 よく使っているライブラリまとめ
hanetsuki
5
18k
Next.jsで整える。デザインとロジックの分離
hanetsuki
5
4.6k
Other Decks in Programming
See All in Programming
OCaml 5でモダンな並列プログラミングを Enjoyしよう!
haochenx
0
150
CSC307 Lecture 03
javiergs
PRO
1
490
MDN Web Docs に日本語翻訳でコントリビュート
ohmori_yusuke
0
660
React Native × React Router v7 API通信の共通化で考えるべきこと
suguruooki
0
100
日本だけで解禁されているアプリ起動の方法
ryunakayama
0
280
humanlayerのブログから学ぶ、良いCLAUDE.mdの書き方
tsukamoto1783
0
200
CSC307 Lecture 04
javiergs
PRO
0
660
Apache Iceberg V3 and migration to V3
tomtanaka
0
170
責任感のあるCloudWatchアラームを設計しよう
akihisaikeda
3
180
KIKI_MBSD Cybersecurity Challenges 2025
ikema
0
1.3k
ぼくの開発環境2026
yuzneri
0
250
なぜSQLはAIぽく見えるのか/why does SQL look AI like
florets1
0
480
Featured
See All Featured
It's Worth the Effort
3n
188
29k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
96
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
66
37k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
1
1.3k
Reality Check: Gamification 10 Years Later
codingconduct
0
2k
ラッコキーワード サービス紹介資料
rakko
1
2.3M
The SEO Collaboration Effect
kristinabergwall1
0
360
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
190
Raft: Consensus for Rubyists
vanstee
141
7.3k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.1k
From π to Pie charts
rasagy
0
130
How STYLIGHT went responsive
nonsquared
100
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
ご清聴ありがとうございました