web 前端必备学习指南-精华

工具

  • box-shadow generator

    生成 box-shadow 的工具。

  • gradient-generator

    渐变生成器。

  • Ultimate CSS Gradient Generator

    也是渐变生成器

  • CSS Generators -CSSREFLEX

    CSS3 生成器

  • 图床 https://sm.ms/

    有 API 可用。

  • 新浪微博图床 Chrome扩展

  • Unix 时间戳 Unix timestamp

编程语言

JavaScript

  • 前端资源教程 i5ting

  • 廖雪峰JavaScript教程

  • JavaScript 标准参考教程(alpha) -阮一峰

  • JavaScript Promise迷你书 -azu

  • 前端的异步解决方案之Promise和Await Async

  • You Don’t Know JS (book series)

  • You Don’t Need jQuery

    前端发展很快,现代浏览器原生 API 已经足够好用。我们并不需要为了操作 DOM、Event 等再学习一下 jQuery 的 API。同时由于 React、Angular、Vue 等框架的流行,直接操作 DOM 不再是好的模式,jQuery 使用场景大大减少。本项目总结了大部分 jQuery API 替代的方法,暂时只支持 IE10+ 以上浏览器。

  • JavaScript 秘密花园

  • JavaScript 设计模式 系列 AlloyTeam

ES2015(ES6)

  • 《ECMAScript 6入门》 -阮一峰

  • EcmaScript6 全规范(含node) -ouvens

  • 30分钟掌握ES6/ES2015核心内容(上)

  • 30分钟掌握ES6/ES2015核心内容(下)

  • ES2015规范 英文

TypeScript

  • TypeScript语法

前端博文

  • 前端 JSer 装逼手册

  • 6周学习计划,攻克JavaScript难关

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傻瓜指南(二)开发和部署技巧 -前端外刊评论 知乎专栏

  • Webpack傻瓜指南(三)和React配合开发 -前端外刊评论 知乎专栏

    上述傻瓜指南的原始出处 https://github.com/vikingmute/webpack-for-fools Webpack傻瓜式指南

  • Webpack,101入门体验 -Yika

  • Webpack 入门指迷 -题叶

  • https://webpack.github.io/ Webpack 官网

Vue

  • awesome-vue
  • Vue.js 和 Webpack(一) -Randy Lu
  • Vue.js 和 Webpack(二) -Randy Lu
  • Vue.js 和 Webpack(三) -Randy Lu
  • Vuejs 1.0 中文系列视频教程 -Laravist
  • Vuejs-QQ群 相关资料 来自豪情

React

  • 深入理解 React -Thinking in React 中文版
  • Thinking in React

AngularJS

  • AngularJS api 官网

  • AngularJS入门教程——AngularJS中文社区提供

  • AngularJS 教程 | 菜鸟教程

    类似 w3school 的入门 AngularJS 教程。

React-Native

  • React-Native学习指南

WEEX

  • Weex中文文档 官方

  • Weex详解:灵活的移动端高性能动态化方案

测试

  • 测试框架 Mocha 实例教程 阮一峰

类库与插件

  • Masonry

    瀑布流布局库。

  • jssor

    图片轮播图其 GitHub 地址 jssor/slider

  • cssslider

    纯 CSS 的图片轮播图。

模块化

  • 后端程序员的 JavaScript 之旅 - 模块化(一)
  • 后端程序员的 JavaScript 之旅 - 模块化(二)
  • 后端程序员的 JavaScript 之旅 - 模块化(三)

  • CommonJS 规范 -来自 阮一峰 JavaScript 标准参考教程(alpha)

技巧

  • 将footer固定在页面底部的实现方法

编辑器

Atom 中常用插件

  • auto-beautify
  • autoprefixer
  • block-comment
  • color-picker
  • docblockr
  • emmet
  • jquery-snippets
  • jshint
  • linter
  • linter-csslint
  • linter-htmlhint
  • minimap
  • minimap-git-diff
  • minimap-codeglance 滑过 minimap 显示代码
  • minimap-find-and-replace 在 minimap 中显示 ctrl+D 选中的内容
  • open-in-browser
  • uglify
  • active-power-mode
  • atom-terminal-panel
  • linter-scss-linter
  • atom-ternjs
  • file-icons 将图标变成彩色
  • autocomplete-paths 自动补充路径
  • symbols-tree-view A symbol treeview like taglist

常用的主题:

UI Theme: One Dark

Syntax Theme: Atom Dark or One Dark

GitBook 及其插件

  • Gitbook 的使用和常用插件 -赵达
  • gitbook-plugin-expandable-chapters

    折叠左侧目录章节。


Chrome 插件

  • Chrome扩展及应用开发 -图灵电子书

  • 有哪些鲜为人知却非常有意思、好用的 Chrome 扩展? -知乎
  • Dribbble New Tab

    新建 tab 时,显示 dribbble 上的精选作品。

Other blogs

  • 进击的马斯特 http://pinkyjie.com/

    马斯特,87年生人,爱溜冰的码农。技术: Javascript、Python、Mac、iOS

  • Jerry Qu

    JerryQu,奇虎 360,前端开发,前百度前端。

  • 码志 https://mazhuang.org/

    我是马壮,码而生,码而立。就职sogou。

  • 小胡子哥 http://www.barretlee.com/

    李靖,阿里巴巴。

  • Xcat Liu http://blog.xcatliu.com/

    Microsoft Software Engineer II, Meituan Senior Front-End Engineer

  • 极限前端 http://ouvens.github.io/

    Ouvenzhang, 前端工程师,对前端领域的技术知识具有较高的职业能力和探究精神。对响应式页面设计、工程构建组件化、mv*设计实现、前端优化、ES6开发体系等有深入的研究与项目实践。来自腾讯科技。

  • 凳子_Joinery 邓智容 http://www.dengzhr.com/

  • 赵达的个人网站 腾讯高级前端开发工程师

  • Randy



转载: WEB前端必备学习指南

你可能感兴趣的:(Web前端)