从交接文档看项目结构

记录一下,大概的算是一个项目的概览。没有啥东西。

文档大纲

1、项目基本说明

2、项目目录说明

3、基础代码说明

4、其他

一、项目基本说明:

1、项目使用react+mbox,构建部分使用webpack,部署部分没有在前端实现。

2、接口部分因为使用了ProtoBuf数据序列化协议作为数据规范,该部分压缩和打包使用了makefile实现。

3、使用npm来管理包

建议和想法:后续可以通过做node服务方式来完成前端的自动部署,这样可以在测试环境下单功能点测试时有效提高效率。

二、项目目录说明:

1、api  这个文件夹是跟protobuff协议相关的文件,打包压缩协议在这个里边进行。打包使用的是make file ,还包含了通过git 子模块引入进来的proto协议 仓库。具体使用可以查看readme

2、app 页面文件夹 

app

  |— api封装的接口请求,包含了接口错误代码的处理

  |— lib预计存放的外部库,如tv,但是这个有点儿跟vendor重合,可以移到外边

  |—locales多语言资源包

  |—pages页面文件(内部根据功能进一步细分文件夹)

  |—router路由文件

  |—stores一些公用数据或者静态数据,和本地存储接口(这货是封装的stroejs)

  |—style样式

  |—util一些工具方法🔧

  |—index.js  入口文件呐。

3、config 运行配置。

4、docker 容器服务,作为服务器承载代码运行,后端同学负责维护。

5、md-image readme文件图片文件夹

6、node_modules…..

7、src 这个是目前官网的静态文件。

8、test  测试代码

9、vendor  直接引入的外部库,包括api的打包压缩文件,加密算法文件等

10、webpack  不解释。

三、基础代码说明

这个部分介绍一些网站的基础架构方面的东西。

1、网络请求处理

app>api文件夹下。

只是对grpc的调用做了简单的封装,内部对请求错误,和结果错误做了处理。并且封装了常用的几个方法,直接调用发送响应请求方便使用。

api  封装请求文件

errorStatus内是对错误码的处理。

common是封装的几个常用的请求。

2、错位码处理

错位码处理方式见在errorStatus内。调用在封装的api内

错位码的基础代码已经添加,目前错误码字典没有添加完成。

3、多语言处理

多语言处理使用的 react-intl-universal ,这个家伙是阿里出来的一个多语言包。

入口在home/home. ,语言资源包子locales内,目前只有中文和英文两种。

语言包内当前想要根据具体的业务模块划分不同的资源块。另外有一部分共用的块。

目前基础代码已经添加,只要添加语言资源包,替换文件内的静态文字即可以使用

4、路由

这个就说全家桶的router,没啥说的。加载方式清华已经调整过。

5、数据存储和传递

数据分两层,mobx和localStore

mobx解决数据传递和视图的跟新。由于数据存在于内存中,所以当页面刷新时数据会被丢掉。由于有些数据需要刷新页面后也可以使用,所以添加了localStore这一层存储。

mobx部分 ,公用数据存储,包括 用户,币种,及其他需要全站显示的数据,比如即时通知(不是通知列表,是指的新的需要当前通知用户知道的,不是用户已经查看过的数据)等,其他业务中可能用到的多次使用或者公用的数据也可以存储。


其他部分数据比如订单列表,交易记录,通知公告历史列表这 要存储公用数据,当前组件使用完即丢弃。其他业务逻辑相关的一次性使用的数据。

localStore层封装了storejs实现。后续计划在封装着一层,对存储的key/value进行加解密操作,避免用户可以直接可以通过浏览器查看明文数据。

四、其他

1、公用组件

位置:pages > components

Dialog 弹窗,对element-ui Dialog的二次封装

toast 提示,对element-ui Message的二次封装

pagination分页, 对element-ui Pagination的二次封装,这DidMount生命周期内手动添加“上一页,下一页 ”页码提示

imgUpload图片上传组件,这个目前是不符合产品需求的,这个实现是因为当时跟后端讨论时说要存储二进制数据。后续可以使用element-ui的图片上传组件。

Header,footer这两个就是通用页头和页脚。

由于以上的组件代码基本都是二次封装,没有其他的特别需要注意的逻辑,所以不进行代码展开。

2、关于加密算法,

elliptic

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,616评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,020评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,078评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,040评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,154评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,265评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,298评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,072评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,491评论 1 306
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,795评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,970评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,654评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,272评论 3 318
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,985评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,223评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,815评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,852评论 2 351

推荐阅读更多精彩内容

  • Meteor universal fork允许你在未被官方支持的平台上运行Meteorjs。特别是基于ARM处理器...
    时见疏星阅读 630评论 0 0
  • 今天老板同意公司出钱请研究生饭,还可以在500元内。再次证明不要有限制想法,也感恩自己有想法也接受想法,感恩有个小...
    Phoebe_chen阅读 482评论 0 0
  • 缠一段红线 凝结未了的思念 蝉鸣时花开得娇艳 像你带笑倾城的脸 风起时云又飘得渐远 如我们明亮多变的流年 若我还在...
    来路远方阅读 172评论 1 5
  • 嗯……最近还好吗 我算了下 今天是你离开我的第364天 明天,就是我们分开的第一年 然后会有第二年、第三年、第四年...
    吴大芳哟阅读 216评论 0 2