TypeScript实战篇 - TS实战:花田APP的架构

目录

TS实现花田APP的聊天Node端

整体架构

项目拆分

项目的特点

模型层

所有系统都是模型的外设

模型层的优势


TS实现花田APP的聊天Node端

整体架构

项目拆分

代号:@huatian

5个独立的npm包

  • @huatian/ui 花田的主项目
  • @huatian/component 花田组件库
  • @huatian/utils 花田的工具函数库
  • @huatian/model 花田的模型层
  • @huatian/svc 花田的node.js服务

实现语言:TS + VUE3

项目的特点

  • 突出架构的复杂性,技术的多元化,弱化交互和体验
  • 突出重点技能和实战技巧,减少重复
  • 重视性能和优化

模型层

user===people

  • Chat Context聊天场景【聊天】
  • Social Context社交场景【发动态】
  • Account Context账号场景【登入/登出,维护个人信息】

对象和对象之间的关系

所有系统都是模型的外设

模型层的优势

  • 前后端模型可以统一(Typescript)
    • 校验规则
    • 业务逻辑
    • 对象关系
    • ......
  • 封装计算和逻辑
相关推荐
肥肠可耐的西西公主4 分钟前
前端(AJAX)学习笔记(CLASS 2):图书管理案例以及图片上传
前端·笔记·学习
大胖丫6 分钟前
vue 学习-vite api.js
开发语言·前端·javascript
孙桂月7 分钟前
ES6相关操作(2)
前端·javascript·es6
遇见很ok7 分钟前
js中 ES6 新特性详解
开发语言·javascript·es6
陈浩源同学7 分钟前
学习 TypeScript 栈和队列数据结构
前端·算法
我这一生如履薄冰~9 分钟前
简单封装一个websocket构造函数
前端·javascript·websocket
fangcaojushi10 分钟前
解决webpack5.54打包图片及图标的问题
前端·vue.js
海盗强10 分钟前
Webpack打包优化
前端·webpack·node.js
星之卡比*12 分钟前
前端面试题---vite和webpack的区别
前端·面试
^^为欢几何^^17 分钟前
npm、pnpm和yarn有什么区别
前端·npm·node.js