web前端页面开发工具的演进史

小编是一位有着6年前端开发经验的web前端开发工程师，今天小编从个人的视角来聊一聊web前端开发工具的演进史。

小编第一次接触 web前端开发是在2011年，那会还在上高中。当时正是大家都每天忙碌着装扮自己的QQ空间。那时的web前端布局还是以 `<table>` 布局为主要基调的年代，有着“网页三剑客”美誉之一的 `Dreamweaver` 此时还是前端开发工具的香饽饽，是集网页制作和管理网站于一身的所见即所得网页代码编辑器。通过菜单和属性面板能快速的实现页面的布局。

随着 `JavaScript` 技术在web前端领域的大放异彩，`<table>` 布局也渐渐被更受欢迎的 `<div> + css` 布局所取代。人们逐渐觉得 `Dreamweaver` 并不适合当下的前端开发。此时大家发觉 `Sublime Text` 是一个不错的选择，它具有漂亮的用户界面和强大的功能。支持多种编程语言的语法高亮、拥有优秀的代码自动完成功能，还拥有代码片段的功能，可以将常用的代码片段保存起来，在需要时随时调用。

在被 `Sublime Text` 为主要开发工具的统治了许久后，广大的web前端开发者们又想拥有像 `IntelliJ IDEA` 一样优秀的IDE工具。就在2017年拥有着同`IntelliJ IDEA`一样血统的Web前端开发神器 `WebStorm` 出现了。它功能的强大是其它开发工具完全不能比肩的，获得过“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等诸多荣誉。

国内的 Dcloud 公司推出过 `Hbuilder` 后来中国的移动互联网时代逐渐变成了“小程序时代”，各家小程序层出不穷，让前端开发者们的工作量井喷式增长。随后在 2019 年 Dcloud 公司又推出了更强大，支持多端开发的 `HbuilderX`。

直至今日 `WebStorm` 的光环依旧耀眼，`HbuilderX` 也在开发者们的心中扎根了。

人类都有懒惰的基因，重复的劳动，无休止的编码终究得不到解脱，想拥有一个“无码”的开发工具。早在 2014 年就诞生过 “低代码平台” 的概念，国内许多企业也在如火如荼的建造着这个美好的“无码世界”，随之涌现出了一批的低代码平台的服务商。

结果是低代码平台的实际使用情况并不乐观，总结的缺点有以下几点：

1. 使用门槛高，低代码开发仍需要编写代码，开发者必须具备数据库和代码编写的专业知识。

2. 业务流程只能随着组件改变。组件的功能和种类，限制了应用程序的开发，无法满足有特色的需求。

3. 低代码开发的新程序对企业原有的旧软件的集成受限。

4. 低代码开发工具交给普通开发人员使用，意味着企业冒着一定的风险。

低代码平台有着以上4个无法解决的痛点，开发这件事又重新回到了“程序开发工程师”的身上。国内的低代码平台也一直是这种不温不火的状态，广大开发者们的内心也止不住的骚动，想在开发效率和良好的扩展性上找到出口。

2021年小编偶然的机会进到了一个微信群，了解到  codeFun。听说这玩意可以把UI设计稿还原成前端页面，瞬间觉得这货牛B坏了。于是乎小编利用上班(摸鱼)时间体验的一把。

 codeFun初体验总结

codeFun是UI设计稿智能⽣成源代码解决⽅案，域名https://code.fun。codeFun的核⼼能⼒是UI 设计稿⼀键⽣成源代码，能让传统研发流程的8小时基于codeFun流程在10分钟完成。能实际的解决研发成本、交付速度、产品质量问题，可谓是甲⽅、CEO、CTO、项⽬经理的福音，更是前端开发者的摸鱼神器！

codeFun使用优点总结

1. 支持框架多：Vue、React、微信小程序、HTML5、uni-app、Taro 这些 web前端常用的框架都基本覆盖了。

2. 支持的平台多：借助 uni-app、Taro 这类优秀的跨平台解决方案，能轻松实现跨平台应用的需求。

3. UI还原度高，这个是非常重要的功能啦，大家也可以前往 https://code.fun 亲身体验。

4. 生成页面的代码有语义化，这对于后期的维护来说是无比重要的，缺少语义化的代码，就如同修改“前同事”留下的无注释代码一样痛苦。

体验效果图