Nuxt.jsのlayoutsとpagesとcomponentsの使い分け
Nuxtのプロジェクトを作成すると、layoutsとpagesとcomponentsフォルダが作成されます。 layoutsとpagesとcomponentsの使い分けについて紹介します。
プログラミングの独学サイトです。
CATEGORY
JavaScriptに関する基礎、実装例、トラブル解決の記事をまとめています。
Nuxtのプロジェクトを作成すると、layoutsとpagesとcomponentsフォルダが作成されます。 layoutsとpagesとcomponentsの使い分けについて紹介します。
Nuxt.jsの3つのモード(SSR、SPA、プリレンダリング)のメリットとデメリットについて紹介します。
JavaScriptの!!(エクスクラメーション)2つの意味について紹介します。 JavaScriptの!!(エクスクラメーション)2つの意味...
vuexを使っていてリロードされた場合、表示しておいてほしい情報でもstateがリセットされてしまって、表示できなくなります。 vuex-persistedstateというプラグインを使うとstateの情報を永続化できます。 vuex-persistedstateの使い方をまとめました。
VueでSASS(SCSS)が使えないときの対処方法を紹介します。 VueでSASS(SCSS)が使えないときの対処方法は・・・
Vue.jsで作成したフロントエンドをNetlifyで公開するときに.envの環境変数が読み込まれないときの対処方法です。
ES6であたらしくSetとmapというデータ構造が追加されました。 Setの使い方と具体例をみていきましょう。
Firebaseの基本的な使い方をまとめました。 Vue.jsアプリを作成した後でFirebaseを利用する場合 Firebaseでプロジェクトを作成する Firebaseプロジェクトを作成します。 プロジェクト名を入力…
Error: firestore.indexes.json does not existが出たときの対処方法を紹介します。
firebaseのfirestoreをアプリケーションで利用しているときに、ログアウトすると、snapshot listenerのエラーが次のように出た場合の対処方法です。 Uncaught Error in snaps…
プリミティブ型(primitives)とオブジェクト型(objects)についてまとめました。 プリミティブ型とオブジェクト型で値を変更したとき、どのような結果になって、なぜそれが異なる結果になるのか、理解しておかないと…
vuex-persistedstateで永続化したstateデータを初期化する方法を紹介します。 vuex-persistedstateで永続化したstateデータを初期化する方法 src/store/index.jsに…
Firebaseのfirestoreでは、ドキュメントのユニークなIDを自動生成することができます。 ドキュメントを追加する前に自動生成IDを取得できれば、ドキュメントの中にも入れることができて便利です。 ドキュメント追加前に自動生成IDを取得する方法を紹介します。
JavaScriptのsort()メソッドの使い方と昇順・降順のやり方をまとめました。 sort()メソッドの基本的な使い方 sort()メソッドはオリジナルの配列をソートします。 すべての配列要素は文字列に変換され、文…
Vue.jsのtransitionコンポーネントnameを動的にして使う方法を紹介します。 特に次へ、前へ、上へ、下へなどの似たようなアニメーションを設定する際に使います。
Vue.js(Vue v3)で要素がスクロール画面に現れたらアニメーションさせる方法を紹介します。 IntersectionObserverを使います。 Vue.js(Vue v3)で要素がスクロール画面に現れたらアニメ…