我是react的新手，我想开始一个我自己的hello world的小例子。
大多数教程都提供类似这样的内容：
app.js
var React = require('react');
var ReactDOM = require('react-dom');
var reactElement = React.createElement('h1', { className: 'header' },
'This is React');
ReactDOM.render(reactElement, document.getElementById('react-
application'));index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge, chrome=1" />
<title>Snapterest</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/
bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
<div id="react-application">
I am about to learn the essentials of React.js.
</div>
<script src="./app.js"></script>
</body>
</html>问题是，* 那个 * 示例需要nodeJS（用于require（）部分）和npm安装和npm启动..所有这些。
没有nodeJS，我可以做不同的事情
app.js
var reactElement = React.createElement('h1', { className: 'header' },
'This is React');
ReactDOM.render(reactElement, document.getElementById('react-application'));index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge, chrome=1" />
<title>Snapterest</title>
<script src=" /react-0.14.8.min.js"></script>
<script src=" /react-dom-0.14.8.min.js"></script>
</head>
<body>
<div id="react-application">
dsf
</div>
<script src="./app.js"></script>
</body>
</html>在这个例子中，我使用cdn来导入react的依赖项，nodejs应该在npm安装阶段导入。问题是-哪个更好？我可以只使用cdn而不完全使用nodejs吗？使用nodejs和npm模块（或bower..）来拥有react的东西是否更正确？
谢谢
4条答案
按热度按时间nxagd54h1#
对于标题中提出的问题，答案是否，在客户端使用React不需要node.js。
实际上，您给予的第二个示例就是这样做的-在客户端使用React，而没有提到node.js。
也就是说，在构建基于React的应用程序时，有几种不同的方法可以使用node.js。
使用browserify或webpack等基于node.js的构建工具将客户端代码打包成一个整洁的包，然后提供给客户端。
例如，在我正在进行的一个项目中，我使用browserify构建了一个保存在
public/js/bundle.js中的单个Javascript文件，该文件通过一个普通的旧<script>标记包含在我的index.html中，并且全部由Apache提供。（包括一些React组件）沿着应用程序代码的所有依赖项（包括react和react-dom，对客户端的主要好处是减少了对页面的请求数量和所需的带宽（因为我可以使用UglifyJS来缩小整个捆绑包）。对开发人员来说，主要的好处是您可以使用Babel等工具来编写.jsx代码，而不是普通的旧Javascript -这是对生产力的巨大提升。在node.js中写入HTTP服务器
最近几年，关于使用node.js构建整个应用的讨论非常热烈-客户端和服务器端，主要的好处是代码重用：假设您编写了一个函数库来处理日期，如果您用Javascript编写客户端代码，用PHP编写服务器端代码，那么您必须重写该函数库;如果您在两端都使用node.js，则只需执行一次。
在node.js中编写HTTP服务器并将其与React应用程序集成
使用React编写的单页应用程序（SPA）存在一个问题：在客户端接收并执行Javascript代码之前，页面不会被呈现。这意味着不执行Javascript的客户端将看不到任何东西--例如Google的网络爬虫。因此，如果您希望您的页面被索引，当客户端发出请求时，您需要找出某种方法来提供完全呈现的页面，解决方案是服务器端React呈现。这是一个很有挑战性的主题，如果你感兴趣的话，我鼓励你去谷歌一下。
关于你的问题：**哪个更好？**一如既往，这取决于您的需要。
我的一个项目是一个遗留的PHP应用程序，我正在重写一些前端代码以使用React组件。我需要node.js HTTP服务器还是服务器端呈现？不，一点也不需要。但我正在使用Babel和Browserify，以使我作为一个开发人员的生活更轻松。
我的另一个个人项目是一个小型SPA，它使用了一个叫做Next.js的框架，这个框架非常前沿，结合了服务器端渲染。我当然可以使用其他技术来编写这个项目，但是我确实喜欢它提供的客户机和服务器之间的共享代码库。
bqf10yzr2#
我认为目前公认的答案缺少了一些关键信息，答案是正确的--不需要Node.js--但你会遇到它经常被使用的第一个原因是人们在编写React时更喜欢使用JSX。
JSX不能在浏览器中那样工作。你可以使用babel-standalone来帮助浏览器科普JSX，但是这意味着你的JSX代码将在每次页面加载时被重新编译，这是不高效的。更高效的是在构建网站的同时在服务器端编译JSX。大多数这样的工具是基于节点的，所以这是Node.js经常被使用的原因之一。
当然，还有其他原因，JSX只是第一批原因之一。Node.js还附带了大量与javascript生态系统相关的工具。这些工具也可以在Java系统上使用，但总是有点笨拙。在实践中，你会遇到不同的库和其他资源，使用说明往往主要针对Node生态系统。而将其它的更多地留给用户。
kgqe7b3p3#
React js是一个客户端库，如果你用纯Js（没有jsx等）编写整个代码，你就不需要node.js。
但是对于代码管理，react应用程序被分割或结构化为多个文件，这需要node.js模块或lib处理来编译、合并、打包和生成最终的客户端js脚本，该脚本可以在浏览器上运行。
g6ll5ycj4#
下面是您的Hello World html文件：