bitshares-ui 比特股开源交易所功能分析

1、准备工作

由于bitshares-ui是一个采用react.js前端框架 编写的前端页面，所以我们使用Chrome浏览器和VS code配合起来调试和查看这个项目的大致框架和功能。在Chrome浏览器中安装react.js 的插件，这个可以在Chrome的插件市场上面去安装。安装这个项目，下载源代码。

2、查看大致功能

1、钱包
2、交易所
3、探索

3、详细介绍

在之前的文章中，我已经写了比特股项目的入口，以及大致的组成结构，所以现在，我们就直接从AppInit开始分析和研究。之前，我们知道了从AppInit开始就进入了react的阵地，就是前端页面的所在地。我们打开自己安装好的bitshares-ui 的项目地址比如我安装在云服务器上的，打开这个项目，就长这个模样

1.png

第一次打开就会叫你选择你的语言，选择中文然后你可以注册一个账号，这里需要注意，如果你要用这个账号就要保存好你所注册的账号，这个区块链的账户大家都懂的，没有了就找不回来了。现在，我们开始进入这个项目。现在进入账号
然后打开Chrome浏览器的“查看”这个功能，打开刚才安装的react插件，可以看到react的代码结构

00

这里只是部分代码，你自己可以按照这个去查看，这样你就相对更明白react的项目结构了。经过多次测试分析，在点击不同的链接的情况下，会在的中的匹配到一个路由，由于switch的特性，我们可以知道这个路由匹配到一个就停止了，在登录之后就会匹配到根目录下面，在此时就会加载 “/components/Account/AccountPage” 这个代码，有时候想一想，模块化的代码确实比较方便，很多的东西都可以复用。在右上角有可以看到自己的钱包。

2018-08-28 png

在这个钱包里面，你就可以完成转账，体现，充值等等这些基本的功能。在这个主页的左上角，有四个图标，分别是home，账户，市场，探索这四个大的功能，这四个功能都是在这个组件当中的，根据用户点击的功能，通过路由的匹配直接就到了这四个功能的页面，在home页面没有什么看的，我们直接去市场看看。

png

现在的交易所，基本上都会有一个这样的图表，让人一目了然。在上面是看走向图，那么在页面的下方，就是这个项目的重点了-“交易所”。在这里，可以进行买入卖出等等基本操作，在这个交易所里面，流通的货币叫BTS， 首先想要在这里面交易，那你就得有BTS这种平台的货币，所以在你交易前，先要充值一些BTS，这个充值BTS支持市面上主流的数字加密货币，所以基本交易不用担心，这个交易所的费用也是非常低的，具体的费用可以在探索页面看到。由于我没有BTS，所以就没有去查看卖出这个功能。感兴趣的朋友可以自己充值少量的BTS试一下。

接下来是探索功能，说着是探索，其实我也不清除到底叫什么名字，英文是explorer。在这个页面，为我们呈现的就是一些交易块，出块信息以及交易信息

png

在这里不仅能够看到关于区块链的东西，还可以查看见证人、账户等等一系列的功能。功能还是比较丰富的。

h.png

功能还是比较丰富，可以了解到许多信息，特别是见证人这个信息、理事会。

4、总结
我一直都比较推崇这种开源的交易所，可以让每个人都获益，而且也是比较安全的，有兴趣的朋友可以去安装调试这个项目。