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层将会成为互联网上最热门的堆栈。

当下较热web前端技术汇总的更多相关文章

  1. 最受欢迎web前端技术总结

    Web前端技术发展非常快,主流技术的进步.想想刚毕业那会用asp技术.目前,该网站已经非常少见主流应用. 后来的后来J2EE框架.然后SpringMVC声望,然而,最近的各种js框架广泛传播,Html ...

  2. 绝版珍珍藏:web前端技术学习指南

    绝版珍珍藏:web前端技术学习指南 优秀的Web前端开发工程师要在知识体系上既要有广度和深度!应该具备快速学习能力. 前端开发工程师不仅要掌握基本的Web前端开发技术,网站性能优化.SEO和服务器端的 ...

  3. 20151028整理罗列某种开发所包括对技术(技术栈),“较为全面”地表述各种技术大系的图表:系统开发技术栈图、Web前端技术栈图、数据库技术栈图、.NET技术栈图

    ———————————— 我的软件开发生涯 (10年开发经验总结和爆栈人生) 爆栈人生 现在流行说全栈.每种开发都有其相关的技术.您是否觉得难以罗列某种开发所包括对技术(技术栈)呢?   您是否想过: ...

  4. 现代前端技术解析:Web前端技术基础

    ​ 最近几年,越来越多的人投入到前端大军中:时至至今,前端工程师的数量仍然不能满足企业的发展需求:与此同时,互联网应用场景的复杂化提高了对前端工程师能力的要求,一部分初期前端工程师并不能胜任企业的工作 ...

  5. web前端技术社区分享

    web前端技术社区分享 一.国外的前端技术网站:    1. 名称:W3C: 网址:http://www.w3.org/ 理由:前端技术的规范标准几乎都是W3C制定的  2.名称:ECMA 网址:ht ...

  6. web前端技术与原生技术的竞争, 及未来的发展

    用户界面领域: web技术与原生技术之争 除了浏览器中运行之外, html5的技术也在app领域和移动端的安卓, iOS, 以及桌面端的window, linux以及OS X展开了竞争. 同样属于用户 ...

  7. Web前端技术研究:Css hack技术---令人沮丧的技术

    我最近想好好整理下csshack技术,但是结果很沮丧,下面我将我最初写的笔记和大家分享下. 我在单位整理的研究笔记: 不同的浏览器对某些CSS代码解析会存在一定的差异,因此就会导致不同浏览器下给用户展 ...

  8. 关于当前Web前端技术的一些感悟和笔记

    最近这些年,随着前端应用技术突飞猛进,产生了很多新的前端框架,当然也引入了数不胜数的前端技术概念,前端不在是早期Web Form的拖拉处理方式,也不再是Ajax+HTML那么简单,随着前端技术的发展, ...

  9. web前端技术体系大全

    一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...

随机推荐

  1. mysql运维常用

    一.用户授权 用户授权主要指: 1.可以限制用户访问那些库.表 2.可以限制用户对库.表执行select.create.delete.alter.drop等操作 3.可以限制用户登陆的IP.IP段.或 ...

  2. str类型内置方法

    目录 str类型内置方法 用途 定义方式 常用操作和内置方法 优先掌握 需要掌握 了解 存一个值or多个值 有序or无序 可变or不可变 强化训练 str类型内置方法 用途 字符串数字.字母.下划线组 ...

  3. python socket实现文件传输(防粘包)

    1.文件传输的要点: 采用iterator(迭代器对象)迭代读取,提高读取以及存取效率: 通过for line in file_handles逐行conn.send(): 2.socket粘包问题: ...

  4. 介绍一个比较酷东西:HTML5 桌面通知(Notification API)

    Notification API 是 HTML5 新增的桌面通知 API,用于向用户显示通知信息.该通知是脱离浏览器的,即使用户没有停留在当前标签页,甚至最小化了浏览器,该通知信息也一样会置顶显示出来 ...

  5. 牛客网NOIP赛前集训营 提高组 第5场 T2 旅游

    [题解] 我们可以发现不在最小生成树上的边一定不能多次经过,因为一条不在最小生成树上的边(u,v)的边权比最小生成树上(u,v)之间的路径更长,选择不在最小生成树上的边一定不划算. 我们还需要确定最小 ...

  6. 【16】AngularJS API

    AngularJS API API 意为 Application Programming Interface(应用程序编程接口). AngularJS 全局 API AngularJS 全局 API ...

  7. node.js与HTML5离线缓存

    最近正学到HTML5的离线缓存,却看到需要配置服务器.一下子就懵了,毕竟服务器的有关配置一般是很复杂的,而node.js的服务器是自己的代码生成的,这下要怎么配置?在网上搜索了很久,都没用关于node ...

  8. HTTP Simple Storage

    ubuntu12.10桌面版 1.安装FastCGI /usr/bin/spawn-fcgi这个文件来管理 FastCGI,它原属于lighttpd这个包里面,但 9.10 后,spawn-fcgi被 ...

  9. sheepdog简介

    1.corosync,single ring最多支持50个节点:zookeeper,500个节点可稳定支撑,1000-1500个节点挑战比较大,需要优化消息传递机制. 2.sheepdog一开始为分布 ...

  10. 另一套备用的代码,通过service调用和登陆用户交互

    结合这两个东东,应该差不多可以搞定我需要的事情啦. 因为更改不了service代码,所以希望从service调用的代码里,争脱出来,和本地登陆用户进行交互启动. #include <window ...