前端开发相关汇总

Posted 2021-01-15

简介

前端发展迅速，开发者富有的创造力不断的给前端生态注入新生命，各种库/框架/工程化构建工具层出不穷，眼花缭乱，不盲目追求前沿技术，学习框架和库在满足自己开发需求的基础上，然后最好可以对源码进行调研，了解和深入实现原理，从中可以获得更多的收获

随着前端发展，前端的职责也跟着变化，不再仅仅是设计稿切图+JS实现交互，已经可以涉猎到后端，微信小程序，原生APP等领域，大前端，全栈开发，小程序开发，前端架构师，带来了更多岗位选择的同时，也是对自身技术一种挑战

【前端汇总】这里会对前端相关技术教程，开源框架，库，工具等相关资源，进行分类记录，持续更新，通过记录共享可以方便大家找到想要资源

---

IDE

• vscode 推荐
• sublime

---

LESS

• less css 预处理语言

---

SASS

• sass 成熟、稳定、强大的 css 扩展语言

---

javascript

• 前端资源教程 i5ting
• 廖雪峰JavaScript教程
• JavaScript 标准参考教程（alpha） -阮一峰
• JavaScript Promise迷你书 -azu
• 前端的异步解决方案之Promise和Await Async
• You Don‘t Know JS (book series)
• You Don‘t Need jQuery jQuery API 替代的方法
• JavaScript ×××
• JavaScript 设计模式 系列 AlloyTeam

---

ES2015(ES6)

• 《ECMAScript 6入门》 -阮一峰
• EcmaScript6 全规范（含node） -ouvens
• 30分钟掌握ES6/ES2015核心内容（上）
• 30分钟掌握ES6/ES2015核心内容（下）

---

TypeScript

• TypeScript语法

---

NodeJS

• 七天学会NodeJS -Nanqiao Deng
• Node入门到精通 i5ting
• 高可用架构专用《全栈工程师之路-Node.js》 i5ting
• 前后端分离的思考与实践

---

Babel

• babel 入门教程

---

Bower

• 基础教程

---

Yeoman

• yeoman 安装和使用 - 快速构建web应用

---

Gulp

• Gulp学习总结
• Gulp不完全入门教程

---

Grunt

• 用grunt搭建自动化的web前端开发环境-完整教程

---

Webpack

• Webpack 官网
• Webpack 中文指南 -赵达
• Webpack，101入门体验 -Yika
• Webpack 入门指迷 -题叶

---

Parcel

• 官方教程 Web应用打包工具，不需要任何配置

---

Vue

• vue2.0官方教程
• vue2.0 探索之路 生命周期和钩子函数的一些理解

---

React

• react教程 中文版

---

AngularJS

• AngularJS入门教程
• AngularJS 菜鸟教程

---

微信小程序

• wepy 让小程序支持组件化开发的框架 微信官方框架
• iview-weapp 一套高质量的微信小程序 UI 组件库
• vant-weapp 赞移动端组件库 Vant 的小程序版本
• minui 基于规范的小程序 UI 组件库，自定义标签组件，简洁、易用、工具化
• wux-weapp 微信小程序自定义 UI 组件
• taro 支持用 React 的开发方式编写一次代码，生成能运行在微信小程序、H5、React Native 等的应用

---

测试

• Mock.js 生成随机数据，拦截 Ajax 请求
• 测试框架 Mocha 实例教程 阮一峰

---

模块化

• CommonJS 规范 阮一峰

---

Git

• Git教程

---

GitBook

• Gitbook 国外的在线markdown可编辑成书

---

常用前端插件

1.图片：

• zooming 图片缩放插件
• viewer 图像查看器

2.富文本编辑器：

• kindeditor
• ueditor

3.日期插件：

• bootstrap-datepicker

4.表单验证库：

• jquery-validate 基于jquery
• 15个最佳的 JavaScript 表单验证库

5.图表：

• echart 百度开源
• chartjs
• highcharts 商用收费

6.特效：

• swiper 滑动特效插件，内容触摸滑动
• impress.js 幻灯片，前端装X利器
• parallax 视觉差特效引擎
• fullPage 全屏滚动特效 jquery

7.各种功能：

• layer 弹窗（层）解决方案
• clipboard.js 复制,黏贴
• draggable 拖拽
• json editor json转表单编辑

---

前端UI框架

• Element UI 基于vue2.0
• Vant 轻量、可靠的移动端 Vue 组件库
• Bootstrap 当前最新到V4
• Layui UI组件
• WeUI 为微信Web 服务量身设计

---

其他

• iconfont [矢量图标] 阿里云矢量图标库，可以在平台里构建自己的图标库

---

博客搭建

• Hugo[Go] 静态网站生成器，托管第三方git平台 Pages
• Hexo[nodejs] 可托管第三方git平台 Pages
• Ghost [nodejs]
• jekyll 可托管第三方git平台 Pages
• WordPress 需要服务器环境

---

Windows开发必备神器

• Cmder 一款超好用的工具cmder
• Scoop 软件包管理系统，像 Mac 上的 Homebrew， Chocolatey，Homebrew-Cask
• Chocolatey 像一个软件包管理工具（背后使用 Nuget ）

---

首发博客