bitshares-ui 代码的 App 目录结构浅析

ety001 (72)in #cn-dev • 6 years ago (edited)

最近经大神 @abit 带路入坑 bitshares-ui 的开发，让我有机会近距离的参与到 bts 的热火朝天的革命工作中（先感谢下 @abit ）。目前大约花了两周多的时间了，粗略的学完了 React ，并阅读了不少 bitshares-ui 的代码，先写篇代码结构的浅析（这篇内容不多，偏水），一是自己总结下，方便自己查阅，二是刷下存在感，证明自己作为见证人和开发者还活在社区里，三是一直看 Exchange 页面的逻辑，梳理多到让人崩溃的参数和条件，需要换换脑子。

声明：由于是第一遍读代码，应该有理解上的不足或者错误，如果存在，烦请指出，感激不尽。

首先看下目录结构

目前开发我们需要关注的只是 /app 目录，该目录下的内容就是所有的程序代码了。下面说下每个目录的大致功能。

__tests__ : 未知。
actions : 这是连接 components 和 stores 的桥梁，数据操作相关的各种集合，如果要找最终数据如何落实，就在这里面翻翻看。
api : 目前我理解的是，对最终调用的api接口的一个封装和配置。
assets : 静态资源，其中 locales 放着多语文件，stylesheets放着页面样式表。
components : 所有的页面组件都在这里，其中需要指出的是 icon 是自己实现的，而不是用现有的类似 Font Awesome 这样公共的库。
help : 存放的是各国语言的帮助文件。
lib : 常用的函数方法的封装。
stores : 一些对数据中间状态的结构和方法封装。
test : 应该是跟单元测试相关的东西。

目前看，开发时，精力主要集中在 components 目录上，附带需要查阅 actions, lib, stores 这几个目录的内容。其中 components 目录下，一个目录差不多就是钱包里的一个页面，其中命名以 Container 结尾的 jsx 就是该页面的最外层的包裹层。

好了，水文结束，继续码代码去。。。

补充一： 使用了 alt 框架，对于一些方法的使用，需要参考下其文档。

欢迎使用 SteemMention 获取最新的 Steem 回复提醒。

欢迎使用 SteemEditor 来编写文章，最好用的 Steem 编辑器，没有之一！！！

感谢你的阅读，我是中文区见证人之一，欢迎通过 SteemConnect 来给我投票，或者打开 https://steemit.com/~witnesses/ 页面，输入 ety001 进行投票。

中文区的见证人目前有：
支持一下他们（按字母顺序），一人可以有30票：

Thank you for reading. I'm a witness. I would really appreciate your witness vote! You can vote by SteemConnect. Or open https://steemit.com/~witnesses page, input ety001 to vote.