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)
    • 校验规则
    • 业务逻辑
    • 对象关系
    • ......
  • 封装计算和逻辑
相关推荐
前端大卫6 小时前
Vue3 + Element-Plus 自定义虚拟表格滚动实现方案【附源码】
前端
却尘6 小时前
Next.js 请求最佳实践 - vercel 2026一月发布指南
前端·react.js·next.js
ccnocare6 小时前
浅浅看一下设计模式
前端
Lee川6 小时前
🎬 从标签到屏幕:揭秘现代网页构建与适配之道
前端·面试
Ticnix7 小时前
ECharts初始化、销毁、resize 适配组件封装(含完整封装代码)
前端·echarts
纯爱掌门人7 小时前
终焉轮回里,藏着 AI 与人类的答案
前端·人工智能·aigc
twl7 小时前
OpenClaw 深度技术解析
前端
崔庆才丨静觅7 小时前
比官方便宜一半以上!Grok API 申请及使用
前端
星光不问赶路人7 小时前
vue3使用jsx语法详解
前端·vue.js
天蓝色的鱼鱼7 小时前
shadcn/ui,给你一个真正可控的UI组件库
前端