Web开发

首页 » 常识 » 问答 » web前端培训带你学习Midwayjs实
TUhjnbcbe - 2025/4/28 18:58:00
为白癜风患者解除病痛 https://m.39.net/pf/a_5777849.html

经常有人问,现在都年了,还要学习Node.js么?我想这个问题,可能每个前端开发者,都会在工作到一定阶段思考这个问题。可以很明确的告诉大家,学习Node.js可能是将来每个前端开发者必备的一项技能。

在Angular发布的同一年(年),Node.js也随之登台,Node.js的出现带来的第一个好处就是前端工程化的成熟,前端构建工具开始百花齐放。这时的前端已经不再是一个简单编写几行JavaScript即可完成的事情,前端开发开始出现了前端工程师这个职位,专职前端研发人员开始在各个公司中普及,前后端协作问题也开始加剧。

BFF

随着Node.js的成熟,在年,基于BFF(BackgroudForFrontend,服务于前端的后端)的架构理念被提出,BFF架构通过在UI和服务端之间加入中间层,解决了前后端职责难以划分的问题。

如图所示,由于前端的逻辑复杂性不断增加,增加了专门用于处理用户界面逻辑的服务层,同时后端逻辑也完成下沉,基于微服务架构的后端服务逐渐成型,通过基于Node.js的BFF层,前后端形成了比较清晰的分工,也就是进入了前端工程师时代。

Node.js的基本原理

先看一下早期的Node.js结构图,来自Node.js之父RyanDahl的演讲稿,它简要的介绍了Node.js是基于ChromeV8引擎构建的,由于事件循环EventLoop分发I/O任务,最终工作线程WorkThread将任务丢到线程池ThreadPool里去执行,而事件循环只要等待执行结果就可以了

核心

ChromeV8解释并执行JavaScript代码(这就是为什么浏览器能执行JavaScript原因)

libuv由事件循环和线程池组成,负责所有I/O任务的分发与执行

常用的框架

为什么选择Midway

如果说这两年那个语言在前端最火,我想TypeScript肯定有一席之地,强约束性的语言使得在构建Node.js应用时,提供了类型检查等约束能力,使得Node.js更安全等。Midway基于TypeScript开发,对于TypeScript的支持更好一些。

最近在深耕于公司的基础建设,使用的Node.js框架刚好是Midwayjs。

Midwayjs提供了Web中间件的能力。

Midway简介

Midway是阿里巴巴-淘宝前端架构团队,基于渐进式理念研发的Node.js框架。

Midway基于TypeScript开发,结合了面向对象(OOP+Class+IoC)与函数式(FP+Function+Hooks)两种编程范式,并在此之上支持了Web/全栈/微服务/RPC/Socket/Serverless等多种场景,致力于为用户提供简单、易用、可靠的Node.js服务端研发体验。

多编程范式

Midway支持面向对象与函数式两种编程范式,你可以根据实际研发的需要,选择不同的编程范式来开发应用。

面向对象(OOP+Class+IoC)

Midway支持面向对象的编程范式,为应用提供更优雅的架构。

下面是基于面向对象,开发路由的示例。

//src/controller/home.ts

import{Controller,Get}from

midwayjs/decorator;

import{Context}from

midwayjs/koa;

Controller(/)

exportclassHomeController{

Inject()

ctx:Context

Get(/)

asynchome(){

return{

message:HelloMidwayjs!,

query:this.ctx.ip

}

}

}

函数式(FP+Function+Hooks)

Midway也支持函数式的编程范式,为应用提供更高的研发效率。

下面是基于函数式,开发路由接口的示例。

//src/api/index.ts

import{useContext}from

midwayjs/hooks

import{Context}from

midwayjs/koa;

exportdefaultasyncfunctionhome(){

constctx=useContextContext()

return{

message:HelloMidwayjs!,

query:ctx.ip

}

}

环境准备

首先确保你已经安装了Node.js,Node.js安装会附带npx和一个npm包运行程序,Midway3.0.0最低版本要求12.x。

项目创建

使用npminitmidway来创建项目

npminitmidway

我们这里使用3.0版本,因此我们这里选择koa-v3,输入项目名称,脚手架会帮我们创建一个简单的项目工程,等安装完成。

我们使用Vscode打开项目。可以得到现在的工程目录

midway-demo

├──README.md

├──README.zh-CN.md

├──bootstrap.js

├──jest.config.js

├──package.json

├──src

│├──config

││├──config.default.ts

││└──config.unittest.ts

│├──configuration.ts

│├──controller

││├──api.controller.ts

││└──home.controller.ts

│├──filter

││├──default.filter.ts

││└──notfound.filter.ts

│├──interface.ts

│├──middleware

││└──report.middleware.ts

│└──service

│└──user.service.ts

├──test

│└──controller

│├──api.test.ts

│└──home.test.ts

└──tsconfig.json

整个项目包括了一些最基本的文件和目录

src整个工程的源码目录,之后所有的开发代码都将放在这个文件夹下面

test测试目录,之后所有的代码测试文件都在这里

package.jsonNode.js项目基础的包管理配置文件,这个想必大家都很熟悉

tsconfig.jsonTypeScript编译配置文件.

在src目录下面,常用的有:

config业务的配置目录

controllerwebcontroller目录

filter过滤器目录

interface.ts业务的ts定义文件

middleware中间件目录

service服务逻辑目录

启动项目

yarndev

warning../../../../../package.json:Nolicensefield

$cross-envNODE_ENV=localmidway-bindev--ts

[Midway]StartServerat

1
查看完整版本: web前端培训带你学习Midwayjs实