Web前段技术发展很快,主流技术日新月异,想想自己刚毕业那会用的asp技术,现在已经很少有主流网站在使用了。
再到后来的J2EE框架,然后SpringMVC大行其道,但是最近各种js框架被广为传播,Html5的推出很是丰富了移动互联网的发展,此文对当前最新的几种web前端技术进行的汇总,让大家更多地了解,然后取其所长,避其所短,快速推出简约大方,维护方便,性能良好的个人网站。

JavaScript MV*框架

在相当长的一段时间里,每个程序员都要学会如何利用JavaScript来编写弹出一个警告框或查看是否包含@符号的电子邮件之类的程序。而现如今,HTML AJAX App变得复杂了,以至于很少有人从头开始来学习它们。相反,像使用一个精心设计的框架、编写一些粘合代码来实现业务逻辑的方式更容易让人们接受。这些框架都可以帮助你处理Web App和网页上的事件和内容,大大的节省了时间。
类似的框架如: Dojo Utility tool,jQuery,AngularJS,Backbone.js,Node.js等等,

* AngularJS
AngularJS是一款开源 JavaScript函式库,由Google维护,用来协助单一页面应用程式运行的。它的目标是透过MVC模式 (MVC) 功能增强基于浏览器的应用,使开发和测试变得更加容易。

函式库读取包含附加自定义(标签属性)的HTML, 遵从这些自定义属性中的指令,并将页面中的输入或输出与由JavaScript变量表示的模型绑定起来。这些JavaScript变量的值可以手工设置,或者从静态或动态JSON资源中获取。

* Backbone.js
Backbone.js是一套JavaScript框架与RESTful JSON的应用程式接口。也是一套大致上符合MVC架构的编程范型。Backbone.js以轻量为特色,只需依赖一套Javascript 函式库即可运行。常被用来开发单页的互联网应用程式,以及用来维护网络应用程式的各种部份(例如多使用者与服务器端)的同步。Backbone.js是由Jeremy Ashkenas所开发,他同时也是CoffeeScript的开发者。

* jQuery
jQuery是一套跨浏览器的JavaScript库,简化HTML与JavaScript之间的操作。由John Resig在2006年1月的BarCamp NYC上发布第一个版本。目前是由 Dave Methvin 领导的开发团队进行开发。全球前10000个访问最高的网站中,有65%使用了jQuery,是目前最受欢迎的JavaScript库.

* Dojo utility tool
Dojo是一个用javascript语言实现的开源DHTML工具包。它是在几个项目捐助基础上建立起来的(nWidgets,Burstlib,f(m)),这也是为什么叫它a"unified"toolkit的原因。Dojo的目标是解决开发DHTML应用程序遇到的那些,长期存在、历史问题(historical problems with DHTML)。跨浏览器问题。


CSS框架

曾几何时,只要是在Web页面花点时间就能打开CSS文件,还包括一个新的命令,像font-style:italic,接下来只需要利用一上午的时间就能把所有事情搞定。而现在的网页设计则相对复杂些,而且也不可能利用这么简单的命令就可以填补一个文件。

可以这么说,CSS框架是SASS和Compass最坚实、最牢固的基础,CSS框架能够提供类似于实际变量、嵌套模块和混合之类的组件,这样有助于创建高质量、更稳定的编码程序。这听起来并不像是编程领域里的新奇事物,但是这在设计领域里几乎是一个巨大的飞跃。

CSS框架一般是CSS文件的集合,包括基本风格的字体排版,表单样式,表格布局等等,比如:
* typography.css 字体排版规则
* grid.css 表格布局
* layout.css 布局
* form.css 表单
* general.css CSS常规设置
下面是一些不错的CSS框架。详细参阅:CSS框架


* Elements CSS Frameworks
Elements 是一个基础CSS框架,它用来帮助设计者书写CSS更加快捷简单。它不仅是一个框架,它拥有自己的工作流。它拥有你需要完成项目的各种元素,查看介绍:Overview .

* YUI Grids CSS

基础的YUI Grids CSS提供4种页面宽度,6种边框模板,以及控制行列能力。4kb文件提供了超过1000个页面布局等。

* YAML CSS Framework

Dirk Jesse的能够对(X)HTML/CSS 框架扩展,支持复杂web项目。YAML基于web标准和支持各种流行浏览器,尤其支持所有IE版本包括从 5.x/Win 到 7.0.

* Blueprint CSS

Blueprint是一个CSS框架,它的目标是减少你的CSS开发时间。它提供给你强大的CSS基础来创建你的项目,包括易于使用的grid,有效的字体排版,以及可打印的stylesheet.

 

SVG+JavaScript on Canvas
曾几何时Flash一直在牵引着软件工程师们的主流思想,主要是因为软件工程师乐见这样的结果。对普通显示效果的渲染看起来很不错,许多有才华的设计师们为Flash代码建立了一个优质的堆栈,这样便于提供复杂的转换和动画显示功能。

既然JavaScript有能力做和Flash同样的事情,那浏览器厂商和开发者肯定更加倾向于JavaScript。开发者们认为DOM层与来自新格式SVG(可伸缩向量图形)的整合将会带来更好的结果。SVG和HTML是由大量的标签组成,便于Web开发者使用。紧接着,就会有大量的API在Canvas项目上提供精致的画面,弱弱的问一句:那还有必要再继续使用Flash吗?

单页面Web App设计

记得在网络出现并不久的时候,URL所指向的Web页面都是充满了静态文本和图像的,把所有信息放到一个称之为网络的网页是非常之简单的。新的Web App对于大型数据库而言算是比较前端的了,当Web App想要获得所需信息的时候,它就会从数据库中把数据调出来放到指定的位置,而数据层则是完全独立于表示层和格式化层的。在这里,移动计算机处理技术的兴起也是另一个因素:一个单一的、响应式设计的Web页面就像是一个应用程序——这样就更好的避免了APP Store里可能出现的混乱现象。

Web接口

也是在很早以前,人们只能使用一个命令行编译器。后来呢,有人通过集成编辑器和其他工具而创建了IDE。不过现在又到了IDE黯然失色的时候了——通过基于浏览器的工具就可以编写用于工作系统的代码。如果你不喜欢WordPress的工作方式,IDE可以在程序中安装一个内置的编辑器,随时随地的更改代码,也就是说,IDE更人性化。国内首家基于web编译器功能的网站(www.gbtags.com)更是引起了广大web前端开发者的关注。

Node.js
Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎。目的是为了提供撰写可扩充网络程序,如Web服务。第一个版本由Ryan Dahl于2009年发布,后来,Joyent雇用了Dahl,并协助发展Node.js。

其他编程语言的类似开发环境,包含Twisted于Python,Perl Object Environment于Perl,libevent于C,和EventMachine于Ruby。与一般JavaScript不同的地方,Node.js并不是在Web浏览器上运行,而是一种在服务器上运行的Javascript服务端JavaScript。
Node.js实现了部份CommonJS规格(Spec)。Node.js包含了一个交互测试REPL环境。

在Node.js领域里,Node.js在浏览器和服务器之间提供和谐的开发环境以获得利益。运行在浏览器和服务器之间相同的代码使得开发者在调用功能和复制特性的时候及其便利。最后,Node.js层将会成为互联网上最热门的堆栈。