1、前端需要解决的问题:   l 如何使同一个页面在不同的浏览器显示相同效果? l 如何使 Css 组件和 javascript 插件从 pc 端过度到移动端? l 如何保持各个组件如菜单、表格等的一致性? l 如何能够快速构建布局?   解决办法:响应式布局  

一、常见的响应式布局

Ink是一个界面工具包,用于快速开发Web界面,为构建布局提供解决方案,可以展示普通的界面元素。

roundworkCSS是一个基于Sass预处理器的开源项目 ,主要用于快速构建响应式Web应用程序。拥有一个灵活的、可嵌套的网格系统,可以创建适应多种浏览设备的布局

lovry这是一个灵活、强大的响应式Web框架,使Web开发更快速、更简单。

Foundation为最先进的响应式前端开发框架,它拥有很多布局模板、CSS样式表及自己开发的优秀JavaScript插件。

Gumby 2基于Sass开发。Sass为功能强大的CSS预处理器,利用它可以快速开发Gumby。

HTML KickStart该框架集合了HTML5、CSS和JavaScript,帮助开发人员快速开发Web产品。它覆盖了所有UI组件,同时也包含一些有用的JavaScript插件。

Maxmertkit拥有完整的文档,包含大量实例,并且提供了拖拽生成代码的功能。

Bootstrap为众多设计者和开发者最喜欢的快速开发工具,由于全面的UI组件、易用的网格和组件

另外:SkeletonKubeHeliumMarkupPure等都是前端的响应式布局,为界面的布局设计、跨浏览器快速开发等提供了各方面的帮助。

二、前端框架

1)介绍:

 Node.js是一个Javascript运行环境(runtime)。它是对Google V8引擎进行了封装。V8引 擎执行Javascript的速度非常快,性能非常好。Node.js 就是运行在服务端的 JavaScript。

2)优点:

 i   Node.js是一个基于Chrome JavaScript运行时建立的平台,用于方便地搭建响应速度快、易于扩展的网络应用。

ii  Node.js 使用事件驱动,非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设备上运行数据密集型的实时应用。

iii NodeJS适合运用在高并发、I/O密集、少量业务逻辑的场景。

1)介绍:

 Angular.JS是一款优秀的前端JS框架和MVC框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是:MVW(Model-View-Whatever)、模块化、自动化双向数据绑定、语义化标签、依赖注入等等

2)描述:

 i   一个 JavaScript框架。它是一个以 JavaScript 编写的库。它可通过 <script> 标签添加到HTML 页面。

ii  通过 指令 扩展了 HTML,且通过 表达式 绑定数据到 HTM

iii 以一个 JavaScript 文件形式发布的,可通过 script 标签添加到网页中。

 

1)介绍:

jQuery Mobile 是一个为触控优化的框架,用于创建移动 web 应用程序。

jQuery 适用于所有流行的智能手机和平板电脑

jQuery Mobile 构建于 jQuery 库之上,更易学习,若精通通jQuery 的话。

它使用 HTML5、CSS3、JavaScript 和 AJAX 通过尽可能少的代码来完成对页面的布局。

2)优点:

jQuery Mobile 将“写得更少、做得更多”这一理念提升到了新的层次:它会自动为网页设计交互的易用外观,并在所有移动设计上保持一致。

介绍:

1)Vue.js 是用于构建交互式的 Web  界面的库。

2)它提供了 MVVM 数据绑定和一个可组合的组件系统,具有简单、灵活的 API。

3)从技术上讲, Vue.js 集中在 MVVM 模式上的视图模型层,并通过双向数据绑定连接视图和模型。

4)实际的 DOM 操作和输出格式被抽象出来成指令和过滤器。

5)相比其它的 MVVM 框架,Vue.js 更容易上手

 

介绍:

1)Backbone 为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构

2)其中模型用于绑定键值数据和自定义事件;

3)集合附有可枚举函数的丰富API;

4)视图可以声明事件处理函数,并通过RESTful JSON接口连接到应用程序

 

介绍:

1)RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>标签的脚本加载步骤

2)可以用它来加速、优化代码,但其主要目的还是为了代码的模块

3)它鼓励在使用脚本时以module ID替代URL地址

4)RequireJS以一个相对于baseUrl的地址来加载所有的代码。页面顶层<script>标签含有一个特殊的属性data-main,require.js使用它来启动脚本加载过程,baseUrl一般设置到与该属性相一致的目录。

 

介绍:

1)React 是一个 Facebook 和 Instagram 用来创建用户界面的 JavaScript 库

2)很多人认为 React 是 MVC 中的 V(视图)。

3)我们创造 React 是为了解决一个问题:构建随着时间数据不断变化的大规模应用程序。

介绍:

1)Amaze UI是轻量级的前端应用框架,是国内比较流行的框架

2)比较适用于移动端响应式开发框架,可以按照项目要求生成专属的UI框架库进行使用,组件非常丰富,可以构建出漂亮的web页面。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

更多推荐

主流前端-后端-数据库总结--前端框架篇