[一对一讲什么] 之 测完了接口、搞好了目录，然后做啥？

接 [一对一讲什么] 之 切图之后做啥？要加入项目和测试接口 上回书说，切完了页面，把HTML文件啊，CSS，JS，IMG图片什么都扔到相应的开发环境目录里，把链接神码的都搞好，然后在开发环境里把你的页面能运行起来，就像这样，

你的自己电脑上搞好的页面的访问路径是这样的：

file:///D:/wesay/3/html5_1.html

如果你自己在本地电脑搞个apache服务，那么这个页面的访问路径是这样的，

localhost/wesay/3/html5_1.html

而如果你配置好开发环境之后，把项目跑起来，然后访问你的页面，它的路径应该类似于这样的，

http://231.235.35.22/wesay/3/xxx
//IP地址我随便写的
//.html文件后缀名没了

做好这些之后，上回书说，把接口也测试OK了。之后，就开始狂写JS了么？

NO NO NO。。。

接下来，要开始做前端的模块分析和JS的结构的设计。装B一点的说法，就叫做“前端架构设计”。

还是老样子，随便百度一张网页设计图，给大家演示一样。当然了，在一对一的课程中，是不会这样的。而是有一个我以前做过的电子商务的网站，1，2，3，4.。。各个步骤带你走

但是在这个小文章中，咱们就大概演示个套路就得了，原图挺长的我只用QQ截了个半截，

切图的时候是从页面的结构去考虑，而写JS的时候是写各种功能，要从功能上去考虑。

这个页面有以下几个功能点，

图中画红框的都是功能，有页面广播、审核通过、搜索、登录、导航、轮播图、show作品。

画成思维导图什么的就是这样，

这说明首页至少有7个功能块，

（1）广播肯定是全站范围的；

（2）审核通过也应该是多数页面可见的，但可能会有不同的展现形式，这说明它有二套或更多的view视图；

（3）搜索，全站级别，同（2）；

（4）登录，全站级别，同（2）；

（5）导航，首页应用。它的数量是否可以根据后端数据进行自动配置？数量是固定的么？

（6）轮播图必须可以通过API接口进行配置修改，这东西写好之后是要给编辑同学们用的；

（7）推荐作品，这块没什么说的，就是获取JSON，绑定事件，然后生成、展示；

好了，到这里，最基础的JS结构出来了。因为就是个说明套路的小文章，我也不打算展开的太复杂。

什么React啊，node啊，webpack,require...，这些我都不想提。因为这此东西都是，以功能的正确分析为出发点的。在一对一的视频课程中，每天二个小时，我会详细的讲解这方面的内容。

指望在一篇文章里把这里的事儿都写清楚，这想法有点太奢侈了。

好了，长话短说，至少这7个功能块，是7个function方法。到这里，你可以开始狂写JS了。

今天就到这里，明天咱们继续，聊一下全站级别的广播模块怎么去设计比较好。