如何使Django和ReactJS一起工作? [英] How to get Django and ReactJS to work together?

查看:125
本文介绍了如何使Django和ReactJS一起工作?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Django的新手,甚至是ReactJS的新手。我一直在研究AngularJS和ReactJS,但是决定使用ReactJS。尽管AngularJS拥有更多的市场份额,但它似乎正在逐步超越AngularJS的知名度,并且据说ReactJS更快地被接受。

New to Django and even newer to ReactJS. I have been looking into AngularJS and ReactJS, but decided on ReactJS. It seemed like it was edging out AngularJS as far as popularity despite AngularJS having more of a market share, and ReactJS is said to be quicker to pickup.

除了所有的垃圾,我开始学习Udemy的课程,看了几段视频之后,了解它与Django的集成程度似乎很重要。那就是当我不可避免地碰壁只是要启动并运行时,那里准备了什么样的文档,以使我几个小时和几个晚上都不会转动轮子。

All that junk aside, I started taking a course on Udemy and after a few videos it seemed important to see how well it integrates with Django. That is when I inevitably hit a wall just getting it up and running, what kind of documentation is out there so that I am not spinning my wheels for several hours and nights.

我遇到的确没有任何全面的教程或 pip 软件包。我碰到的几个没有用或已过时,例如 pyreact

There really isn't any comprehensive tutorials, or pip packages, I came across. The few I came across didn't work or were dated, pyreact for example.

一个想法是我只是将ReactJS完全分开,但是考虑到要让ReactJS组件呈现的类和ID。在单独的ReactJS组件之后编译成单个ES5文件,只需将该单个文件导入Django模板即可。

One thought I had was just to treat ReactJS completely separate, but keeping into consideration the classes and IDs I want the ReactJS components to render in. After the separate ReactJS components are compiled into a single ES5 file, just import that single file into the Django template.

我认为从Django模型进行渲染时,这会很快崩溃,尽管Django Rest Framework听起来很复杂。

I think that will quickly breakdown when I get to rendering from Django models although the Django Rest Framework sounds like it is involved. Not even far enough to see how Redux affects all of this.

无论如何,任何人都有明确的方式使用他们愿意共享的Django和ReactJS吗?

Anyway, anyone have a clear way they are using Django and ReactJS they care to share?

无论如何,该文档和教程对于AngularJS和Django来说是很多的,因此很容易采取这种方法来开始使用任何前端框架。原因。

At any rate, the documentation and tutorials are plentiful for AngularJS and Django, so it is tempting to just go that route to get started with any front-end framework... Not the best reason.

推荐答案

我没有使用Django的经验,但是从前端到后端和前端的概念框架与框架相同。

I don't have experience with Django but the concepts from front-end to back-end and front-end framework to framework are the same.


  1. 反应会消耗您的 Django REST API 。前端和后端之间没有任何连接。 React将向您的REST API发出HTTP请求,以获取和设置数据。

  2. React,借助 Webpack(模块捆绑器)& Babel(翻译器),将捆绑您的Javascript并将其翻译成单个或多个文件,这些文件将放置在入口HTML页面中。 了解Webpack,Babel,Javascript以及React和Redux(状态容器)。我相信您不会使用Django模板,而是允许React呈现前端。

  3. 呈现此页面时,React将使用该API来获取数据,以便React可以呈现它。在这里,您对 HTTP请求,Javascript(ES6),Promises,中间件和React 的理解至关重要。

  1. React will consume your Django REST API. Front-ends and back-ends aren't connected in any way. React will make HTTP requests to your REST API in order to fetch and set data.
  2. React, with the help of Webpack (module bundler) & Babel (transpiler), will bundle and transpile your Javascript into single or multiple files that will be placed in the entry HTML page. Learn Webpack, Babel, Javascript and React and Redux (a state container). I believe you won't use Django templating but instead allow React to render the front-end.
  3. As this page is rendered, React will consume the API to fetch data so React can render it. Your understanding of HTTP requests, Javascript (ES6), Promises, Middleware and React is essential here.

以下是我在网络上发现的以下内容(应基于Google的快速搜索结果):应该

Here are a few things I've found on the web that should help (based on a quick Google search):

  • Django and React API Youtube tutorial
  • Setting up Django with React (replaced broken link with archive.org link)
  • Search for other resources using the bolded terms above. Try "Django React Webpack" first.

希望这可以引导您朝正确的方向前进!祝好运!希望其他专门研究Django的人可以加入我的回复。

Hope this steers you in the right direction! Good luck! Hopefully others who specialize in Django can add to my response.

这篇关于如何使Django和ReactJS一起工作?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆