前端参考博客和在线工具合集

归纳

前端技能图谱

css

• CSS布局奇淫技巧之–各种居中
• 弹性盒模型
• 一些实用而又记不住的css技巧
• 20个非常实用的CSS技巧

canvas

• Canvas API 详解
• 一个少女心满满的例子带你入门 canvas

ES6

• ECMAScript 6 入门
• 【探秘ES6】系列专栏

可视化(D3)

• Learning D3.JS
• D3.js API 中文手册
• Echarts个人轨迹可视化实现
• 图拓
• d3

正则表达式

• 正则表达式30分钟入门教程

Vue

• vue开发常见知识点及问题资料整理
• Vue 知识点整理
• Vue 相关难点
• Vue.js源码分析

node.js

• 《Node.js 包教不包会》 by alsotang
• 快速使用node.js进行web开发

模板引擎

• nodejs前端模板引擎swig入门
• Jade模板
• ejs模板引擎

Flutter

• Flutter快速上手指南
• Flutter实战
• [译] Awesome Flutter：带你从入门到进阶的 Flutter 指南

webpack

• Webpack 中文指南
• 只要这几步，webpack速成不是事儿
• webpack多页应用架构专题系列
• 深入浅出 Webpack
• Webpack揭秘——走向高阶前端的必经之路

TypeScript

• TypeScript Handbook（中文版）

移动端

• 移动WEB前端开发资源整合
• 从零开始学习移动端Web开发
• 利用视口单位实现适配布局

hexo搭建博客

• 手把手教你用Hexo+Github 搭建属于自己的博客
• 使用hexo+github搭建免费个人博客详细教程
• Hexo-NexT 主题个性优化

android

• 详细的Android SDK下载安装及配置教程
• 通过cordova将vue项目打包为webapp

插件库

• jquery cards
• codepen
• jquery 插件库
• Dynamics.js

单元测试

• js单元测试框架对比

Dart

• Dart 语言简易教程

Guns

• 从零开始部署Guns V4.0 (SpringBoot开源框架)教程

题目

• LeetCode
• LintCode

工具

• 在线工具
• 在线JSON校验格式化工具
• CSS3 Code Generator
• screen size
• CSS Animate
• 查看兼容性
• Css sprite在线生成
• 在线调试工具

其他工具

• 设计导航 - 精选最好的设计网站大全
• DevDocs API Documentation
• Coderbyte
• Spring Initializr
• 摄图网
• electron入门心得
• Blockly(可视化编程工具)的配置