Skip to content

yassinia/fe-knowledge-points

BranchesTags
 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
README.md
README.md
 
 

Repository files navigation

Front-end Knowledge Points

本项目是百度前端技术学院（百度IFE第一期）学习过程中涉及到的相关阅读资料、开发工具、入门tutorial、技术资讯等精华资源的汇总，其中部分内容可能需要翻墙访问（翻墙指南），本列表的内容会随着课程进展逐步完善，对前端刚入门的同学可以持续关注本项目的更新情况。

Pre

Introduction

  1. Quora: What are the best resources for learning JavaScript?
  2. 知乎中一些值得推荐的前端领域相关问答
  3. 知乎：有哪些关于前端技术的推荐书籍
  4. 前端知识体系
  5. JavaScript之路（包含大量学习资源）
  6. 前端面试题汇总

Editor

  1. Sublime Text 2
  2. WebStorm
  3. Visual Studio Code [Free]
  4. Brackets [Free]
  5. Atom [Free]

Tools

  1. Sublime常用配置技巧与常用插件
  2. Web前端编程规范 或 AlloyTeam前端编程规范
  3. RGB颜色查询对照表
  4. Can I use: 浏览器兼容性查询
  5. 跨浏览器测试工具modern.IE

Commmunity

  1. 常备站点：MDN
  2. 前端社区：w3ctech
  3. 前端设计：Sitepoint
  4. 前端博客：Scotch.io

Task 1 HTML\CSS\Git Basic

Reading:

  1. 知乎：Web开发基础指南
  2. 入门图书：Head First HTML&CSS, 2nd
  3. Learn to Code HTML&CSS
  4. HTML/CSS Performance & Organization

Git

  1. Git - the simple guide
  2. 图解Git
  3. Git from inside out
  4. 猴子都能懂的GIT入门
  5. Git Magic
  6. First Aid Git: A searchable collection of the most frequently asked Git Questions
  7. Github Help
  8. 搬进Github
  9. 25个Git进阶技巧

HTML:

  1. MDN: HTML入门
  2. 知乎：如何理解Web语义化
  3. Learn to Code HTML & CSS
  4. 20 HTML Elements for Better Text Semantics
  5. 10 Typical HTML Interview Exercises

CSS & Layout:

  1. CSS入门：https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Getting_started
  2. 学习CSS布局：http://zh.learnlayout.com/no-layout.html
  3. CSS常见布局问题整理
  4. 淘宝UED：双飞翼布局 http://www.imooc.com/wenda/detail/254035
  5. stackoverflow: 3 column layout
  6. stackoverflow: Two column div layout with fluid left and fixed right column
  7. CSS3中的网格
  8. CSS Flexible Box: CSS3中弹性盒布局的最新版
  9. Tool: How to Center in CSS
  10. HTML5+CSS3的响应式网页设计：自动适应屏幕宽度
  11. Responsive Web Design
  12. An Introduction to Mobile-First Media Queries
  13. Responsive Design Best Practices for Big Project

Task 2 JavaScript Basic

Reading:

  1. 推荐阅读：Head First HTML5 Programming
  2. 推荐阅读：JavaScript高级程序设计，第3版
  3. Dive Into HTML5
  4. MDN: JavaScript Wiki
  5. Learn to Code Advanced HTML & CSS

HTML5

  1. Tutorial: Native HTML5 Drag and Drop API

JavaScript

  1. MDN: JavaScript入门
  2. JavaScript性能优化：加载和执行
  3. MDN: JavaScript正则表达式
  4. MDN: query selector
  5. MDN: Cookie
  6. w3school: Ajax基础教程
  7. Blog: 使用原生JavaScript封装Ajax
  8. Comet: 基于HTTP长连接的“服务器push”技术
  9. jsfiddle: a simple countdown timer
  10. Simple Ajax Auto-Complete Example
  11. Tutorial: 使用原生JavaScript从0开始开发一个轮播图

Node.js

  1. scotch.io: Build a RESTful API Using Node and Express 4
  2. Express跨域问题解决方案
  3. 朴灵：Node编码规范

Questions

  1. 为什么JavaScript中0.1+0.2不等于0.3？参看浮点数计算的基本问题。
  2. stackoverflow: most efficient way to clone an object
  3. stackoverflow: remove duplicate items from an array
  4. stackoverflow: 浏览器类型判断
  5. stackoverflow: creating the checkbox daynamically using javascript
  6. stackoverflow: How to iterate JSON array in JavaScript

Task 3 JavaScript Advanced & Basic Web App Development

Reading

  1. JavaScript高级程序设计，第3版
  2. JavaScript: The Good Parts
  3. JavaScript: The Definitive Guide
  4. Learning Advanced JavaScript
  5. Elogquent JavaScript
  6. JavaScript Garden
  7. 数据结构与算法JavaScript描述
  8. 编写可维护的JavaScript
  9. Effective JavaScript
  10. 重新介绍JavaScript

Debug

  1. Debugging JavaScript
  2. Debugging Asynchronous JavaScript with Chrome DevTools
  3. Breakpoint Actions in JavaScript
  4. Evaluating Network Performance
  5. Enhance your javascript debugging with Cross-Browser Source Maps

JavaScript

  1. 5个经典的JavaScript面试题
  2. 鸟哥：理解JavaScript的作用域
  3. JavaScript 开发进阶：理解 JavaScript 作用域和作用域链
  4. Understanding JavaScript Prototypes
  5. A Plain Guide to JavaScript Prototypes
  6. 详解JavaScript的函数闭包
  7. Revealing the Inner Workings of JavaScript's 'this' keyword
  8. JavaScript like a Boss: Understanding Fluent APIs
  9. stackoverflow: Storing Objects in HTML5 localStorage
  10. stackoverflow: Copying array by value in JavaScript

JavaScript OOP

  1. Javascript 面向对象编程基础入门
  2. 推荐阅读：JavaScript高级程序设计，第6章，面向对象程序设计
  3. JavaScript继承详解
  4. JavaScript继承方式详解
  5. JavaScript探秘：构造函数 Constructor
  6. this关键字详解
  7. 深入浅出JavaScript中的this关键字

Design Patterns

  1. 常用的JavaScript设计模式
  2. JavaScript设计模式深入分析
  3. 图书：Learning JavaScript Design Patterns
  4. 上面这本书的中文版

HTML & CSS

  1. Using Links to Create Navigation Menus
  2. Stackoverflow: CSS3 Viewport-Percentage Length
  3. Tutorial: Horizontal lists
  4. Tutorial: Creating a modal window with HTML5 & CSS3

Documentation

  1. MDN JavaScript全部页面索引
  2. MDN JavaScript全部方法索引
  3. MDN JavaScript全部属性索引

Task 4

Mobile Development

  1. Mobile Development Get Started
  2. 移动开发资源与技巧汇总

CSS pre-process and post-process

Modular

  1. Wiki: AMD
  2. Why AMD?
  3. RequireJS

Front-end Engineering

Website Performance

  1. Google: Web性能最佳实践
  2. Yahoo: Best Practices for Speeding Up Your Web Site
  3. 14 Rules for Faster-Loading Web Site
  4. Video: Practical Performance Tips to Make Your HTML/JavaScript Faster
  5. 前端性能优化最佳实践

Performance Debug Tools

  1. Chrome developer tools
  2. Web Page Test
  3. Windows Performance Toolkit Overview

Tools

  1. 文件精简工具：UglifyJS
  2. 构建工具：Grunt: The JavaScript Task Runner
  3. 构建工具：Gulp: the streaming build system
  4. 文档生成：jsdoc: an api documentation generator for JavaScript
  5. 代码检查：JSHint
  6. 测试框架：Karma

JavaScript MVC Frameworks

  1. Angular.js & Angular2
  2. React.js & React Native

CSS Frameworks

  1. Top 5 Material Design Frameworks to Use in 2015

Contact me

  1. My profile: http://wwsun.me/about.html
  2. My Github: https://github.com/wwsun
  3. My Weibo: http://weibo.com/234170023

About

front-end knowledge points

Resources

Readme
Activity

Stars

0 stars

Watchers

1 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

No packages published