💡

NEXT.JS 環境構築

2024/03/28に公開

Next.js セットアップ方法

Docker構築

Dockerfile

FROM node:20.11.1

WORKDIR /var/www/next
  • nodeのバージョンは各自プロジェクトのバージョンを指定してください

docker-compose.yml

services:
    next:
        build:
            context: ./docker/next
            dockerfile: Dockerfile
        tty: true
        volumes:
            - ./src:/var/www/next
        environment:
            - WATCHPACK_POLLING=true
        ports:
            - "3000:3000"

下記のコマンドを実行することでコンテナ内に入る

docker-compose.yml exec next bash

プロジェクトを作成

npx create-next-app . --typescript

テスト

Jest

公式ドキュメント : https://nextjs.org/docs/app/building-your-application/testing/jest

npm install --save-dev jest jest-environment-jsdom @testing-library/react @testing-library/jest-dom
npm i ts-jest
npm i @types/jest

おすすめライブラリ

今後記載していく

ディレクトリ構成

今後記載していく

SEO対策

構造化データ

今後記載していく

パンくずリスト

今後記載していく

サイトマップ

今後記載していく

メタデータ・OGP

今後記載していく

Discussion