【2019年8月】Vue.jsライブラリ記事まとめ

2019年9月2日

【2019年8月】Vue.jsライブラリ記事まとめ

毎日は見てられない人向けの2019年8月のVue.jsライブラリの紹介記事まとめです。

 

Vue.jsライブラリ リンク集

「vue-password-strength-meter」で強度推定付きパスワードフォームを実装する

vue-password-strength-meter」でパスワード強度推定付きフォームを実装する

 

vue-password-strength-meterは、強度推定付きパスワードフォームを実装するライブラリです。

パスワード強度推定には、デフォルトでzxcvbnを使用しています。

パスワードの表示/非表示を切り替えやパスワードカウントバッジを表示、また専用のパスワード強度推定ライブラリを設定することができます。

>>記事はこちら

 

「Vue JSON Tree View」でTree形式でJSONを表示する

「Vue JSON Tree View」でTree形式でJSONを表示する

 

Vue JSON Tree Viewは、Tree形式JSONを表示するライブラリです。

>>記事はこちら

 

 

「Vue Carousel 3D」で3Dカルーセルスライダーを実装する

「Vue Carousel 3D」で3Dカルーセルスライダーを実装する 3

Vue Carousel 3D」は、3Dカルーセルスライダーを実装するライブラリです。

自動再生の機能はもちろん、一時的にスライドを止めることも可能です。
スライドの方向も設定することが可能です。

>>記事はこちら

 

 

「vue-diagrams」でダイアグラムを実装する

「vue-diagrams」でダイアグラムを実装する

 

vue-diagrams」はreact-diagramsにインスパイアされたダイアグラムを実装するライブラリです。
ノードを色を変更したり、ノード同士を連結したりすることができます。

>>記事はこちら

 

「vue-form-wizard」でwizard型フォームに実装する

vue-form-wizard」でwizard型フォームに実装する 17

 

vue-form-wizard」はwizard型フォームを実装するためのライブラリです。

外部依存関係のないvueベースのコンポーネントであり、タブウィザードの管理を簡素化し、詳細に時間を浪費するのではなく、アプリの機能部分に集中できるようにします。

>>記事はこちら

 

「vuejs-countdown」でカウントダウンを実装する

「vuejs-countdown」でカウントダウンを実装する

 

vuejs-countdownはカウントダウンを実装できるコンポーネントライブラリです。

>>記事はこちら

 

「vue-qrcode-reader」でQRコードリーダーをWEBページに実装する

「vue-qrcode-reader」でQRコードリーダーをWEBページに実装する

 

vue-qrcode-readerは、QRコードリーダーを実装できるコンポーネントライブラリです。
WEBページ上でカメラを起動してリアルタイムでQRコードを読み取ることができます。

他にもQRコードアップロードして読み込むコンポーネントが搭載されています。

>>記事はこちら

 

「vue-qriously」でQRコードを作成する

「vue-qriously」でQRコードを作成する

 

vue-qriouslyは、QRコードを作成することができるライブラリです。

qriousというライブラリが元になっています。

QRコードを作成する時にサイズなどの設定を行うことができます。

>>記事はこちら

 

「vue-grid-layout」で実装するグリッドレイアウトはドラッグやリサイズが可能

「vue-grid-layout」で実装するグリッドレイアウトはドラッグやリサイズが可能

 

vue-grid-layoutは、ドラッグリサイズが可能なグリッドレイアウトコンポーネントです。

グリッドを再構築せずにウィジェットを追加または削除できたり、レイアウトをシリアル化して復元できます。

>>記事はこちら

 

「vue-recaptcha」で「Google reCAPTCHA」コンポーネントを実装する

「vue-recaptcha」で「Google reCAPTCHA」コンポーネントを実装する 8

 

vue-recaptchaは、Google reCAPTCHA V2用のコンポーネントライブラリです。

>>記事はこちら

 

「vue-stroll」で16種類の楽しいスクロールエフェクトを実装する

「vue-stroll」で16種類の楽しいスクロールエフェクトを実装する

 

vue-strollは、リストのスクロールにエフェクトを実装するライブラリです。

元々はstroll.jsというGithubスター 4000を超えるライブラリです。

iOSおよびAndroid 4.x用の特別なタッチ対応モードを含むCSS 3D変換をサポートするブラウザーで動作します。

>>記事はこちら

 

「VueScrollmonitor」で要素のビューポート出入りを監視する

「VueScrollmonitor」で要素のビューポートに出入りを監視する

 

VueScrollmonitorは、スクロールモニタで要素がビューポートに出入りするときにイベントを受け取ることができるライブラリです。

もともとはscrollMonitorというライブラリです。

要素を監視してイベントをトリガーするウォッチャーオブジェクトを使用して行います。
ウォッチャーオブジェクトには、ビューポートに対する要素の可視性位置など、監視する要素に関する情報も含まれています。

>>記事はこちら

 

「vue-mq」でレスポンシブのブレークポイントを定義する

「vue-mq」でレスポンシブのブレークポイントを定義する

 

vue-mqは、レスポンシブのブレークポイントを定義できるライブラリです。
セマンティックおよび宣言的にモバイルファーストの構築が行えます。

>>記事はこちら

 

「vue-slider-component」でスライダーを実装する

「vue-slider-component」でスライダーを実装する 19

 

vue-slider-componentは、高度にカスタマイズされたスライダーコンポーネントです。

マルチスライダー範囲指定スイッチデータなどのスライダーもサポートしています。
加えて複数のスタイルテーマが公式で用意されています。

>>記事はこちら

 

「vue-star-rating」で星評価コンポーネントを実装する

「vue-star-rating」で星評価コンポーネントを実装する

 

vue-star-ratingは、シンプルで高度にカスタマイズ可能な星評価コンポーネントです。

星のサイズや色の変更などのスタイルのカスタマイズを行うことができます。

>>記事はこちら

 

「vue-textra」を使ってテキストをスライドさせる

「vue-textra」を使ってテキストをスライドさせる

 

vue-textraテキストをスライドさせるVue.js製のライブラリです。
テキストのスライドに9種のアニメーションを付加することができます。

>>記事はこちら

 

「vue-context-menu」で右クリックのコンテキストメニューを実装する

「vue-context-menu」で右クリックのコンテキストメニューを実装する

 

vue-context-menuは、コンテキストメニューを実装するライブラリです。
必要最低限の機能だけを備えたシンプルなライブラリとなっています。

>>記事はこちら

 

さいごに

8月は趣味全開のライブラリをまとめていました。

Githubのスター数は少ないのですが、面白いおもちゃライブラリ達なので、ぜひ遊んでみてください。

 

 

前月のまとめ記事

【2019年7月】Vue.jsライブラリ記事まとめ

 

  • この記事を書いた人

カバノキ

印刷会社のWEB部隊に所属してます。 WEB制作に携わってから、もう時期10年になります。 普段の業務では、PHPをメインにサーバーサイドの言語を扱っています。 最近のお気に入りはJavascriptです。 Vue.jsを狂喜乱舞しながら、社内に布教中です。

-vue.js
-,