ウェブサイトはFlaskとNext.js（React）で開発することにした：バックエンドとフロントエンドの完全な分離をめざして…

私はウェブサイトを Flask で開発しています。このウェブサイトも Flask でつくられています。いろいろ考えた結果、フロントエンドは Next（React）にしていくと二日前に決めました。

理由はバックエンドとフロントエンドを明確に分けるため。また、TypeScript と CSS Modules のメリットを利用したいため。

これまで私は JavaScript のフレームワークやライブラリをできるだけ避けてきました。数年前に Angular や Express を勉強したときもありましたが、根っから Python が好きな私は、これらフロントエンドのフレームワークの文法に抵抗がありました。

以下、私の浅い知識が続きます。React を勉強して三日しか経っていないため、一部の内容に誤りがあるかもしれません。

Next.js を採用した理由

JavaScript のフレームワークとして React の他に Angular や Vue があります。しかし React はこの二つに比べてシェアが大きく、採用する大企業の数が多い。

React の中から Next.js を選んだ理由は、やはり世界的なシェアが高いことと、Next.js がシンプルなルーティングと CSS Modules を最初から備えていること。また App Router という比較的新しい機能が今後の標準になっていくと勝手に解釈したことです。

App Router が採用する React のサーバーコンポーネント技術はバックエンドのテンプレート生成に似て、きわめて素朴です。

バックエンドとフロントエンドの完全な分離

他の開発者はすべてを React で構成するかもしれない。それが一般的かどうかはわからない。今のところ私は、サーバー内部で React と Flask を接続し、データベースからビューまでは Python、テンプレートとデザインは React が管理するようにしました。

さっそく MathPython を Flask と React で開発することに成功しました。Flask 単体のプロジェクトと比べて、全体がとてもスッキリしました。私にとって React はテンプレートを構成する道具であり、データベースにアクセスしてどうのこうのやってデータをはき出す道具では決してありません。

ブログのような簡単なウェブサイトでは、すべてを React で開発することもできると思います。しかし、例えば複数のデータベースからさまざまなデータを拾い、数学的な処理を加えたり、機械学習を使ったりする場合は Python のほうが有利です。この意味でバックエンドとフロントエンドを分ける意義があります。

個人的には、大きなプロジェクトをバックエンドとフロントエンドに分離したことで、精神的な負担がかなり減りました。プロジェクトのソースコードが減ると気分がいい。全体のコード量が減ることでなく、開いているプロジェクト画面のソースコードが減ることに意味があります。

つまるところ、プログラマーの精神衛生は開発環境に依存する。ソースコードが減ること以上にすばらしいと思える環境変化はこの世にありません。