vue.js、Vuetifyの開発環境を作る

vue.js、Vuetifyの開発環境を作る

技術進歩が昨今著しいフロント業界ですが、今回はよく使用されているフレームワークあれるVue.jsの開発環境を構築します。 npm install vue これで最新の安定版のVueがインストールできます。 github上の最新コードからインストールを行う場合は以下のように行います。 git clone https://github.com/vuejs/vue.git node_modules/vue cd node_modules/vue npm install npm run build...
Nuxt.jsでのaxios非同期通信をする

Nuxt.jsでのaxios非同期通信をする

http通信で、ブラウザとWebサーバーとの間で通信を行うためのパッケージであるaxiosをnuxt.js環境に導入します。 npm install axios JSON Placeholderなどの外部サービスからテスト用にリクエストを送れるJSONデータを用意します。 <template> <div>{{users}}</div> </template> <script> const axios = require("axios"); let...
フロントをNuxt.js、バックエンドをfirebaseでSPA環境を作る

フロントをNuxt.js、バックエンドをfirebaseでSPA環境を作る

フロントをnuxt.js、バックエンドをfirebaseでSPA開発をする場合の連携方法についてご紹介します。 まずは、npx create-nuxt-appでnuxt.jsの環境を構築し、その後の方法を以下に示します。注意として、create-nuxt-appで環境構築する際の設定として、レンダリングモードをSPAにすることが必要になる点に気をつけましょう。...
Nuxt.jsのルーティングの仕組み

Nuxt.jsのルーティングの仕組み

Nuxt.jsはVue.jsのフレームワークで、Vue.jsでも使用されることが多々あるVue Routerを用いてルーティング処理を行っています。 nuxtの開発環境が構築されているフォルダにある、「.nuxt」ディレクトリのrouter.jsに設定が記述されています。routerOptionsの中に以下のような記述があると思います。 routes: [{ path: "/", component: _2c9cd992, name: "index" }],...