【年度盛宴】2012年度最佳 Web 前端开发工具和框架——《上篇》

简介:   2012年,Web 开发领域继续在快速的发展,HTML5 仍然在展示其跨平台的优越性,CSS3 被人们更多的应用到实际项目中,响应式设计(Responsive Design)技巧也被人越来越多的人熟知和使用。

  2012年,Web 开发领域继续在快速的发展,HTML5 仍然在展示其跨平台的优越性,CSS3 被人们更多的应用到实际项目中,响应式设计(Responsive Design)技巧也被人越来越多的人熟知和使用。

您可能感兴趣的相关文章

 

  技术的快速发展让很多人学习起来无所适从,幸运的是,很多优秀的 Web 开发人员和设计人员在努力寻找各种有特色的解决方案。 因此,我们有了很多优秀的小工具和库,每一个都是用来解决特定的问题或维护一组特定的项目。

   这篇文章收集了2012年度新发布的最具有代表性 Web 前端开发工具和框架,这是一个非常值得收藏的工具列表,从功能全面的 IDE 到美观、充满异国情调的小框架,小工具等等。他们能够帮助你降低 Web 开发过程中的复杂度,节省时间和精力。

 

01. Foundation 3

  响应式设计(Responsive Design)似乎瞬间就发展起来了,各个网页设计的论坛或者社区都会讨论这个话题,大家都想知道如何实现响应式设计,有什么框架或好的解决方案。

  Foundation 3,由 ZURB 公司开发,号称世界上最先进的响应式前端框架。利用灵活的网格系统可以快速设计出页面布局。更妙的是,网格可以是你所需要的任何尺寸,它很容易适应各种尺寸的屏幕。

 

Foundation 3 makes great claims and even lives up to some of them

 

02. Proto.io

  Proto.io 是一个新的界面原型设计工具,专门针对移动应用程序。基于 Web 的在线环境,可以让你制作流行的 iPhone,iPad,Android 手机或平板电脑,以及任何带有屏幕界面的设备的原型项目。

  在设计了一些界面后,你通常会期望能够把页面交互性的链接起来,Proto.io 做到了这一点。它也支持所有你可能想到的触摸手势,以及幻灯片、翻转和淡入淡出动画,使用简单,而且可以免费使用。

 

Thanks to Proto.io that game is going to be a smash, probably

 

03. Fontello

  为什么这么难找到一组涵盖所有的基础功能的外观一致的图标?

  不用再困惑了,Fontello 不仅拥有所有你需要的图标,而且你可以挑选并选择你所需要的字形,并编译成自己需要的一套。 当然,您也可以从 GitHub 下载整个的图标集。该项目是开源的,糕富帅们捐几刀吧,不胜感激。

 

Fontello allows you to pick and choose your icon sets from its collections

 

04. Bugherd

  与普遍的看法相反,推出一个新的网站对于开发团队来说工作还远远没有结束。

  BugHerd 提供了一个整洁,组织良好的方式来处理反馈,Bug 修复和功能要求。不需要繁杂的电子邮件反馈方式,只需要在网站中包含一个简单的 JavaScript 文件,该网站的访问者就可以通过反馈按钮提交意见和建议。BugHerd 提供了一个友好,直观的界面来管理整个事情。

 

Adding tasks is super-easy with BugHerd

 

05. Sencha Touch 2

  毫无疑问,移动触屏设备的流行给 Web 开发带来了巨大的影响。

  Sencha Touch 是一个基于 HTML5 的移动应用开发框架,致力于吸引 HTML5 开发者使用 Sencha Touch 构建在 iPhone、Android 和 BlackBerry 等设备上运行的移动 Web 应用,这些应用效果看起来如同本地应用。改进的 API,完善的文档和教程资料以及可靠的本地集成让 Sencha Touch 2 成为强有力的移动框架竞争者。

 

 

06. Dreamweaver CS6

  Dreamweaver 是经典的网页制作软件,最新发布的 Dreamweaver CS6 新增了 HTML5CSS3 编码支持;jQuery 移动和 Adobe PhoneGap 框架的扩展支持可协助您为各种屏幕、手机和平板电脑建立项目;集成了 Adobe Business Catalyst、FTPS、FTPeS 支持、Adobe Creative Suite、Adobe BrowserLab等众多功能。

 

Even with all the bells and whistles Dreamweaver CS6 has a certain poise

 

07. Cloud9 IDE

  Cloud 9 是基于 NodeJS 构建的在线集成开发环境,语法高亮支持 C#, C++, Python, Perl, Ruby, Scala 等等众多常用开发语言。

  内置的 Vim 模式非常好用,支持流行的版本控制系统,像 Git, Mercurial 和 SVN,另外它还有非常强大的插件系统,可以拓展其功能,例如借助 CSSLint 和 JSBeautify,Cloud9 就可以变成一款非常实用的代码美化工具。

 

Cloud9 gives you and your cohorts with a unified, code anywhere environment

 

08. Adobe Edge Inspect

  Edge Inspect 是一款对移动开发者非常有用的工具,其前身是 Adobe Shadow,用于帮助设计师和开发者同时在多个移动设备上预览应用设计,发现和解决跨平台问题。

  只需要把你的设备(Android 和 iOS)和你的电脑连接起来,这时候你的网站就会在各个设备上同步显示,让检查和调试变得更有效,并可以让设计师同时看到每个版本在所有目标设备上的显示情况。

 

Edge Inspect just takes a couple of clicks to set up once you have all the downloads - browser, desktop and mobile

 

09. Adobe Brackets

  你可能会觉得现在代码编辑器已经是琳琅满目了,而且这些编辑器都很相似,没有什么可创新的了。Brackets 让我们知道,其实在编辑器领域还是有很多功能可以去探索的。Brackets 是 Adobe 的开源 HTMLCSSJavaScript 集成开发环境。Brackets 提供 Windows 和 OS X 平台支持。

  Brackets 的核心目标是减少在开发过程中那些效率低下的重复性工作,例如浏览器刷新,修改元素的样式,搜索功能等等,Brackets 值得你试试。

 

HTML/CSS/JS Brackets makes them feel newly detailed and responsive

 

10. Modernizr 2.6

  Modernizr 是一个开源的 JavaScript 库,用于检测用户浏览器的 HTML5CSS3 特性。它使得那些基于用户浏览器的不同(指对新标准支持性的差异)而开发不同级别体验的设计师的工作变得更为简单,让 Web 开发人员可以在现代浏览器中充分利用 HTML5CSS3 的那些先进的特性进行开发,同时又不会牺牲其它不支持这些新技术的浏览器的控制。

 

Front end development tool with a serious pedigree

 

  未完待续,2012年度最佳 Web 前端开发工具和框架《下篇》即将推出,敬请期待 :) 

您可能感兴趣的相关文章

 

本文链接:2012年度新发布的最佳 Web 前端开发工具和框架

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

作者:山边小溪
主站:yyyweb.com 记住啦:)
欢迎任何形式的转载,但请务必注明出处。

相关文章
|
10天前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端框架的比较
【4月更文挑战第9天】在移动设备和多样屏幕尺寸盛行的时代,构建能够适应不同视口的响应式Web界面变得至关重要。本文深入探讨了几种流行的前端框架——Bootstrap、Foundation和Tailwind CSS,分析它们在创建响应式设计中的优势与局限。通过对比这些框架的栅格系统、组件库和定制化能力,开发者可以更好地理解如何选择合适的工具来优化前端开发流程,并最终实现高性能、跨平台兼容的用户界面。
|
10天前
|
前端开发 JavaScript 关系型数据库
从前端到后端:构建现代化Web应用的技术探索
在当今互联网时代,Web应用的开发已成为了各行各业不可或缺的一部分。从前端到后端,这篇文章将带你深入探索如何构建现代化的Web应用。我们将介绍多种技术,包括前端开发、后端开发以及各种编程语言(如Java、Python、C、PHP、Go)和数据库,帮助你了解如何利用这些技术构建出高效、安全和可扩展的Web应用。
|
11天前
|
编解码 前端开发 JavaScript
Web 前端开发中的最佳实践
本文将介绍 Web 前端开发中的最佳实践,包括代码组织、性能优化、响应式设计和用户体验等方面。通过遵循这些实践,开发人员可以提高开发效率,优化用户体验,并减少潜在的问题和错误。
|
10天前
|
安全 数据库 C++
Python Web框架比较:Django vs Flask vs Pyramid
【4月更文挑战第9天】本文对比了Python三大Web框架Django、Flask和Pyramid。Django功能全面,适合快速开发,但学习曲线较陡;Flask轻量灵活,易于入门,但默认配置简单,需自行添加功能;Pyramid兼顾灵活性和可扩展性,适合不同规模项目,但社区及资源相对较少。选择框架应考虑项目需求和开发者偏好。
|
4天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
14 1
|
4天前
|
前端开发 数据挖掘 API
使用Python中的Flask框架进行Web应用开发
【4月更文挑战第15天】在Python的Web开发领域,Flask是一个备受欢迎的轻量级Web框架。它简洁、灵活且易于扩展,使得开发者能够快速地构建出高质量的Web应用。本文将深入探讨Flask框架的核心特性、使用方法以及在实际开发中的应用。
|
4天前
|
前端开发 JavaScript vr&ar
前端新技术探索:WebAssembly、Web Components与WebVR/AR
【4月更文挑战第12天】WebAssembly、Web Components和WebVR/AR正重塑Web应用的未来。WebAssembly允许C/C++等语言在Web上高效运行,提供接近原生的性能,如游戏引擎。Web Components通过Custom Elements和Shadow DOM实现可复用的自定义UI组件,提升模块化开发。WebVR/AR(现WebXR)则让VR/AR体验无需额外应用,直接在浏览器中实现。掌握这些技术对前端开发者至关重要。
13 3
|
7天前
|
前端开发 JavaScript 搜索推荐
CSS框架是前端开发中不可或缺的工具
【4月更文挑战第12天】CSS框架是前端开发中不可或缺的工具
17 2
|
15天前
|
资源调度 JavaScript 安全
Linux系统之部署web-check网站分析工具
【4月更文挑战第3天】Linux系统之部署web-check网站分析工具
63 9
|
16天前
|
前端开发 安全 Java
使用Java Web框架:Spring MVC的全面指南
【4月更文挑战第3天】Spring MVC是Spring框架的一部分,用于构建高效、模块化的Web应用。它基于MVC模式,支持多种视图技术。核心概念包括DispatcherServlet(前端控制器)、HandlerMapping(请求映射)、Controller(处理请求)、ViewResolver(视图解析)和ModelAndView(模型和视图容器)。开发流程涉及配置DispatcherServlet、定义Controller、创建View、处理数据、绑定模型和异常处理。
使用Java Web框架:Spring MVC的全面指南