今日話すこと

1. 個人開発が重くなりがちな理由
2. 小説投稿サイトで感じた違和感
3. Honoで小さく始める設計
4. React / Next.jsを呼ぶ判断基準

作りたいものは小さいのに

今日の主張

題材: 個人開発の小説投稿サイト

Next.jsで自然に伸びた経路

Browser
↓
JavaScript起動
↓
fetch
↓
API
↓
DB
↓
JSON
↓
state更新
↓
render

Hono SSRで短くできた経路

投稿処理はこれで成立します

HTML Form
↓
POST
↓
DB更新
↓
Redirect
↓
GET

ポートフォリオで考える

チャットで考える

ブログ・投稿サービスで考える

管理画面で考える

Server First / JavaScript on Demand

Routeに全部書かない

HTMLから始めて、必要ならAPIへ

app.get('/novels/:id', async (c) => {
  const novel = await novelService.find(c.req.param('id'))
  return c.html(<NovelPage novel={novel} />)
})

app.get('/api/novels/:id', async (c) => {
  const novel = await novelService.find(c.req.param('id'))
  return c.json(novel)
})

判断表

持ち帰ってほしいこと