react + backend(flask)のviteを使った環境構築備忘録

前提

以下の環境を想定しています。

npm -v : 9.8.0
node -v : v20.4.0
python3 --version : 3.12.2
create-vite@5.2.1

手順

2024年現在最新のviteを使ったコマンドは以下の通り

①まずルートのディレクトリを作る
②その下にbackendフォルダを作る
③ルートに戻って以下のコマンドを実行し、frontendフォルダを作る

npm create vite@latest frontend -- --template react

④fronendにcdし、npm installする。

大切なこと

• frontendとbackendを完全に切り離して開発できること。
• frontendとbackendの通信はhttpを通してだが、SOP(Same-Origin Policy)が引っかかるのでCORS を設定しないといけないこと。（flaskだったらflask-cors
• backendの言語はなんでもいいこと