00:00
大家好,我是学习园地的特约讲师高沃峰,那咱们项目开发到这里呢,已经基本结束了,剩下的功能呢,就交给大家来写了,给大家留个作业,那都包括哪些东西呢?需要写呢?因为咱们主体流程都写完了,你比如说在我们订单的时候,我们订单的状态需要跟后台去配合,那当我们下一个项目学员react,用react做完后台的时候,那你去来去测试一下,比如说在订单详情这里边去支付对吧,支付完之后确认订单,确认订单的时候,比如说我们已经支付了吧,找一个那这个确认订单的地方对吧?得后台点击发货,点击发货呢,你再把这个配送的地址获取出来,在这显示,然后呢,你收到货之后确认订单,然后完成订单交易,这是一个呃,流程就完整了这样的一个过程,然后呢,再有其他的,比如说。收藏收藏了你可以在哪写呢?你可以在每一个页面的里面,但是手机版你不需要在这,这是只是显示这个商品被收藏了多少次就行了啊,然后可以把它编辑出来,咱那个接口里边都是支持的,然后点击每一本书的时候,你可以在前边加一个收藏,或者是加一个收藏按钮,或者这地方加收藏按钮都可以点击收藏,对吧?然后呢,收藏的商品在我这块,我的里边个人中心这里边获取所有的收藏的商品列表,也可以是下拉下载更多这样的一个情况,然后里边也可以删除收藏。
01:17
对吧,就是我相对商品,但我还不想买海银那加入购物车的对吧,放到收藏里面,然后我的订单咱们这块是写了账号管理,需要你去写的,账号管理这里边呢,需要你去完成,呃,像。个人信息的设置,个人信息的设置,比如说头像切换,然后呢,找回密码这些几步几个步骤的操作。几个步骤操作,关于我们的,那你随便写个页面就行,或者这个去掉,写不写都可以,这几个还有一个功能几个,一个是把订单完善对吧,收藏编写,还有一个在商品的详情页的地方。详情的详情页里面,那我们还有一个什么,还有一个评论评论对吧?评论这块我们没写,那你可以通过评论接口,在这里边可以购买过的书,在这里边做评论对吧?然后呢,回复或者是呃,一是评论讨论,另外呢,可以做咨询对吧?在这边加按钮咨询,然后呢,商家看到了之后可以在里边恢复。
02:13
是这样,那这样的整个流程就是嗯,完完整整的一个商城了,这几个功能呢,因为它主体流程都已经写完了,这几个主主体,呃,这剩下这几个功能呢,呃不算太难,但是呢也有练习的地方,然后再把所有的呃滚动下拉的地方对吧,能加上就加上就可以了,然后最重要的是你把这个样式都可以初始化一下,那既然你都学习完成了,那你可以把所有的这些标签或者这些标题都用我们VT这个组件去完成。就行了,对吧,全改成那个组件的操作。就可以了。那这就是给大家留的作业,这几点不多,那也大概得需要一天左右的时间能把它完成吧,那现在呢,咱们看一下上线部署,那我们做完项目之后,那我们现在是在开发服务器里边,对不对,那我们需要怎么办?我们需要打开终端对吧,我们不需要这种第一位so了,那我们需要打包。
03:05
这里边看一下这个项目,呃,我们现在没有没有打包的,对吧,咱们一直没有打包过,那使用按照我们这个项目说明read的密里边对吧?如果我把它拷给你,不会给你拷这个目录,所以呢,你需要什么,你需要NPM1NO去安装,把所有的这个呃模块都下载下来,然后这个呢是运行环境对不对,然后用这个去打包对吧?那我们运行架NPMRUB。所有人都去打包一下。等待一下,他把这里边儿所有的你写的页面文件越多打包越慢,对吧,打包的时候就会按照我们啊。配点杰森里边运行时依赖就把那些打包,然后所有的注释什么都能去掉,那我们上线的项目用到的就是这个目录里边的数据,其他的数据都不用到,你看该打包的打包了,这是我们主播口门店,然后这是打包的所有的嗯。
04:03
GS文件,当每个组件都单独的加载,所以呢,单独打包了一个GS文件,然后呢,呃,在每个模块里边,每个页面单独引用,然后这里边是打包的,用到了这里边的一些图片,用到这里面一些图片也是打包了。嗯,然后这里边是SS和我们GS一样,每个页面里的CSS单独打包了,那我们看下这里边的,呃,GS这是通用的,这个CSS就变成这样对吧。前边给我们加上了这样的一个信息,后边的信息你看它给我们变成了一条一对对吧,小的图片。给我们打成了被六四的这样的一个格式,然后呢,所有的GS我们打包的都是这样的一个文件。啊,都是这样的一个文件控注释啊,什么东西都给我去掉了,把变量名都给我变短了,所以呢,整体下来这一个文件就变得很小了,打包,那我们想部署这个项目,您可以在阿里云上有个空间服务器,对吧,域名一指向就可以了,那我在本地给大家部署一下复制这个,呃,目录DST的目录,您可以改一下别的名,或者复制里边的文件都可以啊,然后我们到我们的服务器里边。
05:09
那我们自己做一个服务器,呃,我们我们这里边装了一个PP的一个运行环境,当然这里边用上PP用环境啊,但PP能装问组件里边装了一个阿帕奇,所以呢,我们放在这里边。64,然后3W下,你如果是在阿里云上买个服务器,你就放到那里边就行了,那我们把它粘到这,你或者是改名都可以啊,你叫DFT啊,或者是叫你的项目名称什么的都可以啊,然后。这里边儿是这个文件看到了吗?我们看一下整个咱们这个项目一共多大的一个文件。属性。你看才三兆多对吧,这个页面能分到每个页面没多少,所以访问速度还是应该是挺快的,你上线的项目就上这个,然后呢,我们现在上这个的话,我们得启动服务器,还得指定一个域名,对吧,那我们先指定一个呃,域名过来在我们的。呃,吸盘里边。
06:00
在本地指定嘛,不然的话你得买一个服务器在这里边的Windows里边。有一个。找到里边的C323。这块。这里边儿我们在找到它的里边的。找到里边的driver。里边我们找到ETCETC里边有个后文件,我们把这个文件打开。用这个打开的,然后这里边我们加一个域名,那你喜欢什么域名,你就可以加一个,我们复制一个,那用这个,因为本地的嘛,就随便,如果你放在服务器上,这是一个服务器的地址,后边是你的域名,那我们叫做shop r monkey,咱们就是VE3 vuee3,咱们的项目那就V3,嗯,R monkey,或者是咱们是ew show这个项目名称点com,咱得有A域名才可以啊,但是咱本地的话是有这个域名的,然后保存一下,什么都不用动就行了,然后我们打开密码GMDGMD我们可以测试一下。
07:08
可以用测试,那咱们可以直接听一下,嗯,听一下这个。路径,比如说VE3点 ew.com。你看是可以拼通的写离子对不对,专门这个域名是可以的,域名可以的,那我们现在就需要,嗯,配置一下阿帕奇的一个配置文件,然我们现在启先启动起来吧,这里边我们找到呃,问三问SOWM。我们点开,然后我们看一下由红变绿,我们这服务器就启动起来了,由红变绿。啊,右变率,然后我们右键这里边,呃,有language直接点左键,左键这里边有阿帕奇对吧,有阿帕奇的配置文件,有虚拟主机的这个配置文件,这是原来配置过多个虚拟主机,那这里边呢,你再随便找一个虚拟主机位置在哪都行。
08:03
就那个吧。我们在上边粘贴一个默认端口是八零端口,对吧,然后呢,我们的域名就是我们刚才写的这个域名啊,是VUVE3点,呃, ewshop.com。 EWshop.com这个别名了,我们也就就这个吧,V3点 ew.com,然后呢,目录呢在3W下边。我们是呃DST,当然你可以改名,这会改名就行了,然后呢,呃目录对应的目录也是3W下边的DST这个目录,其他的呢,咱可以不改,然后保存一下,保存一下关掉,关掉之后我们重启一下,因为改变阿帕奇的那个配置文件了,重启一下,重启所有服务。恭喜所有服务。然后由红再由红变绿,好重启完成,重启完成之后,那我们现在就不在本机是否访问了,因为本机这访问访问不了了,那就是呃VUEE3点 ewshop.com。
09:06
那这就是放在服务器上,但是放在服务器上我们所有的没访问,先告诉我们什么先登录的对不对。来这个先告诉新东物,我们这有一个EW,呃,E这个,然后e Du,呃,User user123是吧。登录成功可以保存这个,然后我们到首页对吧。然后呢,到另一面。诶一开始上一登录有点不太可能,那你再判断一下吧,从路由里面再判断就可以了,咱们都讲过了,然后我的对吧。没有。点击细说PP这本书比较好,对吧?可以立即购买,买这一本书就可以。然后呢,这么好的书一定得多买几本,三四库存里边现在就剩七本了,买完之后他会把库存这个去掉,七本全买掉吧,然后我们结算。
10:03
在这块对吧,然后可以生成订单,在生成订单呢,我可以现在你可以一样测试支付啊,现在已经上线了,对不对,然后你看路由上面这个地址对吧,然后关掉。也会到订单形成的,您可以在这地方再去支付,对不对,然后呢,我们也可以到我的这里边看一下我的订单。对吧,当然这个是有以前购买过的这些东西,记住你还是用这个用户登录的嘛,对吧,不管他在哪个服务器上,你还是用这个用户登录的,你可以注册一个新的用户去跑一下流程就可以了。然后待付款的。技术PPT对吧。但是它那个最下边的数据。没有付款的最后一个在这呢,对吧,买了七本,他是按那个数据排序的,你可以让他那接口里边倒序去排序就可以了,然后其他的你可以有地址管理。该上线的时候,你最好把下边测试的咱们这些数据啊,你都可以把它删掉啊。因为咱们现在咱半成品还没有优化呢,直接给删掉,这里边有的时候会出一些错误啊。
11:00
高度那再调整一下吧,在首页里边那些对吧,再去调整一下就可以了,好谢谢大家,这节课我们就到这里,呃,希望大家把这上项目优化完成再上线,然后再去可以商用。那这节课咱们到这里,那咱们这个项目的课程到这里,祝大家学习愉快。
我来说两句