3,765
回編集
差分
→Reactアプリケーションのセットアップ
npm start
== 参考 ==
<nowiki>DjangoでReactアプリの静的ファイルを配信するには、以下の手順を実行します¹²³⁴⁵:
1. **Reactアプリのビルド**: Reactアプリをビルドして、静的ファイル（`bundle.js`、`styles.css`など）を生成します¹.
2. **静的ファイルの配置**: ビルドした静的ファイルをDjangoプロジェクト内の適切なディレクトリ（通常は`STATICFILES_DIRS`で指定したディレクトリ）に配置します¹.
3. **テンプレートの作成**: Djangoのテンプレート（通常は`index.html`）を作成し、その中で静的ファイルを読み込むように設定します¹. これにより、DjangoがReactアプリを読み込むことができます¹.
4. **静的ファイルの集約**: `python manage.py collectstatic`コマンドを実行して、すべての静的ファイルを`STATIC_ROOT`で設定したディレクトリに集めます³⁵.
5. **Webサーバーの設定**: Webサーバーを設定して、`STATIC_ROOT`に置かれたファイルを`STATIC_URL`から配信するようにします³⁴.
以上が基本的な手順ですが、具体的なコードや詳細な手順は参考資料¹²をご覧ください。また、開発環境や要件によって手順が異なる場合がありますのでご注意ください。
ソース: Bing との会話 2023/10/2
(1) Djangoの静的ファイルにReactを配置し、連携させる - Qiita. https://qiita.com/shota_mci/items/314c1f25d2c8dc47b4e4.
(2) 静的ファイル (画像、JavaScript、CSS など) を管理する | Django .... https://docs.djangoproject.com/ja//2.2/howto/static-files/.
(3) 静的ファイルのデプロイ | Django ドキュメント | Django. https://bing.com/search?q=Django%e3%81%a7React%e3%82%a2%e3%83%97%e3%83%aa%e3%81%ae%e9%9d%99%e7%9a%84%e3%83%95%e3%82%a1%e3%82%a4%e3%83%ab%e3%82%92%e9%85%8d%e4%bf%a1%e3%81%99%e3%82%8b%e6%96%b9%e6%b3%95.
(4) 静的ファイルのデプロイ | Django ドキュメント | Django. https://docs.djangoproject.com/ja//2.2/howto/static-files/deployment/.
(5) Djangoアプリのデプロイ時に静的ファイルを読み込むようにする方法. https://denno-sekai.com/django-collectstatic/.
(6) undefined. http://static.example.com/%29.
(7) undefined. http://media.example.com/%29.</nowiki>