Node.jsの雛形の作り方

Next.jsの雛形の作り方

Node.jsで基本的な操作である雛形の作成を忘れないように残しておく。

Next.jsの雛形とは(完成品）

雛形とはこのようになっている
この雛形をいじっていくことによって、作りたい形に変化させていく。

雛形のフォルダの作り方

• 事前準備として、node.jsのインストールとnpxとyarnのパッケージをインストールしておく必要がある。
• 雛形のフォルダを下のコマンドを入力して自動作成する。

$ npx create -next -app [フォルダ名]

このようなフォルダが作成される。
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

• 作成後フォルダの中に入り、実行する

$ cd [フォルダ名]
$ npm run dev

• 実行後、ローカルで雛形の様子を確認できる。
  • Google検索など検索エンジンで、localhost:3000と検索すると立ち上がる。
    

まとめ

以上がNext.jsの雛形作成のフローである。
非常に簡単で、いじっていくのが楽しい。