收录了一些前端工程师需要了解的语言、框架、工具,进行了简单的解释,并收录了官网、Github地址及一些中文学习网站。

语言

HTML

超文本标记语言(HyperText Markup Language)是一种简单的、由不同元素组成的标记语言,它定义了网页内容的含义和结构。最新的标准为 HTML5 。
官网: https://html.spec.whatwg.org/multipage/
Github: https://github.com/whatwg/html

CSS

层叠样式表(Cascading Style Sheets)是一种样式表语言,用来描述 HTML 或 XML(包括如 SVG、MathML、XHTML 之类的 XML 分支语言)文档的呈现。最新的标准为 CSS3 。
官网: https://www.w3.org/Style/CSS/#specs
Github: https://github.com/topics/css

Javascript

JavaScript(又称 ECMAScript)是一种函数优先的、轻量级的、解释型或即时编译型编程语言。当前最被广泛使用的版本为 ES6(也即 ES2015),从2015年(ES2015)开始,每年更新一个版本添加上新的特性。
官网:
http://www.ecma-international.org/publications/standards/Ecma-262.htm
中文学习网站:
https://developer.mozilla.org/zh-CN/docs/JavaScript
https://wangdoc.com/javascript/index.html
http://www.w3school.com.cn/js/
http://www.runoob.com/js/js-tutorial.html
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

TypeScript

TypeScript 是由 Microsoft 开源的编程语言。它是 JavaScript 的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。
官网: http://www.typescriptlang.org
Github: https://github.com/Microsoft/TypeScript
中文学习网站:
https://www.tslang.cn/
https://typescript.bootcss.com/

CoffeeScript

CoffeeScript 是一门将类 Ruby 语言编译到 JavaScript 的小巧编程语言
官网: http://coffeescript.org
Github: https://github.com/jashkenas/coffeescript
中文学习网站: http://coffee-script.org/

PureScript

PureScript 是一款编译为 JavaScript 的强类型编程语言,使用 Haskell 开发。
官网: https://www.purescript.org
Github: https://github.com/purescript/purescript

Elm

Elm 是一款用来开发 web 应用的函数式编程语言,使用 Haskell 开发。
官网: https://elm-lang.org
Github: https://github.com/elm

ReScript

ReScript 是一款强类型的 编程语言,可以编译成高效且可读的JavaScript 代码,使用 OCaml 开发。
官网: https://rescript-lang.org
Github: https://github.com/rescript-lang

Dart

Dart 是一款快速的、针对客户端优化了的跨平台编程语言。由 Google 开发。

官网: https://dart.dev
Github: https://github.com/dart-lang
中文学习网站:
https://www.dartcn.com/
https://dart.cn/

Rust

一款高效高可用的编程语言
官网: https://www.rust-lang.org
Github: https://github.com/rust-lang/rust

框架

React

React 是一个声明性的、高效的、灵活的 JavaScript 框架,用于构建用户界面。由 Facebook 开发。

官网: https://reactjs.org
Github: https://github.com/facebook/react
中文学习网站:
https://www.reactjscn.com/
http://www.runoob.com/react/react-tutorial.html

Redux

一款轻量级的状态管理库,只有2kB。
Github: https://github.com/reduxjs/redux

MobX

一款简单的、可伸缩的状态管理库。
官网: https://mobx.js.org
Github: https://github.com/mobxjs/mobx

zustand

一款小巧快速可扩展的状态管理库。
官网: https://zustand-demo.pmnd.rs
Github: https://github.com/pmndrs/zustand

react-router

一款基于 React 的路由管理库。
Github: https://github.com/remix-run/react-router

redux-saga

一款直观的 Redux 副作用管理器。
官网: https://redux-saga.js.org
Github: https://github.com/redux-saga/redux-saga

create-react-app

React 脚手架工具
官网: https://create-react-app.dev
Github: https://github.com/facebook/create-react-app

SWR

React Hooks 库,专注于数据获取。
官网: https://swr.vercel.app/
Github: https://github.com/vercel/swr

Vue

Vue.js 是一个渐进式的的 JavaScript 框架,用来构建用户界面。由 Evan You(尤雨溪)开发。
常用的 Vue UI 库有 Element UI、Vuetify、iview、Vue Bootstrap、Vue Material、Buefy、Quasar等。
常用的Vue 移动 UI库有 vux、mint-ui、vant等。
cli vue-cli
状态管理库 vuex
前端路由库 vue-router
小程序开发框架 mpvueuni-app
官网: https://cn.vuejs.org/v2/guide/
Github: https://github.com/vuejs/vue
中文学习网站: https://cn.vuejs.org/index.html

vue-router

Vue 的单页面应用路由。
Github: https://github.com/vuejs/vue-router

vuex

Vue 的大规模状态管理库。
Github: https://github.com/vuejs/vuex

vue-cli

Vue 的项目脚手架工具。
Github: https://github.com/vuejs/vue-cli

vue-loader

Vue 的单页面组件文件 webpack loader。
Github: https://github.com/vuejs/vue-loader

Angular

增强 Web 应用程序的HTML框架。由 Google 开发。
官网: https://angularjs.org
Github: https://github.com/angular/angular.js
中文学习网站: https://www.runoob.com/angularjs/angularjs-tutorial.html

Svelte

一款编译型 JavaScript 框架
官网: https://svelte.dev
Github: https://github.com/sveltejs/svelte

kit

Svelte 应用编译工具
官网: https://kit.svelte.dev
Github: https://github.com/sveltejs/kit

Cycle.js

一款函数式的和响应式的 JavaScript 框架
官网: https://cycle.js.org
Github: https://github.com/cyclejs/cyclejs

Alpine.js

Alpine.js 是一款通过扩展HTML属性实现响应式和声明式的 JavaScript 框架
官网: https://alpinejs.dev
Github: https://github.com/alpinejs/alpine

Polymer

Polymer 是一款 web 框架,用来构建可重用的 Web 组件(Web Components)。由 Google 发布,目前已处于维护模式,不再开发新的功能。
官网: https://polymer-library.polymer-project.org
Github: https://github.com/Polymer/polymer

Lit

Lit 是一个轻量级的库,用于构建快速、轻量级的 web 组件。由 Google 发布,属于 Polymer 的替代品。
官网: https://lit.dev
Github: https://github.com/lit/lit

Stencil

Stencil 是一个简单的编译器,用于生成 Web 组件和 生成静态站点的渐进式 Web 应用。
官网: https://stenciljs.com
Github: https://github.com/ionic-team/stencil

Inferno

Inferno 是一款类 React、性能优秀的 JavaScript 框架
官网: https://infernojs.org
Github: https://github.com/infernojs/inferno

Preact

Preact 是一个只有 3kB 大小的 React 替代框架,拥有与 React 相似的 API、组件和虚拟 DOM。
官网: https://preactjs.com
Github: https://github.com/developit/preact
中文学习网站:
https://preactjs.com
https://preact.bootcss.com

Dojo

Dojo 是一款基于 Typescript 开发的前端框架
官网: https://dojo.io
Github: https://github.com/dojo/framework

Ember.js

一款 JavaScript框架
官网: https://emberjs.com
Github: https://github.com/emberjs/ember.js

Mithril

Mithril 是一个小巧的现代化的 JavaScript 框架,用于构建单页面应用.
官网: https://mithril.js.org
Github: https://github.com/MithrilJS/mithril.js
中文学习网站: https://www.mithriljs.net

Aurelia

Aurelia是一款用来构建浏览器移动桌面应用的现代前端 Javascript 框架
官网: https://www.auerlia.io
Github: https://github.com/aurelia/framework

Choo

一款函数式编程框架,只有4kb。
官网: https://choo.io
Github: https://github.com/choojs/choo

San

一款高性能、小体积、高兼容性的 mvvm 框架
官网: https://baidu.github.io/san/
Github: https://github.com/baidu/san

Next.js

基于 React 的服务端渲染 web 应用框架。
官网: https://nextjs.org
Github: https://github.com/zeit/next.js

Nuxt.js

基于 Vue 的服务端渲染 web 应用框架。
官网: https://nuxtjs.org
Github: https://github.com/nuxt/nuxt.js

Remix

全栈 web 应用框架
官网: https://remix.run
Github: https://github.com/remix-run/remix

Astro

采用 Island 架构,适合轻交互重内容的 web 应用框架
官网: https://astro.build
Github: https://github.com/withastro/astro

dva

dva 是一款基于 redux、redux-saga 和 react-router 的轻量级前端框架(受到 Elm 和 Choo 启发)。由 Alibaba 开发。
官网: https://dvajs.com
Github: https://github.com/dvajs/dva

编译构建工具

Webpack

Webpack 是一款前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则转换并打包成符合生产环境部署的前端资源。
官网: https://webpack.js.org
Github: https://github.com/webpack/webpack
中文学习网站: https://www.webpackjs.com/concepts
学习文档:webpack小抄

Rollup

Rollup 是一个 JavaScript 模块打包器,可以将小块代码编译成大块复杂的代码,例如库或应用程序。支持按需打包。
官网: https://rollupjs.org
Github: https://github.com/rollup/rollup
中文学习网站:
http://www.rollupjs.com/

Vite

前端编译构建工具,基于 Rollup。
Github: https://github.com/vitejs/vite

Gulp

JavaScript自动化工作流构建工具,使用流式方法来进行打包。
官网: https://gulpjs.com
Github: https://github.com/gulpjs/gulp
中文学习网站: https://www.gulpjs.com.cn

Grunt

JavaScript任务自动化构建工具,通过配置来进行打包。
官网: https://gruntjs.com
Github: https://github.com/gruntjs/grunt
中文学习网站: http://www.gruntjs.net

Parcel

Parcel 是一个 web 应用打包工具, 与其它工具的区别在于开发者的使用体验。它利用多核处理器提供了极快的速度, 并且不需要任何配置。采用模块化的思想进行打包。
官网: https://parceljs.org
Github: https://github.com/parcel-bundler/parcel
中文学习网站:
https://www.parceljs.cn/getting_started.html
http://www.css88.com/doc/parcel/
http://www.parceljs.io

esbuild

一款高性能的 Javascript 打包工具,采用 go 编写。
官网: https://esbuild.github.io
Github: https://github.com/evanw/esbuild

工具库

jQuery

jQuery 是一个高效、精简并且功能丰富的 JavaScript 工具库。它提供的 API 易于使用且兼容众多浏览器,这让诸如 HTML 文档遍历和操作、事件处理、动画和 Ajax 操作更加简单。
官网: https://jquery.com
Github: https://github.com/jquery/jquery
中文学习文档: https://www.jquery123.com

Zepto

Zepto 是一个轻量级的、针对现代高级浏览器的JavaScript 工具库,它兼容 jQuery 的 API 。
官网: http://zeptojs.com
Github: https://github.com/madrobby/zepto
中文学习文档: https://zeptojs.bootcss.com

Lodash

Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库
官网: https://lodash.com
Github: https://github.com/lodash/lodash
https://www.lodashjs.com

Underscore

Underscore 是一个JavaScript实用库,提供了一整套函数式编程的实用功能,但是没有扩展任何JavaScript内置对象。
官网: http://underscorejs.org
Github: https://github.com/jashkenas/underscore
http://www.css88.com/doc/underscore/

UI

Bootstrap

Bootstrap 是流行的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。
官网: http://getbootstrap.com
Github: https://github.com/twbs/bootstrap
中文学习网站:
http://www.bootcss.com
https://v3.bootcss.com

Semantic UI

一款UI框架,支持 React, Angular, Meteor, and Ember 框架。
官网: http://www.semantic-ui.com
Github: https://github.com/Semantic-Org/Semantic-UI

Ant Design

一款企业级的 UI设计 与 React UI 组件库,风格偏向中后台产品,由蚂蚁金服提供。
官网: https://ant.design
Github: https://github.com/ant-design/ant-design
中文学习网站: https://ant.design/index-cn

Material-UI

符合 Material Design 的 React 组件库。
官网: https://material-ui.com
Github: https://github.com/mui-org/material-ui

Vuetify

符合 Material Design 的 Vue 组件库。
官网: https://vuetifyjs.com
Github: https://github.com/vuetifyjs/vuetify
中文官网: https://vuetifyjs.com/zh-Hans/

Element-UI

基于 Vue2.0 的 UI组件库。
官网: https://element.eleme.io
Github: https://github.com/ElemeFE/element

iView

基于 Vue 的 UI组件库。
官网: http://iview.talkingdata.com
Github: https://github.com/iview/iview

Layui

Layui 是一款采用自身模块规范编写的前端 UI 框架。
官网: https://www.layui.com
Github: https://github.com/sentsin/layui

Tailwind

一个用于快速 UI 开发的实用工具集 css 框架。
官网: https://tailwindcss.com
Github: https://github.com/tailwindcss/tailwindcss
中文学习文档: https://www.tailwindcss.cn

MaterializeCSS

一款基于 Material Design 的 css 框架。
Github: https://github.com/Dogfalo/materialize

Javascript 内核 & 运行时

ChakraCore

Micosoft 开发的 Javascript 引擎,被用于 Micosoft Edge 浏览器中。
Github: https://github.com/Microsoft/ChakraCore

JavaScriptCore

Apple 开发的开源 JavaScript 引擎。Safari 浏览器的内在引擎。
Github: https://github.com/WebKit/webkit/tree/master/Source/JavaScriptCore

SpiderMonkey

Mozilla 使用C/C++编写的 JavaScript 引擎。它被用于包括 Firefox 在内的多个 Mozilla 产品中。
官网: https://developer.mozilla.org/zh-CN/docs/Mozilla/Projects/SpiderMonkey/Releases

v8

Google 开发的开源 JavaScript 引擎,以高性能著称。被用于Chrome浏览器。
Github: https://github.com/v8/v8

Rhino

是一个完全使用 Java 语言编写的开源 JavaScript 实现,由 Mozilla 开发。是J2SE 6上的默认 Java 脚本化引擎。
Github: https://github.com/mozilla/rhino

JerryScript

JerryScript 是一款轻量级的 JavaScript 引擎,主要用于限制资源的微型设备。由三星开发。
Github: https://github.com/jerryscript-project/jerryscript

kjs

运行于 KDE 的 JavaScript 引擎。采用了 LGPL-2.1 License。
Github: https://github.com/KDE/kjs

Hermes

为运行 React Native 进行了优化的 JavaScript 引擎。由 facebook 提供。
Github: https://github.com/facebook/hermes

Chromium

Chromium 是一款基于 v8 的开源浏览器。
官网: https://chromium.googlesource.com/chromium/
Github: https://github.com/chromium/chromium

Node.js

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境
官网: https://nodejs.org
Github: https://github.com/nodejs/node
中文学习网站: http://nodejs.cn
书籍:
https://github.com/alsotang/node-lessons
《深入浅出Node.js》

pm2

基于 Node.js 的一款自带负载均衡的进程管理器
官网: https://pm2.keymetrics.io
Github: https://github.com/Unitech/pm2

Deno

Deno 是一款运行于 Chrome v8 引擎的采用 Rust 编写的 JavaScript/TypeScript 运行环境
官网: https://deno.land
Github: https://github.com/denoland/deno

bun

bun 是一款集成 打包器、编译器、构建工具、包管理器的 JavaScript 运行环境
官网: https://bun.sh/
Github: https://github.com/Jarred-Sumner/bun

测试框架

Puppeteer

Puppeteer 是一款通过 DevTools 协议控制 Chrome 或 Chrominm 的 js 库,它提供了一些高度封装的API,常用来做 UI 自动化测试。
Github: https://github.com/puppeteer/puppeteer

Cypress

UI 自动化测试框架
Github: https://github.com/cypress-io/cypress

Nightwatch

自动化端到端测试框架,基于 Node.js 使用 W3C Webdrivers(Selenium)
官网: https://nightwatchjs.org
Github: https://github.com/nightwatchjs/nightwatch

Selenium

浏览器自动化框架,封装了大量工具和库。
官网: https://www.selenium.dev
Github: https://github.com/SeleniumHQ/selenium

Mocha

一款简单可扩展的js测试框架,可在 Node.js 和 浏览器 环境中测试。
官网: https://mochajs.org
Github: https://github.com/mochajs/mocha

Jest

javascript 测试解决方案,由 facebook 开源。
官网: https://jestjs.io
Github: https://github.com/facebook/jest

AVA

一款 Nodejs 测试运行器
Github: https://github.com/avajs/ava

Tape


一款浏览器和 Nodejs 的测试框架
Github: https://github.com/substack/tape

服务器框架

Express

Express是一个流行的Node.js web开发框架
官网: http://expressjs.com
Github: https://github.com/expressjs/express
中文学习网站: http://www.expressjs.com.cn/

Koa

使用ES6 async 方法来构建的有表现力的Node.js web开发框架
官网: https://koajs.com
Github: https://github.com/koajs/koa
中文学习网站: https://koa.bootcss.com

Fastify

Fastify是一个Node.js web开发框架,注重于以最少的开销和强大的插件架构提供最佳的开发人员体验
Github: https://github.com/fastify/fastify

Nest

一款渐进式 Node.js web开发框架,用于构建高效、可扩展的服务器端应用程序,使用 Typescript 开发,支持面向对象编程(OOP),函数式编程(FP)及函数交互式编程(FRP),可以基于 Express 或 Fastify 扩展
官网: https://nestjs.com
Github: https://github.com/nestjs/nest
中文学习网站: https://docs.nestjs.cn

Egg

基于 Node.js 与 Koa 的企业级web开发框架,由阿里巴巴开发。
官网: https://eggjs.org
Github: https://github.com/eggjs/egg
中文学习网站: https://eggjs.org/zh-cn/

依赖管理

Yarn

一款快速、可靠、安全的依赖管理工具
官网: https://yarnpkg.com
Github: https://github.com/yarnpkg/yarn
中文学习网站: https://yarn.bootcss.com

npm

最流行的 Javascript 包依赖管理工具
官网: https://npm.community
Github: https://github.com/npm/cli
中文学习网站: https://www.npmjs.com.cn

有关常用server npm库,可查看 常用npm库

nvm

node版本管理器
Github: https://github.com/nvm-sh/nvm

代码规范

Standard Style Guide

js 样式规范&代码自动对齐规范
官网: https://standardjs.com
Github: https://github.com/standard/standard

Airbnb JavaScript Style Guide

Airbnb js样式规范
Github: https://github.com/airbnb/javascript

Google Style Guide

Google js样式规范
官网: https://google.github.io/styleguide/jsguide.html
Github: https://github.com/google/eslint-config-google

semver

语义化版本规范(Nodejs包的版本规范)
官网: https://semver.org
Github: https://github.com/semver/semver

编译与格式化工具/库

Babel

将特定Javascript先进语法进行编译的JavaScript 编译器
官网: https://github.com/babel/babel
Github: https://github.com/babel/babel
中文学习网站:
https://babel.bootcss.com

swc

一款使用 Rust 开发的 Javascript/Typescript 编译器
官网:
Github: https://github.com/swc-project/swc

Prettier

代码格式化工具
官网: https://prettier.io
Github: https://github.com/prettier/prettier

JSlint

Js 代码格式化工具 由 Douglas Crockford 开发
Github: https://github.com/douglascrockford/JSLint

JSHint

Js 静态代码分析工具 由 Anton Kovalyov 在 JSLint的基础上开发
官网:jshint.com
Github: https://github.com/jshint/jshint

ESLint

一个完全插件化的代码识别及格式报告工具,支持jsx。由 Nicholas Zakas 开发
官网: https://eslint.org
Github: https://github.com/eslint/eslint
中文学习网站: http://eslint.cn/

Esprima

一款高性能,符合标准的 ECMAscript 解析器, 采用 ECMAscript 编写
官网: https://esprima.org
Github: https://github.com/jquery/esprima

Espree

语言解析工具,可以将js解析为AST(抽象语法树),由 Esprima 发展而来, 支持ES6, ESLint采用该解析工具
Github: https://github.com/eslint/espree

Acorn

一款小巧、快速的 Javascript 语言解析器,由 Javascript 编写
Github: https://github.com/acornjs/acorn

Expat

采用 c99 编写的一款面向流的 XML 解析器。
Github: https://github.com/libexpat/libexpat

Terser

Github: https://github.com/terser/terser
一款支持ES6+的 Javascript 解析器/压缩工具集

PostCSS

用 JavaScript 工具和插件转换 css 代码的工具,autoprefixer 是它的插件
官网: https://postcss.org
Github: https://github.com/postcss/postcss
中文学习网站: https://www.postcss.com.cn

Terser

Js压缩混淆工具
Github: https://github.com/terser

Font-Awesome

Font Awesome 字体提供可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。
官网: https://fontawesome.com
Github: https://github.com/FortAwesome/Font-Awesome
中文学习网站: http://www.fontawesome.com.cn

LinkChecker

死链接检查工具
Github: http://wummel.github.io/linkchecker/

blind_watermark

图片隐形水印添加工具
Github: https://github.com/guofei9987/blind_watermark

CI/CD

Travis

持续集成服务器解决方案
Github: https://github.com/travis-ci/travis-ci
官网: https://travis-ci.com

Jenkins

持续集成服务器解决方案,使用Java部署
Github: https://github.com/jenkinsci/jenkins
官网: https://www.jenkins.io

TeamCity

JetBrains提供的持续集成服务器解决方案
官网: https://www.jetbrains.com/teamcity/

跨平台

Electron

使用 JavaScript, HTML 和 css 构建跨平台的桌面应用框架
官网: https://electronjs.org
Github: https://github.com/electron/electron
中文学习网站: https://www.electronjs.cn

nw.js

使用 JavaScript, HTML 和 css 构建跨平台的桌面应用框架
官网: https://nwjs.io
Github: https://github.com/nwjs/nw.js

Meteor

Meteor 是一个用以采用纯 JavaScript 开发 web 和移动应用的完全开源的平台。支持 React、Blaze、Vue和Svelte框架开发。
官网: https://www.meteor.com
Github: https://github.com/meteor/meteor

Firebase

Firebase是一个移动应用程序开发平台,为开发者提供数据分析和数据库 web 服务。由Google驱动。
官网: https://firebase.google.com
Github: https://github.com/firebase

Supabase

Supabase 是 Firebase 的开源替代品。
官网: https://supabase.com
Github: https://github.com/supabase/supabase

Cordova

采用 HTML,CSS&JS 开发跨平台移动应用的开发框架
官网: https://cordova.apache.org
Github: https://github.com/apache/cordova-android
https://github.com/apache/cordova-ios

Ionic

Ionic是一款开源的移动应用开发框架。AngularJS移动端解决方案。
官网: https://ionicframework.com
Github: https://github.com/ionic-team/ionic-framework

NativeScript

NativeScript 是一个开源框架,用于使用 JavaScript 构建真正的本地移动应用程序。使用 web 技能,比如 Angular 和 Vue.js 、 FlexBox 和 CSS ,在 iOS 和 Android 上获得本地UI和性能。
官网: https://www.nativescript.org
Github: https://github.com/NativeScript/NativeScript

React Native(RN)

由facebook公司开发,支持使用React来构建原生移动应用的框架
官网: https://reactnative.dev
Github: https://github.com/facebook/react-native

Ignite

Ignite 是一套整合了 MobX 以及一些常见 UI 组件的 React Native 脚手架,提供了命令行 CLI、组件或是容器。
Github: https://github.com/infinitered/ignite

Metro

React Native 的 Javascript 打包器。由 facebook 提供。
官网: https://facebook.github.io/metro
Github: https://github.com/facebook/metro

Flutter

由 Google 采用 Dart 语言开发,用于创建高性能、跨平台的移动应用。
官网: https://flutter.io
Github: https://github.com/flutter/flutter

Weex

由 Alibaba 开发,用来创建移动端跨平台应用的框架。
官网: https://weex.apache.org
Github: https://github.com/apache/incubator-weex

Tauri

Tauri 是一款采用 Rust 开发的桌面端框架。
官网: https://tauri.studio
Githbu: https://github.com/tauri-apps/tauri

css扩展

Sass

css 扩展语言解析器
官网: http://sass-lang.com
Github: https://github.com/sass/sass
中文学习网站: https://www.sasscss.com

Less

css 预处理解析器
官网: http://lesscss.org
Github: https://github.com/less/less.js
中文学习网站:
http://lesscss.cn/
http://www.bootcss.com/p/lesscss/
https://less.bootcss.com

Stylus

css 预编译解析器
官网: http://stylus-lang.com
Github: https://github.com/stylus/stylus
中文学习网站: https://stylus.bootcss.com

html模板

mustache.js

HTML模板,特点是通过 {{mustache}} 引用变量
官网: https://mustache.github.io
Github: https://github.com/janl/mustache.js

Handlebars

html语义模板
官网: http://handlebarsjs.com
Github: https://github.com/wycats/handlebars.js
中文学习网站: https://handlebars.bootcss.com

Pug

html语义模板
官网: https://pugjs.org
Github: https://github.com/pugjs/pug
中文学习网站: https://pug.bootcss.com/api/getting-started.html

Liquid

html语义模板
官网: http://liquidmarkup.org/
Github: https://github.com/Shopify/liquid
中文学习网站: https://liquid.bootcss.com

EJS

嵌入式 JavaScript 模板引擎,特点是通过 <%= EJS %> 将 js 语法嵌入 HTML
官网: http://ejs.co
github: v1: https://github.com/tj/ejs v2: https://github.com/mde/ejs
中文学习网站: https://ejs.bootcss.com

静态站点生成

Jekyll

Jekyll 是一个使用 Ruby 编写的博客流静态站点生成器
官网: https://jekyllrb.com
Github: https://github.com/jekyll/jekyll
中文学习网站: https://www.jekyll.com.cn/

Hexo

一个快速、简单及强力的博客框架,由 Node.js 支持
官网: https://hexo.io
Github: https://github.com/hexojs/hexo
中文学习网站: https://hexo.bootcss.com

Vuepress

极简的 Vue 驱动的静态站点生成器
官网: https://vuepress.vuejs.org
Github: https://github.com/vuejs/vuepress
中文学习网站: https://vuepress.vuejs.org/zh/

Gatsby

基于 React 的静态站点生成器
官网: https://www.gatsbyjs.com
Github: https://github.com/gatsbyjs/gatsby
中文学习网站: https://www.gatsbyjs.cn/docs/

docsify

文档站点生成器
官网: https://docsify.js.org
Github: https://github.com/docsifyjs/docsify

WordPress

静态网站和博客生成框架
官网: https://wordpress.org/
Github: https://github.com/WordPress/WordPress

jsdoc

一款 JavaScript API 文档生成器
Github: https://github.com/jsdoc/jsdoc

css库

normalize.css

一款css库,用以针对不同浏览器的默认CSS样式进行重置,来减少浏览器之间的样式差异
官网: http://necolas.github.io/normalize.css/
Github: https://github.com/necolas/normalize.css

Animate.css

一款css动画库,包含了众多css动画效果,跨浏览器开箱即用
Github: https://github.com/animate-css/animate.css

Bluma

一款基于 Flexbox 的 css 框架
官网: https://bulma.io
Github: https://github.com/jgthms/bulma

其它库与工具

网络请求

socket.io

实时双向基于事件的通信框架,采用 Typescript 编写,同时也有 Java、C++、Swift、Dart、Python 等其它语言版本
官网: https://socket.io
Github: https://github.com/socketio/socket.io

Axios

Axios 是一个基于 Promise 的可以运行在浏览器和 Node.js 中的HTTP客户端库。
Github: https://github.com/axios/axios
中文学习网站: http://www.axios-js.com

图表&动画

D3

一款数据可视化库,支持采用 SVG、Canvas 与 HTML 渲染。
官网: https://d3js.org
Github: https://github.com/d3/d3
中文学习网站: https://www.d3js.org.cn

three.js

使用默认 WebGL 渲染的 Javascript 3d 库
官网: https://threejs.org
Github: https://github.com/mrdoob/three.js

anime.js

一款轻量级的 Javascript 动画库
官网: https://animejs.com
Github: https://github.com/juliangarnier/anime

PixiJS

Pixi是一个非常快的2D sprite渲染引擎,可以用来做游戏渲染
官网: https://pixijs.com
Github: https://github.com/pixijs/pixijs
中文学习网站: https://pixijs.huashengweilai.com

Babylon.js

Babylon是一个强力的3D游戏渲染引擎
官网: https://www.babylonjs.com
Github: https://github.com/BabylonJS/Babylon.js

Chart.js

基于 canvas 的简单的HTML5图表库
官网: https://www.chartjs.org
Github: https://github.com/chartjs/Chart.js

Mermaid

Mermaid 是一个基于 Javascript 的图表绘制工具,通过解析类 Markdown 的文本语法来实现图表的创建和动态修改,使用了 d3.js 来生成图形
Github: https://github.com/mermaid-js/mermaid

Echarts

一款图表与可视化的库
官网: https://echarts.apache.org/zh/index.html
Github: https://github.com/apache/echarts

Highcharts

一款基于 SVG 的 JavaScript 图表库
官网: www.highcharts.com
Github: https://github.com/highcharts/highcharts

日期&时间

Moment.js

一款 js 日期库,可以方便的对日期进行解析、校验、操作与格式化显示
官网: https://momentjs.com
Github: https://github.com/moment/moment

Luxon

一款 js 日期与时间库
Github: https://github.com/moment/luxon/

Day.js

一款 js 日期库,只有2kB
官网: https://day.js.org
Github: https://github.com/iamkun/dayjs
中文网站: https://dayjs.gitee.io/zh-CN/

date-fns

一款 js 日期库,提供了多种日期相关基础方法
官网: https://date-fns.org
Github: https://github.com/date-fns/date-fns

日志&数据可视化平台

Sentry

前端错误监控服务
官网: https://sentry.io
Github: https://github.com/getsentry/sentry
中文学习文档: https://zhuanlan.zhihu.com/p/161276192

Rollbar.js

Javascript 错误捕捉与日志分析框架
Github: https://github.com/rollbar/rollbar.js

Front.js

前端错误监控平台
官网: https://www.frontjs.com

Fundebug

前端错误监控平台
官网: https://www.fundebug.com

Bugsnag

前端错误监控平台
官网: https://www.bugsnag.com
Github: https://github.com/bugsnag/bugsnag-js

Grafana

一款开源的数据可视化平台
官网: https://grafana.com
Github: https://github.com/grafana/grafana

Superset

官网: 一个现代的、企业级的商业智能(BI)web应用
Github: https://github.com/apache/superset

Ghost

官网: 一款开源的内容管理系统(CMS),基于 Node.js 。
官网: https://ghost.org
Github: https://github.com/TryGhost/Ghost

API管理

Yapi

接口管理平台
官网: https://hellosean1025.github.io/yapi
Github: https://github.com/YMFE/yapi

Swagger

接口管理平台
官网: https://swagger.io
Github: https://github.com/swagger-api

strapi

接口管理平台
官网: https://strapi.io
Github: https://github.com/strapi/strapi

json-server

接口测试工具,可以通过配置json文件生成快速原型的后端接口响应
Github: json-server

代码编辑与管理

Git

代码版本管理工具
官网: https://git-scm.com
Github: https://github.com/git/git
中文学习网站: https://progit.bootcss.com
学习文档: [Git小抄(/blog/2019/02/01/FE-Git小抄/)

其它组件&API&工具

video.js

video.js是一款开源的 HTML5&Flash 音频播放器组件
官网: https://videojs.com
Github: https://github.com/videojs/video.js

sheet.js

sheetjs是一个各种电子表格格式的解析器和编写器组件
官网: https://sheetjs.com/
Github: https://github.com/SheetJS/sheetjs

pdf.js

一个基于web标准的通用平台,用于解析和呈现PDF
官网: https://mozilla.github.io/pdf.js/
Github: https://github.com/mozilla/pdf.js

clipboard.js

一款将文本复制到剪贴板的库
官网: https://clipboardjs.com
Github: https://github.com/zenorocha/clipboard.js

handsontable

handsontable 是一款 JavaScript/HTML5数据网格与电子表格的组件。可用于 React 、 Vue 和 Angular 。
官网: https://handsontable.com
Github: https://github.com/handsontable/handsontable

intro.js

introjs是一个新功能介绍和步进用户指导的组件
官网: https://introjs.com
Github: https://github.com/usablica/intro.js

timesheet.js

timesheetjs是一个时间线组件
官网: https://sbstjn.github.io/timesheet.js
Github: https://github.com/sbstjn/timesheet.js

reveal.js

在线ppt制作工具
官网: https://revealjs.com
Github: https://github.com/hakimel/reveal.js

impress.js

ppt制作框架,基于CSS3提供的变化和转换能力
官网: https://impress.js.org/#/bored
Github: https://github.com/impress/impress.js

faker.js

一款可以在 Node.js 和浏览器环境中可创造假数据的库
Github: https://github.com/Marak/faker.js

immutable-js

Javascript的不可变持久数据集合,提高了效率和简单性
Github: https://github.com/immutable-js/immutable-js

FileSaver.js

H5 文件保存方案
Github: https://github.com/eligrey/FileSaver.js

StreamSaver.js

H5 文件保存方案
Github: https://github.com/jimmywarting/StreamSaver.js

Leaflet

移动端友好的开源地图js库
官网: https://leafletjs.com
Github: https://github.com/Leaflet/Leaflet

blind-watermark

用于给图片添加隐形水印
Github: https://github.com/Sherryer/blind-watermark

interact.js

支持 JavaScript拖放、调整大小和多点触摸手势,具有惯性和捕捉功能,适合现代浏览器
官网: http://interactjs.io/
Github: https://github.com/taye/interact.js

simple-keyboard

Javascript虚拟键盘-可定制、响应灵敏、轻量级
官网: https://virtual-keyboard.js.org/
Github: https://github.com/hodgef/simple-keyboard

Serverless

Serverless Framework 是一个命令行工具用以快速部署无服务器(serverless)应用,它使用基于事件触发的计算资源(例如腾讯云云函数 SCF,AWS Lambda)
官网: http://www.serverless.com
Github: https://github.com/serverless/serverless

Hyper

采用 HTML/JS/CSS 编写的终端命令行工具
官网: https://hyper.is
Github: https://github.com/vercel/hyper

Quill

一款所见即所得的富文本编辑器
官网: https://quilljs.com
Github: https://github.com/quilljs/quill

storybook

UI组件开发与测试环境
官网: https://storybook.js.org
Github: https://github.com/storybookjs/storybook

Yoga

Yoga 是一款实现了 Flexbox 的跨平台的布局引擎,由 facebook 提供
官网: https://yogalayout.com
Github: https://github.com/facebook/yoga

React-pdf

React-pdf 是一款支持在浏览器和服务器环境下创建 PDF 文件的 React 渲染器
官网: https://react-pdf.org
Github: https://github.com/diegomura/react-pdf

Watchman

Watchman 是一款便捷工具,用于监视文件变更并记录或触发某些操作。由 facebook 提供。
官网: https://facebook.github.io/watchman
Github: https://github.com/facebook/watchman