20251014

Next.js

next/font の処理が気になったので調査を試みたが結局よくわからず。

  1. SWCでトランスパイルする時点でフォントの読み込みを検知
  2. サーバー側でJavaScriptを実行してビルドする際にフォントデータをダウンロード、関連するCSSも作成

という感じらしい?

npm run build で何が行われているかから調べたほうがいいかも。

でもそれより先にNext.jsの基礎部分固めたほうがいいかな。

shadcn/ui

https://ui.shadcn.com/

コンポーネント集。

Next.jsやViteなど、いろんなフレームワークで使える。

Tailwind CSSに依存している。

コンポーネントライブラリではなく、独自のコンポーネントライブラリを作るためのツール、とのこと。

とはいえデフォルトのデザインも持つ。コンポーネントは隠蔽化されて「いない」ので、自由に変更が可能。

特にユーザーの操作が関わるコンポーネントは重宝しそう? 内部的に状態の管理はRadix UIを使っているらしい。ただし内部的に使っているだけなのであまり意識する必要はなさそう。

ブログ

タグ機能を追加。スタイルを微調整。