はじめに
最近Vueの勉強をしているのですが、見た目に凝るのはなかなか大変でそんなときに超便利なUIコンポーネントセットのBuefyなるものを知ったのでちょっと触ってみました。
またいつかBuefyを利用したアプリも公開したいですが、今回は備忘録がてら簡単な紹介のみです。
Buefyのインストール
そもそもですが、Buefyは公式のドキュメントが非常にわかりやすく整備されているので公式ドキュメントを見れば大体わかります。
とはいってもそれでは書くことがないのでインストール方法は以下となります。
npm install buefy
インストールできたらmain.jsに以下の設定を加えれば準備完了です。
main.js
import Vue from 'vue'
import Buefy from 'buefy' //追記
import 'buefy/dist/buefy.css' //追記
Vue.use(Buefy) //追記
どんなUIを使えるのか
以下、すごい適当ですがアプリケーションを作るときに大体欲しいのは揃っていますし、カラッピッカーやカレンダーの入力も用意されているのはありがたいですね。
上記のようなUIをCSSノータッチで大体は1行くらいで簡単に書けちゃうのは非常に便利ですね。
公式ドキュメントにはほかにも様々なUIセットとサンプルコードが用意されているため作りたいアプリケーションのイメージと照らし合わせてドキュメントを眺めるだけでも楽しそうです。
以上。簡単な紹介でした。
また、Buefyを利用したアプリケーションを作った際には記事にしたいと思います。