1. ホーム
  2. django

[解決済み] DjangoとReactJSを連携させる方法とは?

2022-04-24 06:08:10

質問

Djangoは初めてで、ReactJSはさらに初めてです。AngularJSとReactJSを調べていましたが、ReactJSに決めました。AngularJSの方がシェアが大きいにもかかわらず、人気に関してはAngularJSを上回っているように思えましたし、ReactJSの方が早く手に入れられると言われているからです。

そんなガラクタはさておき、Udemyのコースを受講し始め、いくつかのビデオを見た後、Djangoとどれだけうまく統合できるかが重要だと思いました。その時、どうしても立ち上げるだけで壁にぶつかってしまうのですが、何時間も夜通しで空回りしないように、どんなドキュメントがあるのでしょうか。

包括的なチュートリアルや pip というパッケージがありました。私が見つけたいくつかのパッケージは、うまくいかなかったり、古かったりしました。 pyreact などです。

一つ考えたのは、ReactJSを完全に分離して扱い、ReactJSのコンポーネントにレンダリングさせたいクラスとIDを考慮することです。分離した ReactJS コンポーネントを 1 つの ES5 ファイルにコンパイルした後、その 1 つのファイルを Django テンプレートにインポートすればよいのです。

Django Rest Frameworkが関係しているようですが、Djangoモデルからのレンダリングになると、すぐに破綻すると思います。Redux がこのすべてにどのように影響するか見るにはまだ十分ではありません。

とにかく、どなたかDjangoとReactJSを使った明確な方法をお持ちの方は、教えてください。

とにかく、AngularJSやDjangoはドキュメントやチュートリアルが豊富なので、どんなフロントエンドフレームワークでもそのルートで始めたくなるのですが......。ベストな理由ではないですが。

どのように解決するのか?

Djangoの経験はありませんが、フロントエンドからバックエンドへ、フロントエンドのフレームワークからフレームワークへの考え方は同じです。

  1. Reactはあなたの Django REST API . フロントエンドとバックエンドは一切接続されていない。Reactはデータを取得・設定するために、REST APIにHTTPリクエストを行います。
  2. Reactは Webpack (モジュールバンドルラー) & Babel (トランスパイラー) は、Javascript をバンドルし、単一または複数のファイルにトランスパイルして、エントリーの HTML ページに配置します。 Webpack、Babel、Javascript、React、Redux(ステートコンテナ)を学ぶことができます。 . I 信じる は、Django のテンプレートを使わず、React にフロントエンドをレンダリングさせるでしょう。
  3. このページがレンダリングされるとき、Reactはデータを取得するためにAPIを消費するので、Reactはそれをレンダリングすることができます。あなたの理解では HTTPリクエスト、Javascript(ES6)、Promises、ミドルウェア、React は必須です。

以下は、私がウェブ上で見つけた べきである に役立ちます(Googleで検索した結果です)。

これが正しい方向へ導いてくれることを願っています。頑張ってください。Django を専門とする他の人が、私の回答に補足してくれるといいのですが。