Nuxt.jsで静的サイトを作ってみる 〜プロジェクトの起動〜

はじめに

いままでWordpress,HTML,CSSはいじったことがあるのですが、ちゃんとJavascriptなどを使ってサイトを作ったりしたことないと思って今回Nuxt.jsを触ってみることにしました

必要なもの

• Node.js
• npx

Node.jsはここからダウンロードしましょう
https://nodejs.org/ja/

Node.jsが入っていればデフォルトでnpxが入っているか確認しましょう

$ npx -v

雛形ファイルのインストール

$ npx create-nuxt-app <project-name>

すると7個ほど質問を受けます

1. サーバーサイドのフレームワークを選択します:
   • None (Nuxt default server)
   • Express
   • Koa
   • Hapi
   • Feathers
   • Micro
   • Adonis (WIP)
2. 好きな UI フレームワークを選択します:
   • None（後からでも追加できます）
   • Bootstrap
   • Vuetify
   • Bulma
   • Tailwind
   • Element UI
   • Ant Design Vue Buefy
3. 好きなテスティングフレームワークを選択します:
   • None (後からでも追加できます）
   • Jest
   • AVA
4. Nuxtのモードを選択します。(Universal または SPA)
5. HTTP リクエストを簡単に行うために axios module を追加します。
6. 保存時にコードをチェックするために EsLint を追加します。
7. 保存時にコードを整形するために Prettier を追加します。

ローカルサーバーの起動

$ npm run dev

するとブラウザ上で
　
http://localhost:3000
が起動します。

参考サイト

https://ja.nuxtjs.org/guide/installation/
色々やった結果　公式が一番しっくり来る気がしました。