我的项目部署到阿里云怎么就那么难？

hi,最近好喜欢《经济舱》里面的一句歌词 ：孩子别紧张，生活不是竞技场。

hi,双十一 i 护理 有打折，就是我写的一个全栈实战小项目而已啦~~副业之一，多多支持

咩，我大四第一学期有一节实训课，和编运方向的同学合作了一个项目，叫Cube自律空间。

第八周答辩的时候写了一个PPT

查看PPT：【毕设作品】Cube自律空间已完成三分之一

对于这两个月写的，其实对于我来说，收获也是很大的，我运用了我在实习中学到的一些东西。

虽然技术栈和 i护理 是一样的，这个项目可以用一句话来表达：麻雀虽小，五章俱全。

是一个小而全的小项目，我觉得对于新手来说，是适合拿去练手的，就像 i护理 一样。（疯狂暗示）

交了作业，我的青春就结束了。。

而最后答辩的时候，我也是把一些，比如个人职责，收获和体会，问题和不足，后期展望都写了。

个人职责

本人（组长）：
1.根据编运rp原型图进行开发，完成20多个页面的开发
2.完成计时，数据统计，编写/发布/查看行程计划三个核心功能
3.完成登录，注册，修改个人资料（上传头像，修改昵称，性别，个性签名等基本信息）等基础功能
4.设计数据库，设计登录注册logo图片，编写开发情况总结性PPT，录制开发情况视频

收获和体会

1.作为本次项目的开发者，本人采用vue-cli3脚手架搭建前端框架开发客户端，采用node(egg)搭建后端框架与阿里云数据库(mysql)进行连接，完成并实现了前后端分离的一个实战性小项目，基本的功能和核心的功能都具备。

2.在开发中，本人注重对代码的优化处理：
比如把一个可以共用的抽离出来封装成一个组件，在需要的地方对组件进行引用即可。

3.在开发中，对于一些样式较为一致的，使用了for循环进行渲染，避免了代码的冗余。

4.本次开发中，本人使用了SASS预处理器进行CSS的开发。
通过查阅资料，我们知道CSS书写代码规模较大的Web应用时，容易造成选择器、层叠的复杂度过高，因此推荐通过SASS预处理器进行CSS的开发，SASS提供的变量、嵌套、混合、继承等特性，让CSS的书写更加有趣与程式化。

5.对于路由的处理，我使用了懒加载，像vue这种单页面应用，如果没有应用懒加载，运用webpack打包后的文件将会异常的大，造成进入首页时，需要加载的内容过多，时间过长，会出现长时间的白屏，即使做了loading也是不利于用户体验，而运用懒加载则可以将页面进行划分，需要的时候加载页面，可以有效的分担首页所承担的加载压力。

6.对于与客户端搭配的elementUI和mintUI，如果是需要改变组件样式的话，需要加/deep/深度选择器。
通过查阅可以了解到，在vue组件中，在style设置为scoped的时候，里面在写样式对子组件是不生效的，如果想让某些样式对所以子组件都生效，可以使用 /deep/ 深度选择器。

7.对于客户端的适配问题，本人采用了flex+rem+%等布局和单位对移动端的适配问题进行了最大程度的优化。

问题和不足

1.本次完成了计时，统计数据，编辑/发布/查看行程计划三大核心功能，也实现了聊天界面中的JS交互，但是IM通讯功能没有实现，聊天的数据没有保存到数据库，因此刷新之后数据不会存在。

2.有两个地方的样式初次进去之后会有点小乱，但是刷新之后就正常。经过查阅之后，是需要在vue文件中，做样式分离：
将覆盖样式单独写在一个style标签内，原页面写在 scoped样式作用域下。但是这种方法并没有解决。
还有尝试了一种，就是在我们的入口文件main.js文件中，将css相关文件挪到较前的位置，让加载的时候优先加载样式，但是这种方法也没有解决问题。

3.本次虽然开发了二十多个界面，但是部分界面属于静态界面，没有写后端接口进行前后端的打通。

4.本次没有写视频，因为考虑到视频文件过大，存放等问题，所以没有写视频这个模块。

后期展望

经过毕设指导老师的同意，该项目具有可开发意义，所以该项目将作为毕设继续开发。

1.首页的建造城市（丢弃）和公益捐书

2.加入/参与自律计划活动，比如：早起打卡，每天背诵十个单词，每天做瑜伽十分钟等活动可以获得积分，按照要求在合理的时间上完成了任务，则积分翻倍增加。

3.在首页对接第三方接口，进行一些自律活动等进行推荐。

4.在首页显示一些好友的自律情况，好友可以设置是否公开显示自己的自律计划，选择否，则不会公开被他人所见。

5.可以将计时情况/数据统计等内容打卡或者分享给好友或者分享到朋友圈。

6.将自己的项目部署到自己的阿里云服务器，使这个项目可以通过链接让用户进行阶段性的尝试使用。

毕设开始了

虽然结课了，但是由于毕设指导老师的同意，所以可以继续开发，成为毕设作品~~

虽然毕设项目是明年三月份才答辩？时间上也算是充裕？

随着实训课的结课，我也是再也没有书读的人了。何去何从？？

养猪还是放牛？？我最终还是选择了前者，毕竟，，，

总感觉有点小焦虑，也有点懒散，刚好自己写的项目Cube自律空间是为了控制时间的，希望作为开发者，自己可以用起来，起码要戒掉一些慵懒。。。

其实很多事情需要顺其自然，和感情一样，不能勉强。。。强扭的瓜不甜。

不要说我不回信息，我是看了信息之后不回，如果你不是来一起学习的，我想我们可能不需要继续交谈。

接受不完美的自己，接受世界的纷纷扰扰，但是无论怎么样，都得努力，我从来不看一个人说了什么，我只看重一个人做了什么，有人在吹，我就听听就过去了。

在我成长的这条路上，有很多的资源和人脉是我非常非常非常需要去感谢的。

但是更多的还是自己的选择和坚持，所以路要一步一步走，苦要一口一口吃。

我大体上的状态是：保持乐观，保持坚强，保持努力，是不会轻易去改变的。

咩，11月22号就要拍毕业照了，有点小紧张，因为摄影师是用相机拍的，我害怕那相机把我脸大眼小这个事实生动形象的拍了出来，所以就学着画眼线，之前不弄是担心眼瞎哈哈哈，因为我觉得处理这些很麻烦哈哈哈哈哈哈哈哈哈哈哈。。。

但是毕业照就一次，为了拍个照，我现在还是会控制自己，就是比如：

• 争取12点半前休息
• 每天吃水果，我早上吃了橙子，哇，好酸~~
• 尽量多动，因为职业关系，我是一直坐在电脑前的…
• 保持一个乐观开朗愉悦的心情，调整好心态，像我就喜欢刷抖音的方式来使自己放松

最近也是抖音，小红书看了很多视频和教程，然后就学着贴双眼皮。。。

因为我是油皮嘛，所以用了美宝莲的粉底液配上完美日记的散粉啊啊啊啊，感觉还行/。。

昨晚和同事们吃牛蛙，我只负责吃吃吃，喝喝喝，吹吹吹，拍拍拍。

毕竟菜鸟的世界，需要的是美食给予的简单的快乐~

吃完之后有同事问我是不是还有下半场，毕竟我小小打扮了一下，虽然一般般，但是也还可以？？？

其实我不是精心打扮，而是周末的穿搭我会比较俏皮一些，不同的风格会去试试看而已啦~

而且为了毕业照，会花点时间学化妆，不然到时候就手忙脚乱了。

我现在的桌子上一堆化妆品和护肤品。。。

其实说到底还是得学习，在这个竞争比较大的社会，而且现在疫情，背景不一样了，凡事需要花点心思，好好准备，厚积薄发。。。

客户端已经部署到服务器了。。算是版本0.1？？虽然服务端还没有部署上去，但是一个上去了，也还算是可以？？

客户端部署到服务器

我把我的源码放置到了码云，然后在我的阿里云去下载那个码云上 Cube自律空间 的源码。

部署之后 npm install 安装，npm run dev 启动。

之后我就使用我阿里云的IP地址+端口号去访问了。

http://***.57.158.140:8082

但是过了很久很久之后才显示登录的界面。。。

我的服务端还没有部署上去，所以肯定是不能点击登录和注册的。

接下来就打算弄Nginx

nginx路径：

/usr/local/nginx/sbin

cd /usr/local/nginx/sbin/

启动：

./nginx

停止：

./nginx -s stop
./nginx -s quit
./nginx -s reload

http://123.57.158.140/

我放置的位置是：

/home/admin/application/nginx-1.12.2

重点是 conf 文件。

然后代理成功的话，访问的页面就会显示以下的情况啦~

一些知识储备

内网和外网的区别

**首先在IP地址设置方面，内网一般有自己的IP号段。**外网的IP一般般是不能拥有的，用于公司企业等机构的较为多一些。其次，在连接网络方面的区别。**内网电脑在连接外网时需要一个统一出口。**而外网不经路由器或交换机就可以上网，可以直接被外界所访问到，无需经任何设备。在安全性方面的区别，内网抵御来自外网的攻击能力会好一些，但也可能会遭到来自内部的攻击。在范围上，外网要广泛的多，内网相当于外网来说范围更小。

Nginx概念

Nginx(“engine x”)是一款是由俄罗斯的程序设计师Igor Sysoev所开发高性能的 Web和 反向代理 服务器，也是一个 IMAP/POP3/SMTP 代理服务器。

安装 Nginx

1、下载 Nginx，下载地址：http://nginx.org/download/nginx-1.6.2.tar.gz

[root@bogon src]# cd /usr/local/src/
[root@bogon src]# wget http://nginx.org/download/nginx-1.6.2.tar.gz

2、解压安装包

[root@bogon src]# tar zxvf nginx-1.6.2.tar.gz

3、进入安装包目录

[root@bogon src]# cd nginx-1.6.2

4、编译安装

[root@bogon nginx-1.6.2]# ./configure --prefix=/usr/local/webserver/nginx --with-http_stub_status_module --with-http_ssl_module --with-pcre=/usr/local/src/pcre-8.35
[root@bogon nginx-1.6.2]# make
[root@bogon nginx-1.6.2]# make install

5、查看nginx版本

[root@bogon nginx-1.6.2]# /usr/local/webserver/nginx/sbin/nginx -v

到此，nginx安装完成。

Nginx 配置

创建 Nginx 运行使用的用户 www：

[root@bogon conf]# /usr/sbin/groupadd www 
[root@bogon conf]# /usr/sbin/useradd -g www www

更多细节参考文档

启动 Nginx

[root@bogon conf]# /usr/local/webserver/nginx/sbin/nginx

访问站点

以下包含了 Nginx 常用的几个命令：

/usr/local/webserver/nginx/sbin/nginx -s reload            # 重新载入配置文件
/usr/local/webserver/nginx/sbin/nginx -s reopen            # 重启 Nginx
/usr/local/webserver/nginx/sbin/nginx -s stop              # 停止 Nginx

参考资料

https://www.qinxuezhi.com/jxwd/7443.html

https://www.runoob.com/linux/nginx-install-setup.html