javascript ReactJS 与 NodeJS - 为什么我需要同时创建两者？

ReactJS vs NodeJS - Why do I need to create both?

提问by McFloofenbork

I understand that React is frontend, and NodeJS is the backend that allows Javascript code to function outside of a browser. What I don't understand (and this is after following tutorials online on setting up a React project and a NodeJS project) is why I have to create an instance of each.

我知道 React 是前端，NodeJS 是后端，它允许 Javascript 代码在浏览器之外运行。我不明白（这是在在线学习如何设置 React 项目和 NodeJS 项目之后）是我必须为每个项目创建一个实例的原因。

For example, in my React project, I managed to create a website. But because I needed a backend, I decided to use NodeJS. But I'm doing NodeJS tutorials, and I can create a website using NodeJS too. I'm confused because right now, it's appearing to be that React and NodeJS do the SAME THING.

例如，在我的 React 项目中，我设法创建了一个网站。但是因为我需要一个后端，所以我决定使用 NodeJS。但是我在做 NodeJS 教程，我也可以使用 NodeJS 创建一个网站。我很困惑，因为现在，它的出现到是反应，做的NodeJS了同样的事情。

I have never worked with NodeJS before so I am a bit confused. I was under the impression that I would just use NodeJS to host the backend, but after seeing that I'm literally having to create an entire website with NodeJS, I don't understand how I'm supposed to use React and NodeJS together.

我以前从未使用过 NodeJS，所以我有点困惑。我的印象是我只会使用 NodeJS 来托管后端，但是在看到我实际上不得不使用 NodeJS 创建整个网站之后，我不明白我应该如何一起使用 React 和 NodeJS。

How do the two, React and NodeJS, integrate together to create a fully-functioning web app? I have yet to see something online that clearly breaks down how the two interact.

React 和 NodeJS 两者如何集成在一起以创建功能齐全的 Web 应用程序？我还没有在网上看到一些可以清楚地分解两者互动方式的东西。

回答by Muhammad Kamran

React is front-end library. It provides great tooling for creatiing user interfaces. And it creates a single page application. Which means when you open a react app. It does not reload and its really fast.

React 是前端库。它为创建用户界面提供了很好的工具。它创建了一个单页应用程序。这意味着当您打开 React 应用程序时。它不会重新加载，而且速度非常快。

While you could also use nodejs and something like handlebars to create a website. But that website would be rendered on server and then served to the user. But its alot more than that. There are a lot of things that you want to do on the server. Like authentication. You want that part to be secure. So you keep it on the server.

虽然你也可以使用 nodejs 和像把手这样的东西来创建一个网站。但是该网站将在服务器上呈现，然后提供给用户。但它远不止于此。您想在服务器上做很多事情。比如身份验证。您希望该部分是安全的。所以你把它保存在服务器上。

Now the answer to the final part of your question.

现在回答你问题的最后一部分。

For a fully functional app. You would use react to create user interfaces. And nodejs for creating an API which your react app will call.

对于功能齐全的应用程序。您将使用 react 创建用户界面。和 nodejs 用于创建您的反应应用程序将调用的 API。

回答by filipe

NodeJS is just a runtime that allows you to run javascript code outside of the browser.

NodeJS 只是一个运行时，允许您在浏览器之外运行 javascript 代码。

React use nodeJS as a tool to compile and optimize the code.

React 使用 nodeJS 作为工具来编译和优化代码。

回答by Len Joseph

NodeJS is not just regular javascript, it is a javascript runtime that sits on top of a C++ engine called V8, provided by Google. Node executes outside the browser, whereas React / Vue / Angular / etc are in-browser javascript frameworks.

NodeJS 不仅仅是普通的 javascript，它还是一个 javascript 运行时，它位于由 Google 提供的名为 V8 的 C++ 引擎之上。Node 在浏览器之外执行，而 React / Vue / Angular / etc 是浏览器内的 javascript 框架。

React is a whole separate animal; it is a framework that renders its own DOM in the browser. It is a javascript engine that is configured to optimize DOM manipulation.

React 是一个完全独立的动物；它是一个在浏览器中呈现自己的 DOM 的框架。它是一个 javascript 引擎，配置为优化 DOM 操作。

While the development pattern of frontend and backend appear similar, they are doing different things. React is processing in-browser data and making API calls. Node is handling requests from the browser, making database calls, handling authentication, etc. Because of these different responsibilities, Node makes use of different modules than a frontend framework.

虽然前端和后端的开发模式看起来相似，但它们在做不同的事情。React 正在处理浏览器内的数据并进行 API 调用。Node 处理来自浏览器的请求、进行数据库调用、处理身份验证等。由于这些不同的职责，Node 使用不同的模块而不是前端框架。

Ultimately, Node and React communicate through HTTP calls, commonly with a package called Axios. There are others, but that one is very common at the moment.

最终，Node 和 React 通过 HTTP 调用进行通信，通常使用一个名为 Axios 的包。还有其他一些，但目前这种情况非常普遍。

It would behoove you to read about how node works under the hood.

您有必要阅读有关 node 在幕后如何工作的信息。

回答by Mitro

The point is that react and any other SPA library is working on a client-side (browser).

关键是 react 和任何其他 SPA 库都在客户端（浏览器）上运行。

React fetch and consume the data from the server API.

React 从服务器 API 获取和使用数据。

You don't need to use Node.js for building API. You can use various frameworks based on the technology you prefer.

您不需要使用 Node.js 来构建 API。您可以根据自己喜欢的技术使用各种框架。

If you are not familiar with the Back End, you can use https://www.npmjs.com/package/http-serverto have a fake API service and can build the Front End part with it.

如果您对后端不熟悉，可以使用https://www.npmjs.com/package/http-server来创建一个虚假的 API 服务，并可以使用它来构建前端部分。

回答by Nathan Yeung

NodeJS is a javascript framework that allows you to create a server to serve up websites using Express or the built in libraries. It also is capable of building a website with just NodeJS.

NodeJS 是一个 javascript 框架，它允许您创建一个服务器来使用 Express 或内置库为网站提供服务。它还能够仅使用 NodeJS 构建网站。

You can take advantage of the ability to do server side rendering with a NodeJS server. https://reactjs.org/docs/react-dom-server.html

您可以利用 NodeJS 服务器进行服务器端渲染的能力。 https://reactjs.org/docs/react-dom-server.html

There is a ReactJS framework called NextJS tha has server side rendering of ReactJS component. https://nextjs.org/#features

有一个名为 NextJS 的 ReactJS 框架，它具有 ReactJS 组件的服务器端渲染。 https://nextjs.org/#features

You could potentially have some areas of your website that are built solely with NodeJS and other pages that use ReactJS and a NodeJS backend. But it is cleaner to use ReactJS for the front-end and NodeJS for the backend.

您的网站的某些区域可能是完全使用 NodeJS 构建的，而其他页面则使用 ReactJS 和 NodeJS 后端。但是前端使用 ReactJS，后端使用 NodeJS 更简洁。

回答by Ajay Sihota

NodeJS will serve as your backend, whereas ReactJS will create the interface/UI where you can actually manipulate your server (nodeJS). So first you'll write your NodeJS server or API. You don't needto use ReactJS to create a frontend that would interact with your node server, like you said you can use NodeJS to create your views as well through a different library. ReactJS is just one choice of many for the front end of your NodeJS app.

NodeJS 将作为您的后端，而 ReactJS 将创建界面/UI，您可以在其中实际操作您的服务器（nodeJS）。所以首先你要编写你的 NodeJS 服务器或 API。您不需要使用 ReactJS 来创建与节点服务器交互的前端，就像您说的那样，您也可以使用 NodeJS 通过不同的库来创建视图。ReactJS 只是 NodeJS 应用程序前端的众多选择之一。