Vue.js/Nuxt.js

Vue.js/Nuxt.js

Vue.jsのプロジェクトにfirebaseを導入する

概要 Vue.jsを利用したプロジェクトに、firestoreを利用してデータ取得を行う手順を解説する。 公式ドキュメント 公式ドキュメントはこちら。 前提 vue createコマンドを利用して作成したVue.jsプロジェクトを想定する ...
Vue.js/Nuxt.js

【Vue.js】ディレクティブ省略記法メモ

Vue.jsではよく利用する構文は省略して記述することができる。 久しぶりにVue.jsに触ると忘れてしまうのでメモ。 v-bind: → : v-bindディレクティブは、Vue.js内で使われているデータを画面に埋め込む時によく利用する...
JavaScript

【Nuxt.js】chart.jsを使ってみる

Nuxt.jsのプロジェクトにchart.jsを導入し、グラフを描画する。 一応Nuxt.jsとして紹介しているが、もちろんVue.jsでも利用できる。 参考 インストール Vueを使うときは、chart.jsをそのまま使うのではなく、vu...
Vue.js/Nuxt.js

【Nuxt.js】ContentfulのMarkdown形式のブログコンテンツを表示する

Nuxt.js + Contentfulを使ってブログシステムを構築中に少しつまづいたのでメモ。 やりたいこと ContentfulにはMarkdown形式でブログコンテンツのデータを保存最終的にブログをhtml形式で表示するブログのスタイ...
Vue.js/Nuxt.js

【Vue.js/Nuxt.js】SCSSを使う

私はCSSを書くとき、必ずSCSSを利用する。 通常のCSSをそのまま書くよりも構造化されているため圧倒的に書きやすい。 SCSSは最終的にCSSに変換する必要があり、そのためのツールがnpmで提供されている。 必要なパッケージは2つ。 s...