ブログ
Vue.jsを使用するための優れたUIフレームワークを紹介する
こんにちは、クロスメディア課のベトナム人エンジニア ティエンです。
9月に入ってから急激に寒くなりましたね。
気温の急激な変化で体調を崩さないように、みなさんお身体をご自愛ください。
今日は自分が今まで使ってきたVue.jsのUIフレームワークを紹介していきたいと思います。
プロジェクトでUIフレームワークを使うと、開発時間を大幅に削減できます。
機会があれば是非使ってみてください。
さて、いきましょう!
ウェブサイト:https://element.eleme.io/
Elementはかなり有名なUIフレームワークで、必要なコンポーネントのほとんどすべてが含まれています。
日本語のドキュメントはありませんが、コンポーネントの使い方の例がありますのでそれを見れば使い方がわかります。
ウェブサイト:https://buefy.org
Buefyは、BulmaというCSSフレームワークをVue.js向けに拡張したフレームワークになります。
BulmaはFlexboxを使用するモバイル初のCSSフレームワークです
Buefyの特徴は軽くてドキュメントも読みやすいことですが、コンポーネントの数はElementより少ないです。
ウェブサイト:https://bootstrap-vue.org
Bootstrap VueはBootstrap4というCSSフレームワークをVue.js向けに拡張したフレームワークです。Bootstrap 4のすべてが含まれておりドキュメントも読みやすいし、何よりBootstrapのクラスをそのまま流用できるのがいいと思います。
プロジェクトでBootstrapを使用している人におすすめです。
ウェブサイト:https://vuetifyjs.com
Vuetifyは、Vue用に構築されたsemanticコンポーネントフレームワークです。コンポーネントも多いしデザインも綺麗ですが、ドキュメントが読みにくいです。
ウェブサイト:https://quasar.dev
Quasar frameworkはマテリアルデザインベースのデザインを簡単に構築することが可能なVue.js製のデザインフレームワークです。
Quasarを使用すると、コードを1回記述してから、同じコードベースを使用して、Webサイト、PWA、モバイルアプリ、Electronアプリとして同時に展開できます。
コンポーネントの数も多いしドキュメントも充実しており、「一番何でもできるUIフレームワーク」だと思いますが、何でもできる反面使いこなすには時間がかかると思います。
上記はVue.jsを使用するための優れたUIフレームワークを紹介しました。他にも無数のライブラリがあります、例えば:
Framework7
Onsen UI
Vue-material
Keen UI
Vuikit…
機会があったら是非使ってみてください。
関連記事
2024.09.30
2024.09.30
2024.04.08