Next.jsでウェブサイトを作成したら、Vercelにアップしたいです。
手順はわかりやすいのですが、忘れてしまう可能性大なのでここに残しておきます。
Vercelにアップする手順
Next.jsで作ったサイトをVercelで公開する手順は以下となります。
- github にリポジトリをつくる
- リポジトリのコマンドをコピーする
- コマンドプロンプトにペーストして実行する
- Vercel に newProject を作成
- Github のリポジトリをインポートする
前提として、GitHubとVercelのサインアップは必要です。
github にリポジトリをつくる
このリポジトリは「private」にしました。
コマンドをコピーする
リポジトリを作成した際の画面の下部に「...or push an existing repository from the command line」とあるので、そのコマンドラインをコピーします。
コマンドプロンプトで実行する
コピーしたコマンドプロンプトをVSCodeのターミナルにペーストして実行します。
pushされてNext.jsのデータがGitHubのレポジトリにアップされます。
Vercel に newProject を作成
vercel に newProject を作成します。
リポジトリをインポートする
VercelでGithubのリポジトリを選択して[import]ボタンを押すとインポートされます。
これでNext.jsで作ったサイトがVercelで公開されます。
※ サイトを更新した際にはVSCodeでコミット→プッシュすれば自動的にサイトが更新されます。
以下の動画がわかりやすいです。
以下のReact講座#1の最後の方にもあります。
