前端开发必备工具

Posted 2021-04-08 切图仔er

面对日益纷杂的前端工具，作为新人常感无从下手。经过一番检索和简单对比，再结合自己的喜好，筛选了将要学习和使用的工具，以适应日益工程化、专业化的 Web 前端开发工作。

库与框架

jQuery: 操作dom的神器，曾经一度火的一塌糊涂。

jQuery UI: 一个JQuery的UI框架,特点是高效、组件化

Vue.js: 数据驱动的组件，为现代化的 Web 界面而生

angularjs 应用最广泛的企业级web开发框架

angular: 新一代angular开发框架

React.js: 构建组化件应用的javascript库

React Native: 使用react构建移动app应用

构建工具&模块化

一个构建、测试应用的构建工具

gulp.js: 自动化工作流

node 建立在V8引擎上的快速构建平台

模块打包器

将模块打包到一个bundle中

webpack: 能够将依赖打包、生成的自动构建工具

包管理

一个用来管理依赖的包管理器，你可以使用它下载很多模块化的工具

npm: Node 模块化管理工具

CSS 处理

提供一个高效、动态的方法生成css

Stylus: node社区的css预处理器

PostCSS: 将css转换成js插件

模块化

ECMAScript 6 Module

模板引擎

使用js生成html文件

EJS

jade

测试框架

Mocha: 一个简单、快速的用来测试node和web应用的测试框架

Chai: Chai 是一个针对 Node.js 和浏览器的行为驱动测试和测试驱动测试的诊断库，可与任何 JavaScript 测试框架集成。

脚手架

Yeoman Web 应用开发流程与工具

koa-generator koa项目生成器

集成方案

FIS: 解决前端开发中自动化工具、性能优化、模块化框架、开发规范、代码部署、开发流程等问题

UI框架

bootstrap 简洁、直观、强悍的UI框架，让web开发更迅速,后端程序的福音。

foundation 最流行的响应式前前端布局框架

semantic-ui Semantic作为一个开发框架，通过HTML语言帮助创建令人赏心悦目、响应式的布局。

Material UI 一组反应元件，实现谷歌的材料设计。

Ant Design 是一个 UI 设计语言，是一套提炼和应用于企业级后台产品的交互语言和视觉体系。

游戏引擎

CreateJS 基于HTML5的一套模块化的库和工具共同工作或独立使丰富的交互式内容的开放式Web技术。

PhaserJS PC端和移动端HTML5游戏框架 。

ThreeJS 制作HTML5的3D游戏引擎 。

白鹭 Egret是一套HTML5游戏开发解决方案

Cocos2d-JS 开发者可以通过cocos游戏开发引擎快速编辑界面和动画、编写和调试代码等，最终导出适合于各平台、各渠道发布的游戏安装包。

容器

Docker: Build, Ship, and Run Any App, Anywhere

社区

stackoverflow 技术大牛多，素质好，质量高

segmentfault 自动生成目录，博客UI看起来相对漂亮，内容质量高

开源中国 支持开源文化

学习网站

极客学院 学习资源多

慕课网 质量高，全免费

花川学院 学习swift的好去处

麦子学院 后起之秀

W3C菜鸟 新手程序员的天堂

云路课堂 极客风

码萌 编程从来简单有趣

其他常用网站

github 程序员的QQ,面试的门面

码云 和马云同名，给个面子

淘宝同步npm 访问快，10分钟同步一次，查资料必备

bootCDN 使用最普遍的CDN

font-awesome 最好用的图标库

JSON格式化 这个时代的开发者谁离得了JSON呢