@comoの技術ブログ

概要

create-next-app コマンドで作成した Next.js のプロジェクトを Now で公開します。

Next.jsとは


https://nextjs.org/
ZEIT社が開発・公開している、ReactでSSRを実装するためのフレームワークです。

Nowとは


https://zeit.co/now
同じくZEIT社が開発・公開しているホスティングサービスです。

Zero Configurationを謳っており、設定ファイルも何も作ることなくサイトの公開が可能です。
(2019/07/08に公開された v9 以前はnow.jsonというファイルのみ必要)

事前準備

必要なコマンドのインストール

$ npm install -g create-next-app  
$ npm install -g now  

nowコマンドとcreate-next-appコマンドで command not found と怒られる場合はシェルを再起動してください。

Nowへのサインアップ&ログイン

サインアップとログインも以下のコマンドから出来てしまいます。

$ now login  

メールアドレスを入力し、届いたメールから認証を行います。
認証が完了すると ~/.now に認証ファイルが生成され、以後Nowへのデプロイが可能になります。

プロジェクト作成 & 公開

example-project というプロジェクトを作成して、それを公開します。
作業ディレクトリで以下のコマンドを叩けば終わりです。なんてシンプル。

$ create-next-app example-project; now $_  

手元の環境では、プロジェクト作成から公開までなんと57秒。1分以内。すごすぎる。
作成したプロジェクトは https://(プロジェクト名)-(ランダム文字列).now.sh というURLで公開されます。
デプロイごとに異なるURLが発行されますが、それらに共通するエイリアスも自動で設定されます。詳しくは公式のこちらをどうぞ。

補足

シンプルな一行でプロジェクト作成から公開まで出来ることを書きたかったので、now コマンドに、直前のコマンドの引数を参照できる $_ を渡しています。

プロジェクトディレクトリ内(本稿なら example-project 内)であれば、以下のコマンドでデプロイが完了します。わぁ簡単。

$ now  

また、nodeのバージョンが8.11以前だと以下のエラーが出るので注意してください。
now is giving an error using Mojave and Node 8 LTS

モチベが上がって突発的に何かを作ろうとしたとき、環境構築でゲンナリすることなくとりあえずの公開までスムーズに進められるのはとてもありがたいですね。

この記事へのコメント

まだコメントはありません