学习啦——学设计>网页设计>网站建设>网站开发工具>

网站前端开发工具

宇民分享

  在过去的几年间,涌现出了很多Web开发工具,它们大多还是比较吸引人的,方便了我们的工作。下面由学习啦小编为大家整理的前端开发工具,希望大家喜欢!

  前端开发工具

  1. Codepen

  Codepen应该是全世界最受欢迎的开发环境之一了。CSS技巧的作者Chris Coyier是Codepen的联合创始人之一,这也就是为什么这款app看起来那么豪华。除了视觉上的优秀效果,它可以生动地展现预览,当你修改了代码,就可以看到效果,使你能够更容易地找出变化。

  Codepen用于CSS的预处理器包括SCSS、SASS,LESS和Stylus,用于JS的有CoffeeScript和LiveScript,用于HTML的包括Haml、Markdown、Slim和Jade。另外,它还包含了8个可用的内置的JS库。Codepen中合作和私人的“pens”需要付费使用。

  2. JSFiddle

  JSFiddle可以说是成就了开发环境的流行,它是第一个也是最出名的平台。JSFiddle有超过30个可以立即使用的JavaScript库,你还可以轻松的添加外部文件。在预处理方面,它有用于CSS的SCSS、用于JS的CoffeeScript以及用于HTML的简单Vanilla。

  如果你在与其他开发者合作,我强烈建议你使用JSFiddle。在所有的开发环境中,JSFiddle的协作特性是同类型应用中最好的,而且区别于Codepen的是,它的这个特性是操作简单并且免费的。

  但JSFiddle没有的是预览功能,你需要手动刷新页面。和其它开发平台相比,JSFiddle确实也比较慢。另外,JSFiddle还有一个不足就是它的执行键不是很灵敏,有时需要多点击几次才能够执行代码。

  3. JS Bin

  JS Bin是由JavaScript开发大师Remy Sharp创建的,他拥有一家专注于JavaScript和HTML5的web开发公司。JS Bin的JS预处理器包括CoffeeScript、TypeScript、Traceur、JSX以及可供使用的超过40个的JS库。你同样可以添加外部文件,但是必须在编辑器上手动操作。而用于CSS的预处理器,它提供了LESS。

  JS Bin和以前开发平台的区别在于它允许你把文件下载到你的电脑上,这对于开发者,尤其是在离线状态下调试代码的程序员来说,是一个很不错的特点。你还可以创建私人的Bin空间,不过你需要对此付费。另外,JS Bin不支持协作功能。

  4. CSSDeck

  CSSDeck已经存在一些年了,但它的影响力好像不是很大。不过,由于它的简洁性,它还是值得关注的。如果你不需要其它平台里那些复杂的功能,那CSSDeck就应该是你的选择。

  CSSDeck的预处理器包括用于HTML的HAML、Markdown、Slim和Jade,用于CSS的LESS、Stylus、SASS和SCSS,以及用于JS的CoffeeScript。它还有几个可用的CSS和javascript库,对于没有的库,你只需要将其手动地添加到库的列表中就可以使用了。

  CSSDeck虽然很简洁,但它有一个让我很吃惊的特性,就是它支持用户改变字体大小,这是一个简单却实用的功能。所以说,如果你在寻找有很多很炫的功能的开发平台,CSSDeck可能不适合你。它的简洁性让你更专注于最重要的事情,这也是它最大的特点。

  5. Dabblet

  当我还在使用十六进制颜色代码的时候,Dabblet的特性让我惊讶了,它的颜色预览居然显示在代码旁,这是我第一次见到这样的设置。虽然我不确定这是否是一个有用的特性,但是它的整洁性还是给我留下了很深的印象。

  现在,Dabblet最棒的地方在于它允许用户以5个不同的视角进行预览,分别是CSS编辑器和效果,HTML编辑器和效果,CSS和HTML的编辑器和效果,JavaScript及运行结果,全部综合效果。这些功能在绝大部分的开发环境中都没有。

  它也有不足,第一,Dabblet缺乏HTML和CSS的预处理器,这是令人困惑的。第二,它没有内置的JavaScript库,不过你可以通过手动插入JavaScript库来解决。第三,它的每个板块大小是固定的,无法作出调整,这和以前传统的调试平台是一样的。第四,它缺少一个用于演示其他用户作品的板块。

  6. Liveweave

  Liveweave是一个拥有很多功能的开发平台,比如可以关闭的实时预览。你也可以为了保护视力,开启夜间模式,将所有界面都变暗。Liveweave提供了20多个JavaScript库,甚至还支持SVG。其内置的标尺使测量更加精确,更符合美学标准。

  数据库前端开发工具

  MySQL:MySQL是一种关联数据库管理系统,关联数据库将数据保存在不同的表中,而不是将所有数据放在一个大仓库内,这样就增加了速度并提高了灵活性。

  MariaDB:MariaDB数据库管理系统是MySQL的一个分支,主要由开源社区在维护,采用GPL授权许可 MariaDB的目的是完全兼容MySQL,包括API和命令行,使之能轻松成为MySQL的代替品。

  MongoDB:MongoDB 教程 MongoDB 是一个基于分布式文件存储的数据库。由 C++ 语言编写。旨在为 WEB 应用提供可扩展的高性能数据存储解决方案。

  Redis:Redis是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库,并提供多种语言的API。

  PostgreSQL:ostgreSQL支持大部分 SQL标准并且提供了许多其他现代特性:复杂查询、外键、触发器、视图、事务完整性、MVCC。

  CSS前端开发工具

  Sass: Sass是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。

  Less:Lesscss是一种动态样式语言,属于CSS预处理语言的一种,它使用类似CSS的语法,为CSS的赋予了动态语言的特性,如变量、继承、运算、函数等,更方便CSS的编写和维护。

  Stylus:Stylus 是一个CSS的预处理框架,2010年产生,来自Node.js社区,主要用来给Node项目进行CSS预处理支持,所以Stylus 是一种新型语言,可以创建健壮的、动态的、富有表现力的CSS。