Create a Next.js App | Learn Next.js
package.jsonファイルのscriptsセクションに下記を追加しておきます。
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"export": "next export"
},
npm run build && npm run export を実行して outフォルダに結果が出力されるのを確認します。
次にFirebase CLIを初期化します。
firebase login
firebase init
カーソルキーで「Hosting」を選択してスペースキーを押し、Enterで確定です。
Firebaseの管理画面でまだ「プロジェクト」を作成していない場合は、プロジェクトIDと名称を入力して新規作成します。既に使われているIDを入れてしまうとエラーになるので、ユニークなIDを入力しましょう。
アップロード対象のフォルダを聞かれるので、デフォルトの「public」ではなく「out」を指定します。
firebase deploy を実行して、「Deploy complete!」と表示されれば完了です!
慣れれば3分もかからずに出来てしまいますね。
バックエンド処理にCloud Functionsを使ったりするような場合も、下のドキュメントの通り設定すれば決して難しくはありません。
本当に便利な世の中になったものです。^^)
あ、特にFirebase Hostingでなくても良いのであれば、もちろんNext.jsの開発元であるVercel(旧Zeit)社のサービスを使うのが一番簡単でオススメです。
こちらであれば、静的サイトでなくSSRありのサイトであっても、またバックエンドのAPIが必要な場合でも、何も考えずにデプロイしてしまえばあとはサービス側で上手くやってくれるみたいなので、こちらも素晴らしいと思います。