Vue.js/Nuxt.js

Vue.js/Nuxt.js

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

概要Vue.jsを利用したプロジェクトに、firestoreを利用してデータ取得を行う手順を解説する。公式ドキュメント公式ドキュメントはこちら。前提vue createコマンドを利用して作成したVue.jsプロジェクトを想定するfireba...
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をそのまま使うのではなく、vue-ch...
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つ。sass-...