Next.js + TypeScript + TailwindCSS で作られたフロントエンドです。
開発用の Dockerfile（Dockerfile.dev）を用意しており、Node.js 20 ベースのイメージで依存関係をイメージビルド時にインストールします。M1/M2（arm64）環境でも公式 Node イメージを使うため動作しやすく、コンテナを通してローカルと同一の開発環境を再現できます。コンテナは外部からアクセス可能にするために 0.0.0.0:3000 で起動します。
- Next.js
- TypeScript
- TailwindCSS
- Node.js 20 (公式 Node イメージ / Debian ベース)
- Docker（開発用:
Dockerfile.dev）
注: Dockerfile.dev は依存をイメージビルド時にインストールするため、基本的にはコンテナ内で追加の npm install を実行する必要はありません。ただし、ホストのソースをコンテナにボリュームマウントするとホスト側のファイルがコンテナ内のファイルを上書きするため、マウント時は node_modules の扱いに注意してください。
- リポジトリをクローン
git clone git@github.com:tamadalab/kyosan-eats-frontend.git- ディレクトリを移動
cd kyosan-eats-frontend- Docker イメージを build(最初の一回だけ)
docker build -t nextjs-frontend -f Dockerfile.dev .- Docker のコンテナの立ち上げ(マウントして起動)
docker run -it -p 3000:3000 -v $(pwd):/app --workdir /app --name kyosan-eats-frontend nextjs-frontend- (補足)マウント時に node_modules が無い/上書きされたらコンテナに入って npm install
docker exec -it kyosan-eats-frontend bash
npm install- (補足)コンテナから出る方法
exit- ブラウザで開く URL
http://localhost:3000公開先URL：https://kyosan-eats-frontend.vercel.app/- リモートへのアップロード方法
git add .
git commit -m "メッセージ"
git push- ローカルにあるブランチ確認(*現在の作業ブランチ)
git branch- リモート追跡ブランチ一覧
git branch -r- ブランチを移動
git checkout [ブランチ名]- ブランチを作成し、移動 + ローカルブランチをリモートに反映
ローカルとリモートを同じにしたいので、同じ名前でリモートにも登録してください
git checkout -b [ブランチ名]
git push -u origin [ブランチ名]