首页 > 网站前端架构学习有什么路径指导下,或者什么方法 过程 需要有什么技术基础之后才能去学习前端架构

网站前端架构学习有什么路径指导下,或者什么方法 过程 需要有什么技术基础之后才能去学习前端架构

我们应该如何去学习了解 网站前端架构学习有什么路径指导下,或者什么方法 过程 需要有什么技术基础之后才能去学习前端架构,

本人就做过一些小的项目,和用框架写过一些网站,想自己做一个网站,自己架构,我对前端网站的架构也不是很了解,不知如何下手。

表现,结构,行为和商业逻辑的混杂 这些东西我还分不清,


三分离的原则是指以下三种类型的代码尽量分离:
*样式(css)
*结构(html)
*行为(javascript)

有时候我们会在一个html页面里直接写<style></style>标签进行样式定义,或者是在html标签里写样式,例如:<div class="test" style="color:red;font-size:16px;"></div>;
同样地,我们也可能在html页面里写js脚本,或是在html标签里直接写js代码,例如: <button onclick="alert('123');">click</button>;
这样的写法就是没有分离,耦合性极高。

那么谈到架构,最简单的就是一个小项目里,项目文件按照如下的分类方法进行处理:

project
|------img 放置图片文件
|------js  放置脚本文件
|------css 放置样式文件
|------index.html

index.html中,js采用<script src="js/xxx.js"></script>的方式引用,dom的操作不直接写在html标签上;而css采用<link rel="stylesheet" type="text/css" href="css/xxx.css">的方式引入,在html标签上只出现类或者id名称。
这就是所谓三分离了。最简单的架构就是这样。

稍微复杂一点的,你可以参考《编写高质量代码--web前端开发修炼之道》里边讲的一种架构,将代码分为底层、组件层、应用层,这样的分法也较为合理,建议你看看这本书。

其实架构都是你觉得怎么样好维护就怎么样设计目录结构。这个并没有一定的,也的确是需要一些工作经验,当自己觉得有些维护工作繁琐的时候,自然就会去思考架构怎么样设计合理。目前前端业界对于比较复杂的应用采用的是MVC或者是MVVM架构,一般都会配合node.js使用。例如奇舞团的think.js就是MVC架构的,基于node.js的框架。所谓架构完全取决于你应用的规模而言,针对项目进行设计。

如果你需要再深入一些,那可以找司徒正美的书看看。


所谓架构,都是以足够的经验作为基础的!

还有,好的产品都是不断迭代出来的

【热门文章】
【热门文章】