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.8k
検証も兼ねて個人開発で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
Next.jsの今年一年を振り返る
hanetsuki
1
1.4k
大規模メディアにおけるNext.js とVercelのレンダリングとキャッ シュ戦略について
hanetsuki
4
2.9k
Next.jsチョットデキル!サイトの規模やページ特性に合わせた開発テクニック
hanetsuki
4
2.2k
Jamstackで事前に欲しいパーツ群を洗い出す
hanetsuki
1
340
2022年最新版 GatsbyJS + TypeScript + microCMS でブログを作る。
hanetsuki
1
12k
Next.jsで静的サイトを作成時 よく使っているライブラリまとめ
hanetsuki
5
17k
Next.jsで整える。デザインとロジックの分離
hanetsuki
5
4.3k
Other Decks in Programming
See All in Programming
Vue3の一歩踏み込んだパフォーマンスチューニング2024
hal_spidernight
3
2.8k
現場で役立つモデリング 超入門
masuda220
PRO
10
2.2k
cXML という電子商取引の トランザクションを支える プロトコルと向きあっている話
phigasui
2
1.5k
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
280
Folding Cheat Sheet #8
philipschwarz
PRO
0
160
Mercari AI/LLM Hackathon TeamBの発表資料
imaikosuke
0
200
2万ページのSSG運用における工夫と注意点 / Vue Fes Japan 2024
chinen
3
1.2k
Go言語でターミナルフレンドリーなAIコマンド、afaを作った/fukuokago20_afa
monochromegane
2
130
Prompt Engineering for Developers @ AWS Community Day Adria 2024
slobodan
0
110
PagerDuty を軸にした On-Call 構築と運用課題の解決 / PagerDuty Japan Community Meetup 4
horimislime
1
100
レイトレ合宿10 レンダラー紹介 / Renderer Introduction, Ray Tracing Camp 10
shocker_0x15
0
670
のびしろを広げる巻き込まれ力:偶然を活かすキャリアの作り方/oso2024
takahashiikki
1
350
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
66
9.9k
Learning to Love Humans: Emotional Interface Design
aarron
272
40k
A Modern Web Designer's Workflow
chriscoyier
692
190k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
92
16k
A better future with KSS
kneath
237
17k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.6k
Gamification - CAS2011
davidbonilla
80
5k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
The Art of Programming - Codeland 2020
erikaheidi
51
13k
Build The Right Thing And Hit Your Dates
maggiecrowley
32
2.4k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.5k
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
ご清聴ありがとうございました