如何使用ReactJS / NodeJS一起部署到Amazon Web Services(AWS)上?

我目前在一个项目下有ReactJS + NodeJS / ExpressJS + Webpack到EC2,amazon web services(AWS),并希望在一个项目中一次部署它。

有什么build议如何去做呢? 完成研究,我只看到了关于如何部署一个教程的教程,无论是ReactJS还是仅仅是NodeJS。 任何见解或潜在客户将不胜感激。

将接受/ upvote答案。 先谢谢你

您不要“部署”ReactJS,它只是一个静态文件或像应用程序中其他任何JS库一样的文件。 你也不要部署Webpack。 Webpack应该运行在开发者机器上(或者在CI / CD栈或者构build系统中)。

至于NodeJS部分只是使用Elastic Beanstalk。

我不承诺build立源代码控制。 我看到了很多,它可以让事情变得更容易,但也可以忘记重build,因为您必须手动完成,而且会增加大量的回购。

我认为构build应该作为部署过程的一部分来运行。 假设你正在使用git,你可以在远程的repo里添加脚本hooks/post-receive 。 当你推送到该远程,脚本将运行。 这是我做我的webpack构build的地方。

您可能想要查看https://github.com/git-deploy/git-deploy上下文,但我手动执行此操作。

在我的项目中,在部署机器上,执行git --init --bare /var/git/myproject.git然后在/var/git/hooks/post-receive添加脚本。 钩子将代码签出到/var/www/myproject ,运行构build,填充/var/www/myproject/build 。 然后删除旧的/var/www/myproject/public并将build重命名为public 。 并做了。

我来自更多的运营背景,并且会说如果您的目标包括尽可能地保持该网站,那么使用Packer来生成AMI和CloudFormation来构build应用程序负载均衡器 ( ELB的更新,更便宜的兄弟) AutoScalingGroup的前面,它使EC2实例保持运行。

我目前正在做一个大规模的项目,正是你所描述的。 首先,有很多不同的方法可以做到这一点,所以您真正需要的是一些通用的准则,如果您愿意的话,我们可以在做出一些初步决策时深入细节。 如果你已经有两个独立的步骤来部署和运行应用程序,但只是想结合这些,我肯定可以帮忙。 我只需要知道你目前正在build立/部署。 如果您刚刚开始构buildstream水线并需要从头开始设置stream程,请阅读:

首先你需要设置一些构build服务器来安装你的npm依赖,然后运行你的webpack构build。 很可能你会想要一个独立的webpackconfiguration,只是为你的构build服务器,这会给你一个生产或qa /临时环境优化生成。 这个configuration文件应该分割出你不会一直更新的供应商文件,用提取文本插件抽出单独的css文件,并使文件丑化。 如果您有一个同构的React应用程序,或者正在使用您的节点版本中不支持的es6function,那么您还需要为您的服务器代码构build一个webpackfunction。 这实际上与您实际编码应用程序时想要在本地计算机上进行的热重新构build完全不同。 如果您希望我们的webpackconfiguration文件适用于本地开发和我们的CI构build,我将很乐意展示一些示例。 您可能还需要一个build.sh或makefile来处理您的webpack构build的已编译的.js文件,但是这将取决于您稍后将介绍的部署。 您可以在本地运行您的生产版本,因为您的configuration恰到好处,并从这些文件启动应用程序,以testing它的所有工作。 此外,因为您可能希望能够自动化所有这些,所以您可能希望在构build应用程序之前运行testing和testing,运行eslint和mocha / jdom来运行我们的酶/期望规范,作为我们的构build。 一旦这一切都很好地工作,你很可能要build立一个生成服务器,可以自动运行你的版本。 我的团队正在使用Jenkins来完成这个工作,但是它是免费的(除了我们运行的ec2盒子)。 还有大量基于订阅的构build/持续集成服务器,比如Travis和CodeShip。 有很多关于这些不同产品的利弊的文章,以及如何设置它们。 底线是你需要一个构build服务器,可以从源代码pipe理下拉你的代码,安装npm deps,lint,testing和构build你的应用程序。 如果任何失败,它应该失败你的构build,如果你的构build成功,你会有一些存档,你会稍后部署到一个EC2实例。 在我们的商店中,我们使用build.sh文件来压缩我们的构build档案(基本上是一个包含节点服务器文件的文件夹,以及我们缩小的客户端文件,css文件以及运行该应用程序所需的任何字体或图像),并将其上传到我们部署的S3存储桶。 我们喜欢这个相当老派的方法,因为tarball永远不会改变,所以我们有超可靠的回滚。

你使用的构build档案将取决于你想如何部署。 我们有一个使用puppet的自定义部署系统,但是有很多产品可以做到这一点,比如弹性beanstalk,这将更容易设置。 您需要某种进程pipe理器来运行您的节点应用程序,因此除非您有开发人员团队希望构build自定义pipe道,否则使用AWS内置的function可能是最简单的入门方法。 像往常一样,有这么多的方法来做到这一点,但基本的原则是,你需要一些东西来下载你的构build档案,并运行/监督你的节点进程。 你也可能希望能够在飞行中(木偶,厨师等)创build和configurationec2盒子,甚至可以使用容器(Docker),它们可以将整个堆栈作为单个单元移动。 如果您需要扩展您的应用程序,使用自动化来创build和configuration服务器是至关重要的,但是对于较小的项目而言可能并不复杂。 这绝对是一个你可以简单地开始并在稍后增加复杂性的领域,只要你有长远的目标,并确保采取必要的步骤来为将来的复杂性做好准备。

所有这一切都可以让你远离杂草,所以最好find最简单的东西,在你开始的时候就能满足你的需求,然后随着现实生活的需要增加复杂性。 如果您提供一个关于您所从事的项目有多大和资金充足的情况,我将很乐意详细说明这些细节。 如果这是一个学习技术的小项目,那么如果你想要构build一个具有大量stream量和/或复杂function的应用程序,我会有非常不同的build议。

这可能会得到100个不同的答案,他们可能都是最好的想法。 首先,你提到react + nodejs – 记住这些解决了不同的任务。 React将会是前端,并通过静态文件提供。 Nodejs更专注于服务器端,并将成为服务数据的代码。 他们可以轻松地一起工作。 您可以使用Web服务器(nodejs)的Express来提供HTML / React页面。

不幸的是,我看到你提到了webpack,所以你将不得不通过webpack,gulp,grunt等来构build你的应用程序。这就是源代码控制和构build服务器的好处 – 但是如果你新的,它可能比你需要更复杂。

如果你只有基本的EC2图像作为web服务器,只有1-2,那么最大的障碍就是推高你的代码。 像https://deploybot.com/可以工作,因为它可以推动你的git回购下载到多个主机通过FTP等。如果你想有点fancier,你可以看看像jenkins或其他项目。

Docker是一个不错的select,如果你要处理多个开发人员,服务器环境和部署 – 这是值得的。 否则,保持简单,只需在EC2实例上获取代码;)。