服务器 准备工具 依次安装即可
nginx
   安装nginx https://www.runoob.com/linux/nginx-install-setup.html
配置全局nginx命令 https://www.cnblogs.com/NTWang/p/13066602.html
 git
yum -y install git
nvm node版本管理工具
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
    source ~/.bashrc // 使当前shell读入路径为filepath的shell文件并依次执行文件中的所有语句,通常用于重新执行刚修改的初始化文件,使之立即生效,而不必注销并重新登录

node 下载安装node
   nvm i stable 
// 最新稳定版
   使用nvm安装node之后,直接运行node命令会报错 node: command not found?


forever node的守护进程
 
npm i forever -g // https://www.cnblogs.com/pxjbk/archive/2018/12/24/10169830.html   forever list 正在守护的项目
   forever stop 项目目录  停止守护
   forever start 项目目录 开启守护
 
部署web
npm build 打包项目, 注意:需要再package.json中加入 "homepage": "react_demo"
服务器:

cd /var/www 切换到www下
mkdir react_demo 创建项目目录
打开dos窗口 将本地打包文件 上传到服务器
scp -r C://Users/W10003705/Desktop/其他文件/demo/create_react_app/build/* root@xxx.xxx.xxx.xxx:/var/www/react_demo
配置nginx
打开nginx配置文件编辑:vim /usr/local/webserver/nginx/conf/nginx.conf
下面内容复制放在server里面 ps:可以配置多个站点
# react_demo
location /react_demo {
root /var/www;
index index.html index.htm;
}
运行 服务器地址+react_demo 比如:xxx.xxx.xxx.xxx/react_demo     正常打开说明web部署完成并且成功。      
    果出现页面报404 ,则需要检查nginx配置 ,文件路径
如果是加载资源404,去需要看下资源加载路径,看看hoempage的配置和nginx是否对应

部署nodejs
服务器:
cd /var/www
mkdir react_demo_server
找到之前创建的server 不需要上传 node_modules 太大了
  dos :scp -r C://Users/W10003705/Desktop/其他文件/demo/create_react_app/server/* root@149.129.104.166:/var/www/react_demo_server
     服务器:
        1. cd /var/www/react_demo_server // 切换到server文件夹
        2. npm i // 下载依赖
        3. node server.js // 运行
    我的配置的是4000端口,需要在阿里云控制台添加安全组规则     在测试页 点击测试 查看控制台看到返回结果则前后端部署完成
  
  最后使用forever 来守护node进程(如果我们直接用node去运行,当关闭服务器远程链接时,ndoe服务也会关闭)
  forever start /var/www/react_demo_server/server.js
  

小白从零开始阿里云部署react项目+node服务接口(一:阿里云服务器)

小白从零开始阿里云部署react项目+node服务接口(二:node服务+web)

小白从零开始阿里云部署react项目+node服务接口(三:部署到服务器)的更多相关文章

  1. 小白从零开始阿里云部署react项目+node服务接口(二:node服务+web)

    我们用极简的方式来创建服务,没有任何附加功能 1 新建一个server文件夹 2 使用npm init 或者yarn init  一路enter 3  yarn add  express cors  ...

  2. 小白从零开始阿里云部署react项目+node服务接口(一:阿里云服务器)

    准备阿里云服务器,并安装系统 如果没用自己服务器可以购买一个 https://www.aliyun.com/minisite/goods?userCode=x7i5glgc 初级购买一个1核2G的主机 ...

  3. 【简书】在阿里云自带的CentOS + LAMP环境下部署一个Laravel项目

    在阿里云自带的CentOS + LAMP环境下部署一个Laravel项目 作者 DonnieZero 关注 2017.07.29 22:02* 字数 2218 阅读 5556评论 3喜欢 1赞赏 1 ...

  4. 构建基于阿里云OSS文件上传服务

    转载请注明来源:http://blog.csdn.net/loongshawn/article/details/50710132 <构建基于阿里云OSS文件上传服务> <构建基于OS ...

  5. 云计算之路-阿里云上:针对 docker swarm 故障的部署调整以及应急措施

    针对这周 docker swarm 集群的频繁故障(详见故障一 .故障二.故障三),我们今天对 docker swarm 集群的部署进行了如下调整. 将 docker engine 由  “17.12 ...

  6. 小白用阿里云搭载wordpress个人博客

    阿里云服务已经购买多时,却一直没时间部署内容,借着这次机会自己照着博客园园友的方式用wordpress搭建了个人博客! 创建wordpress的内容就不多说了,直接附链接来源:https://www. ...

  7. 从零开始使用 webpack5 搭建 react 项目

    本文的示例项目源码可以点击 这里 获取 一.前言 webpack5 也已经发布一段时间了,其模块联邦.bundle 缓存等新特性值得在项目中进行使用.经过笔者在公司实际项目中的升级结果来看,其提升效果 ...

  8. 【阿里云产品公测】在ACE上部署WP测试体验

      ACE服务其实已经有很多类似的服务提供商了,无论收费的还是免费的,  但是到现在为止还没有体验过,正好借着这次机会,来体验一下阿里云的ACE服务. ' !2NSv   /IQ$[WR cx   B ...

  9. Windows版:Nginx部署React项目并访问Spring Boot后台数据

    一, 打包react项目 1,在工作空间目录下create-react-app test-arrange 创建项目test-arrange 2,在新建的项目中写好请求与页面 3,打包, 在项目目录下 ...

随机推荐

  1. ca78a_c++_字符串流在内存中的输入输出(速度快)

    /*ca78a_c++_字符串流在内存中的输入输出**字符串流:在内存中的输入输出.(在内存中进行,速度快)**文件流 :是对文件进行输入和输出.(在磁盘里面进行)istringstream(输入), ...

  2. Mybatis框架介绍

    MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation 迁移到了google code,并且改名为MyBatis.201 ...

  3. PHP丨PHP基础知识之流程控制WHILE循环「理论篇」

    昨天讲完FOR循环今天来讲讲他的兄弟WHILE循环!进入正题: while是计算机的一种基本循环模式.当满足条件时进入循环,进入循环后,当条件不满足时,跳出循环.while语句的一般表达式为:whil ...

  4. Python3-socketserver模块-网络服务器框架

    Python3中的socketserver模块简化了编写网络服务器的任务 在实际的开发中,特别是多并发的情况下,socket模块显然对我们的用处不大,因为如果你要通过socket模块来实现并发的soc ...

  5. Python学习笔记——基础语法篇

    一.Python初识(IDE环境及基本语法,Spyder快捷方式) Python是一种解释型.面向对象.动态数据类型的高级程序设计语言,没有编译过程,可移植,可嵌入,可扩展. IDE 1.检查Pyth ...

  6. 深度学习“四大名著”发布!Python、TensorFlow、机器学习、深度学习四件套!

    Python 程序员深度学习的"四大名著": 这四本书着实很不错!我们都知道现在机器学习.深度学习的资料太多了,面对海量资源,往往陷入到"无从下手"的困惑出境. ...

  7. 手写内网穿透服务端客户端(NAT穿透)原理及实现

    Hello,I'm Shendi. 这天心血来潮,决定做一个内网穿透的软件. 用过花生壳等软件的就知道内网穿透是个啥,干嘛用的了. 我们如果有服务器(比如tomcat),实际上我们在电脑上开启了服务器 ...

  8. jupyter lab最强代码补全插件

    1 简介 提起kite相信不少朋友都有印象,它是一个功能非常强大的代码补全工具,目前可用于Python与javascript,为许多知名的编辑器譬如Vs Code.Pycharm提供对应的插件. 图1 ...

  9. 收藏python开发各种资源官方文档

    http://json.cn/ https://cn.bing.com/ https://processon.com/ https://docs.djangoproject.com/en/1.11/r ...

  10. Sharepoint 编辑WebPart时,WebPart属性为灰色不可用

    一般在客户端设置就是灰色的,解决方法就是,要在服务器上进行设置,就可以了.:)