shadcn/ui Blocks

shadcn/ui の新機能です。

yoshimo

2 April, 2024

はじめに

みなさんお久しぶりです！

今回は shadcn/ui Blocks という shadcn/ui の新機能をご紹介します。

shadcn/ui は Radix UI と Tailwind CSS で作られてるコンポーネントライブラリです。npm で管理せず、自らのコードベースで管理するという特徴があります。それにより、カスタマイズがしやすくコンポーネントを頻繁に微調整するときに使いやすいです。

今回、追加された shadcn/ui Blocks はコンポーネント一つではなく、コンポーネントが一つの画面として組み立てられてて（ダッシュボードやログイン画面等）それを丸っとコピペできる機能です。レスポンシブ対応もされてるようです。

さらに右上にある『Edit in v0』を押すと、その画面をベースにプロンプトで、修正を加えられます。v0 は使用量によっては有料ですが、shadcn/ui Blocks の機能自体は無料というのが凄いですね！👏

NextUI は NextUI Pro という shadcn/ui Blocks と似た機能を有料で出してて、Tremor も Tremor Blocks という似た機能を一部有料で出してるようです。

今回は shadcn/ui Blocks についてでした。また役立ちそうな情報がありましたら、ご紹介します。それでは今回もこちらの記事を読んでいただき、ありがとうございました！🙏