初识nest.js,前端多少也得会一点后端吧。
哈喽哈喽,我是你们的金樽清酒。实习也马上进行倒计时啦。后面的规划就是学习nest.js将课设完成。这个是有点夸下海口了。因为学校要选题嘛。只会前端的我就直接跟老师说我要写一个基于react和nest.js的全栈项目。能不能把吹的牛逼实现,那就得靠学习毅力了。还有一个情节,我为什么要学习后端呢?因为我的前端是跟后端工程师学的。他一直在走全栈。我去实习,我写前端,他写后端。前后端交流的时候,都得交代哪些字段嘛,解释权都在后端。那我前端会自己写接口的话,是不是对接口的时候也会更快,因为对数据更加的敏感了。基于这些情怀,我决定自己也得学一点后端。凭什么只有后端能改一改前端的简单页面。我前端就不能写一写简单的接口啦。
认识nest.js
首先,学习一门框架或语言呀,都得看它的文档,今天我们就来看一下它的文档来进行学习吧。 NestJS中文文档
基于node的服务端框架有很多,比如koa和express。但是呢,这些框架没有解决一个问题。那就是架构的问题。而nest.js就解决了架构的问题。受AnAngular的启发。nestJS提供开箱即用的应用架构。
我们先用nest cli来创建一个nest项目来看一下它的架构。
$ npm i -g @nestjs/cli
$ nest new project-name
先全局安装一下nest cli。然后用nest cli创建一个项目。
安装完之后,cd到这个文件下,npm run start 运行这个项目。
可以看到我们的项目成功的启动了。我们在浏览器上打开访问localhost:3000可以看到返回在浏览器上的内容。
项目的架构
在src的目录下有五个文件,这个就是nest架构的核心。
controller是路由的基本控制器,它的作用是控制路由和解析参数的。 module是声明模块依赖关系的。指明哪个控制器,用哪些注入的方法。
比如上图的这个module文件。它声明的controller是AppController也就是controller文件抛出的内容。
service是方法具体实现的地方。比如操作数据库,返回数据。
整体采用的是mvc架构。也就是modal、view、controller。controller解析参数交给modal处理也就是service然后返回view。而而上面的module就是声明哪个controller控制哪些service。是一个模块化的机制。可以理解为control文件就是处理数据,交给service里面的函数处理。而module就是声明了依赖关系。有了这个依赖关系,就可以交给main.ts来执行。
我们来简单写个前端发个请求验证一下
这是我们是用的fetch。用live-server运行页面。
经典问题,跨域了。这是面试题里面出现的经典问题。被浏览器同源策略拦了呗。俩域名不一样。这个时候,需要在nest.js的main文件里面配置跨域。因为用的exprees框架,可以直接用 app.enableCors();
现在再让我们请求一下。
你看,现在请求是成功啦。但是这么写肯定是不合规的。需要配置的更详细。
总结
nest.js是基于node的优秀的服务端框架。它有类似于java的架构。使用的是mvc模式。mian.ts文件是入口文件。module文件用于管理模块。controller用于处理路由和解析参数。service文件处理具体的业务逻辑。这用mvc模式便于开发和维护。当然nest还有很多的核心概念,这篇文章比较粗略。等后续文章再一一介绍。