フロントエンド開発といえば。
react アプリの初期化( npm init vite@latest <アプリ名> )

Next.js を nginx にデプロイする

● Next.js を nginx にデプロイする

・Next.js を使用できるようにする

1. Next.js の準備

npm run build
npm run start

2. Nginxの設定

  location / {
    try_files $uri $uri/ /index.php?$args;
  }

    ↓ / と /_next/ 以下を表示できるようにします。

# Next.js
location ^~ /_next/ {
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_pass http://localhost:3000/_next/;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_next_upstream error timeout http_502 http_503 http_504;
}

# Next.js
location / {
    proxy_pass http://localhost:3000;
}

3. Nginxのリスタート

nginx -s reload

以上でokです

Next.js とphpを使用できるようにするには

Next.js とphpを使用できるように下記の仕様とします

「/php/<ファイル名>でアクセスした場合」→  /home/YOUR/SERVER/PATH/DocumentRoot/php/<ファイル名>を返す
「/でアクセスした場合」→  next.jsを返す  
	location /php/ {
	    alias  /home/YOUR/SERVER/PATH/DocumentRoot/php/;
	    index  index.html index.htm;
	}

	location / {
      	# Next.js Server
      	proxy_pass http://localhost:3000;
	}
No.2086
10/31 14:01

edit