Vuetifyでちょっとリッチな画面を作る
こんにちは！この記事はLOCAL学生部アドベントカレンダー22日目への寄稿です。
今回はVuetifyのUIコンポーネントはいいですね、というお話です。
vuetifyjs.com
Vue.js＋Vuetifyの素振りとして自作のポートフォリオを作り直してみたのですが、ほぼCSSなしでいい感じにレイアウトを組めてとても良いですね。
実装されているコンポーネントの種類が豊富さが凄い。カレンダーやグリッドデザイン、カルーセルからタイムライン表示までetc.
基本的にはメインのコンポーネントに固有コンテンツを記述し、メニューバーはv-navigation-drawer, ヘッダーはv-app-bar,フッターはv-footerといったようにパーツ単位でUIコンポーネントを選択してレイアウトを組むことになりますが、プラモデルを組んでいる感覚に近いです。
ワイヤーフレームの例を見ていると、Discordのクローンなんかも作れそうですね。
余談ですがUIについて
mkan-0141.hatenablog.com
このようなエントリーを見かけて、次はFlutterを使って何か作ってみようかなぁと考えています。
