エンジニアのはしがき

プログラミングの日々の知見を書き連ねているブログです

ポートフォリオサイトをNext.jsからReact.jsに置き換えました

最近ずっと放置していたポートフォリオサイトをアプデしました。

My Portfolio

元々はNext.jsで構成していたのですが、今回React.jsに置き換えをしました。

何で置き換えたの?

ビルド、デプロイはGitHub Actionsで実行されるようにしていたのですが、その際に使っていたserverless-next.jsが謎のエラーで動作しなくなった為です。

以前からNext.jsのバージョンを上げたりすることですぐエラーを吐く状況ではあり、かなり動作が不安定でした。 自前でNext.jsのデプロイ用の機構を用意するのも1つの手ですが、SSRの為の対応が面倒かつポートフォリオサイトのためにそこまで労力をかけたくなかった為、思い切ってReact.jsに置き換えることにしました。

システム構成

以前の構成

https://portfolio.ts-soda.net/images/configuration_portfolio.png

図では省略していますが、GitHub Actions経由でserverless-next.jsを使いS3バケットとLambdaにデプロイするようにしていました。

今の構成

React.jsに置き換えたことでSSRではなくSPAになった為、Lambdaを置く必要がなくなりシンプルになりました。