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)
    • 校验规则
    • 业务逻辑
    • 对象关系
    • ......
  • 封装计算和逻辑
相关推荐
我只会写Bug啊4 小时前
Vue文件预览终极方案:PNG/EXCEL/PDF/DOCX/OFD等10+格式一键渲染,开源即用!
前端·vue.js·pdf·excel·预览
扯蛋4385 小时前
LangChain的学习之路( 一 )
前端·langchain·mcp
Mr.Jessy5 小时前
Web APIs学习第一天:获取 DOM 对象
开发语言·前端·javascript·学习·html
午安~婉5 小时前
javaScript八股问题
开发语言·javascript·原型模式
西西学代码6 小时前
Flutter---个人信息(5)---持久化存储
java·javascript·flutter
芝麻开门-新起点6 小时前
flutter 生命周期管理:从 Widget 到 State 的完整解析
开发语言·javascript·ecmascript
ConardLi6 小时前
Easy Dataset 已经突破 11.5K Star,这次又带来多项功能更新!
前端·javascript·后端
冴羽7 小时前
10 个被严重低估的 JS 特性,直接少写 500 行代码
前端·javascript·性能优化
rising start7 小时前
四、CSS选择器(续)和三大特性
前端·css
一 乐7 小时前
高校后勤报修系统|物业管理|基于SprinBoot+vue的高校后勤报修系统(源码+数据库+文档)
java·前端·javascript·数据库·vue.js·毕设