GitHub精选资源
# 综合资源
# javascript (opens new window)（Star：108k）
airbnb 出品写 js 最佳的姿势，已成众多公司 js 代码风格的标准
# awesome-wechat-weapp (opens new window)（Star：34.9k）
微信小程序开发资源汇总 💯
# gold-miner (opens new window)（Star：28.8k）
🥇 掘金翻译计划，可能是世界最大最好的英译中技术社区，最懂读者和译者的翻译平台
# Blog (opens new window)（Star：22.7k）
冴羽写博客的地方，预计写四个系列：JavaScript 深入系列、JavaScript 专题系列、ES6 系列、React 系列
# mars (opens new window)（Star：15.4k）
腾讯移动 web 前端知识库
# Besr-App (opens new window)（Star：14.9k）
收集&推荐优秀的 Apps/硬件/技巧/周边等
# Awsome-Front-End-learning-resource (opens new window)（Star：7.4k）
GitHub 最全的前端资源汇总仓库（包括前端学习、开发资源、求职面试等）
- github 仓库地址：https://github.com/helloqingfeng/Awsome-Front-End-learning-resource (opens new window)
- 线上地址：https://helloqingfeng.github.io/front-end-index/index.html (opens new window)
# front-end-collect (opens new window)（Star：5.3k）
作者分享自己长期关注的前端开发相关的优秀网站、博客、以及活跃开发者
# Front-end-tutorial (opens new window)（Star：4.4k）
最全的资源教程-前端涉及的所有知识体系
# mobile-web-favorites (opens new window)（Star：1.7k）
移动端 H5 开发经验、资源、以及踩坑汇总
# 面试相关
# fe-interview (opens new window) （Star：17.5k）
前端面试每日 3+1，以面试题来驱动学习，提倡每日学习与思考，每天进步一点！
# CS-Interview-Knowledge-Map (opens new window)（Star：17k）
一份前端面试资源，作者很用心，还配有专门的网页
- github 仓库地址：https://github.com/InterviewMap/CS-Interview-Knowledge-Map (opens new window)
- 线上地址：https://yuchengkai.cn/home/ (opens new window)
# 样式/UI/css
# Semantic-UI (opens new window)（Star：49.2k）
让你使用任何 html 标签来表现 UI 控件，这是一款语义化设计的前端框架，为攻城师而制作的可复用的开源前端框架
- github 仓库地址：https://github.com/Semantic-Org/Semantic-UI (opens new window)
- 线上文档地址：https://semantic-ui.com/ (opens new window)
# normalize.css (opens new window)（Star：43.5k）
一个可定制的 css 文件，使浏览器呈现的所有元素，更一致和符合现代标准。支持 IE8+
# materialize (opens new window)（Star：38.5k）
materialize 是 material design 一套轻量级的纯 CSS 框架。material design 是 Goole 提出的一套 UI 设计方案，并应 Goole 用于所有产品中
- github 仓库地址：https://github.com/Dogfalo/materialize (opens new window)
- 线上文档地址：https://materializecss.com/ (opens new window)
# weui (opens new window)（Star：25.6k）
为微信 web 服务量身设计的一套 ui 框架
- github 仓库地址：https://github.com/Tencent/weui/blob/master/README_cn.md (opens new window)
- 演示地址：https://weui.io/ (opens new window)
# pure (opens new window)（Star：21.6k）
一组很小的，响应式的 css 组件，你可以在网页的项目上到处使用
- github 仓库地址：https://github.com/pure-css/pure (opens new window)
- 线上文档地址：https://purecss.io/ (opens new window)
# uikit (opens new window)（Star：16.8k）
一个轻量级的、模块化前端框架，它被用于快速开发强大的 web 界面。也是一款优秀的响应式 html5 框架
- github 仓库地址：https://github.com/uikit/uikit (opens new window)
- 线上文档地址：https://getuikit.com/ (opens new window)
# iCSS (opens new window)（Star：9.8k）
一系列 css 有趣的话题，有开发中常用 css 代码；CSS 奇技淫巧，在这里，都有
- github 仓库地址：https://github.com/chokcoco/iCSS (opens new window)
- 作者博客地址：https://www.cnblogs.com/coco1s/ (opens new window)
# css-doodle (opens new window)（Star：3.5k）
一个用 css 绘制图形的 web 组件
- github 仓库地址：https://github.com/css-doodle/css-doodle (opens new window)
- 线上地址：https://css-doodle.com/ (opens new window)
# 构建工具/预编译
# TypeScript (opens new window)（Star：70.5k）
有类型的 js 预编译语言，非常强大的预编译与代码报错提示，赋予了 JS 构建大型项目的可能
- github 仓库地址：https://github.com/microsoft/TypeScript (opens new window)
- 线上文档地址：https://www.typescriptlang.org/zh/ (opens new window)
# webpack (opens new window)（Star：58.1k）
一个模块打包工具，你可以使用 webpack 管理你的模块依赖，并编绎输出模块们所需的静态文件
- github 仓库地址：https://github.com/webpack/webpack (opens new window)
- 线上文档地址：
# babel (opens new window)（Star：38.9k）
是一款为了写下一代 js 的编译器，无需等待浏览器支持就可以使用各种 ES6，ES7 新的语法
- github 仓库地址：https://github.com/babel/babel (opens new window)
- 线上文档地址：https://babel.dev/ (opens new window)
# parcel (opens new window)（Star：38k）
一个零配置的新一代前端构建工具，识别各种常用类型文件，最优加载模块，代码拆包等，非常值得尝试的一款打包工具
- github 仓库地址：https://github.com/parcel-bundler/parcel (opens new window)
- 线上文档地址：https://parceljs.org/ (opens new window)
# gulp (opens new window)（Star：32.2k）
基于 node.js 流构建系统，只有原生几个 api，和庞大的插件生态，使用非常简单
- github 仓库地址：https://github.com/gulpjs/gulp (opens new window)
- 线上文档地址：https://gulpjs.com/ (opens new window)
# postcss (opens new window)（Star：24.5k）
用 js 插件来对 css 样式文件，进行转换、预编译等操作，并且实现了模块化，支持非常多插架
- github 仓库地址：https://github.com/postcss/postcss (opens new window)
- 线上文档地址：https://postcss.org/ (opens new window)
# less.js (opens new window)（Star：16.6k）
轻量级的，动态 CSS 预编语言，具有 CSS 所有特性，并提供了动态编程方式编写 CSS 代码。也是各大 UI 框架所选用的样式语言，比如 bootstrap,ant design 等
- github 仓库地址：https://github.com/less/less.js (opens new window)
- 线上文档地址：https://lesscss.org/ (opens new window)
# stylus (opens new window)（Star：10.7k）
富有表现力的，健壮的 css 预编译语言, 除了代码简洁，可读性强外，函数功能非常强大，可与 js 混合使用，实现动态 css 编程
- github 仓库地址：https://github.com/stylus/stylus (opens new window)
- 线上文档地址：https://stylus-lang.com/ (opens new window)
# node-sass (opens new window)（Star：7.7k）
动态 CSS 预编语言, 并有拥有强大 sass compass 的生态圈，可以直接引入并使用，sass 是由 ruby 编写的，node-sass 是 node 重构版本，方便 npm 直接使用 富有表现力的，健壮的 css 预编译语言, 除了代码简洁，可读性强外，函数功能非常强大，可与 js 混合使用，实现动态 css 编程
- github 仓库地址：https://github.com/sass/node-sass (opens new window)
- npm 地址：https://www.npmjs.com/package/node-sass (opens new window)
# canvas/数据可视化
# d3 (opens new window)（Star：96.7k）
一个基于数据操作文档的 js 数据可视化框架，最流行的数据可视化库之一
- github 仓库地址：https://github.com/d3/d3 (opens new window)
- 线上文档地址：https://d3js.org/ (opens new window)
# Chart.js (opens new window)（Star：53.4k）
使用 canvas 标签的简易 html5 图表
- github 仓库地址：https://github.com/chartjs/Chart.js (opens new window)
- 线上文档地址：https://www.chartjs.org/ (opens new window)
# echarts (opens new window)（Star：46.2k）
基于 canvas 的纯 js 图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表
- github 仓库地址：https://github.com/apache/echarts (opens new window)
- 线上文档地址：https://echarts.apache.org/zh/index.html (opens new window)
# G2 (opens new window)（Star：10.6k）
是一套基于可视化编码的图形语法，以数据驱动，具有高度的易用性和扩展性，可定制的颗粒度极细，相比项目 echart 大而全且易用的图表库，这个库会让你有不一样的体验，且官方提供了 g2-react 的 react 封装包
- github 仓库地址：https://github.com/antvis/G2 (opens new window)
- 线上文档地址：https://g2.antv.vision/zh (opens new window)
# highcharts (opens new window)（Star：10k）
基于 svg 的 javascript 图表框架
- github 仓库地址：https://github.com/highcharts/highcharts (opens new window)
- 线上文档地址：https://www.highcharts.com/ (opens new window)
# c3 (opens new window)（Star：9.1k）
一个基于 d3.js 的可重用 javascript 图表库，几乎零学习曲线
- github 仓库地址：https://github.com/c3js/c3 (opens new window)
- 线上文档地址：https://c3js.org/ (opens new window)
# G6 (opens new window)（Star：7.8k）
是一个由纯 JavaScript 编写的关系图基础技术框架。开发者能基于 G6 进行关系图的分析视图和编辑视图进行快速的二次开发
- github 仓库地址：https://github.com/antvis/G6 (opens new window)
- 线上文档地址：https://g6.antv.vision/zh (opens new window)
# zrender (opens new window)（Star：4.8k）
一个轻量级的 canvas 类库，mvc 封装，数据驱动，提供类 dom 事件模型，让 canvas 绘图大有不同
- github 仓库地址：https://github.com/ecomfe/zrender (opens new window)
- 线上文档地址：https://ecomfe.github.io/zrender-doc/public/ (opens new window)
# 动画
# animate.css (opens new window)（Star：69.9k）
一个跨浏览器的 css 动画库，实现了多种 css3 动画效果，简单易用易上手
- github 仓库地址：https://github.com/animate-css/animate.css (opens new window)
- 线上文档地址：https://animate.style/ (opens new window)
# anime (opens new window)（Star：39.1k）
极小的 js 动画引擎，支持 css3、svg 的动画效果，能编写出各种复杂动画效果，gzip 后 6K 左右
- github 仓库地址：https://github.com/juliangarnier/anime (opens new window)
- 线上文档地址：https://animejs.com/ (opens new window)
# 插件
# fullPage.js (opens new window)（Star：32.1k）
pc 端的全屏滚动插件
- github 仓库地址：https://github.com/alvarotrigo/fullPage.js (opens new window)
- 线上文档地址：https://alvarotrigo.com/fullPage/zh/ (opens new window)
# video.js (opens new window)（Star：31.3k）
开源的 html5 和 flash 视频播放器，支持自定义进度条、按钮以及工具栏的底色
# awesome-browser-extensions-for-github (opens new window)（Star：2.1k）
收集关于 github 上优秀的浏览器插件，非常实用
- github 地址：https://github.com/stefanbuck/awesome-browser-extensions-for-github (opens new window)
- 线上地址：https://stefanbuck.com/awesome-browser-extensions-for-github (opens new window)
# front-end-plugins (opens new window) （Star：956）
前端常用插件汇总
# 框架、库和组件
# three.js (opens new window)（Star：70.3k）
是 js 编写的 webgl 第三方库，提供了非常多的 3D 显示功能
- github 仓库地址：https://github.com/mrdoob/three.js (opens new window)
- 线上地址：https://threejs.org/ (opens new window)
# reveal.js (opens new window)（Star：56.2k）
基于 css3 的 3D 幻灯片工具，能够制作绚丽的演示文稿并生成 html 格式，将它发布到 web 上
- github 地址：https://github.com/hakimel/reveal.js (opens new window)
- 线上地址：https://revealjs.com/ (opens new window)
# impress.js (opens new window)（Star：36.3k）
创建令人兴奋的演示。使用 css3 的转换和过渡，这个库允许你创建令人印象深刻的演示文稿
# highlight.js (opens new window)（Star：18.4k）
js 语法高亮，既可以运行在浏览器端也可以运行在服务端
# ice(飞冰) (opens new window)（Star：16.3k）
阿里飞冰，从此再也不担心管理系统的开发。(简单项目还是可以，复杂的做不了)
- github 仓库地址：https://github.com/alibaba/ice (opens new window)
- 线上文档地址：https://ice.work/ (opens new window)
# ScrollMagic (opens new window)（Star：13.1k）
一款非常赞的滚动交互的 js 插件，可用于官网与宣传广告场景
# nodePPT (opens new window)（Star：9.3k）
使用 nodejs 写的网络幻灯片，可能是迄今为止最好的网页版 ppt
- github 地址：https://github.com/ksky521/nodeppt (opens new window)
- 演示地址：https://nodeppt.js.org/#slide=1 (opens new window)
# webuploader (opens new window)（Star：7.5k）
一个简单的以 html5 为主，flash 为辅的现代文件上传组件。支持大文件分片并发上传，极大的提高了文件上传效率
- github 地址：https://github.com/fex-team/webuploader (opens new window)
- 线上地址：http://fex.baidu.com/webuploader/ (opens new window)
# JavaScript-Load-Image (opens new window)（Star：4.1k）
一个 js 加载和转换图像文件的库