Next.js で開発して now で deploy するまでのメモ書き

stacks

Next.js

getStaticProps が使えない(2020/01/11)

ので、代わりに unstable_getStaticProps にする必要がある

(ちなみに、Component に key を生やす形ではなく、export function unstable_getStaticProps にしないと動かなかった。。。)

getStaticProps and node apis | spectrum.chat

now

package.jsonengines.node には特定の version を書かかない

書いてしまうと deploy した時に怒られるっぽいので fuzzy にしましょう

Node.js Version | zeit.co

環境変数 & secret

build time と run time 用でそれぞれ用意されている

  • run time
    • now.jsonenv key に追加
    • -e オプションでコマンド実行時にインラインで追加
  • build time
    • now.jsonbuild.env key に追加
    • -b オプションでコマンド実行時にインラインで追加

秘匿情報系を保存するための Now Secrets が存在する

$ now secrets add <secret-name> <secret-value>

local dev mode ではセキュリティの観点から参照できないので注意(代わりに .env を使うこととのこと)

Now Secrets を 環境変数へ expose するには @ prefix で始めると自動で参照してくれるそう

$ now secrets add mysqpl_admin_password {hogehoge}

$ now -e MYSQL_ADMIN_PASSWORD=@mysqpl_admin_password

みたいな感じ

commands

dev

Start a local development server

とのことで、local に now 環境っぽいのを立ててくれるっぽい

Now Secret は security の問題で local dev mode だと機能しないので、代わりに .env を使うべしとのこと。

(remote deploy 時に .env|.env.build を deploy しないように .gitignore.nowignore には指定しておいた方がいいかも)

Integrations

git 系統

github とかのサービスに integration があって、PR 作ったりするとそれ用の preview 環境を自動で作ってくれたりする

あと master marge されると production 環境用の domain に deploy される

master merge && master push の個人開発ではあまり意味はないが

おすすめ

Lighthouse

deploy ごとにスコア自動で測ってくれるので楽。Beta 版

その他の教訓

publicsrc の下に格納してはならない

Next.js と now の相性というか、now 上での Next.js の root dir の指定がうまくできないっぽくて、ちょっとハマった。

zeit で domain も購入できる。zeit 信者はここで買うべし。

信者なのでもちろんここで買った lidqqq.dev

ドメイン、3 文字と 4 文字では値段にとんでもないくらい差があるので、domain と 自分の id を紐付けさせて、かつ短くて安いのを取りたいというために、自分の id を 4 文字に固定するというムーブもこの世の中には存在していたわけだ。(金を払えば問題無いわけだが)

Domains - ZEIT

かんそう

Next.js は相変わらず最高の開発体験をさせてくれる最高のフレームワークということを再認識した。

いつの間にか module/nomodule pattern まで組み込まれていたし、このまま私の第二宗派である rollup に bundler が変わって欲しい。もしくは選択式にさせて欲しい svelte みたいに。

新規 API が追加されそうな Data fetching 周りの最適化にも目が離せないし、RFC をみていてもこれからの成長に期待しかないし、Chrome チームも contribute していくらしいし、未来が明るい FW の一つだと思う。

個人的にはそろそろ production ready かなって思うレベルまできてる。

now は version 1 と 2 で破壊的な変更がなされているので、昔触ったことがある人はかなり混乱すると思う。(昔は Docker が扱えていい時代だった。。。)

now については機能的に拡張されているかと言われると、そうでもないけど、web のコンソール画面が使いやすくなっていていい感じだった。

あと integration の開発が活発(?)なのもいい感じ。

zeit は serverless の向こう側である、backendless という過激な conference を開いていたりしていて、platform でも仕掛けてきていて面白いなと思う。当然のことながら、信者である私も backendless の未来を盲信している。