前端小知识

前端开发基本功主要分为三大模块:

1. 原生HTML、CSS、JavaScript三件套基础语法属性API的熟悉程度；

2. 对需求分析和功能设计的编程思维；

3. 对需求与功能落地实现的编程能力；

这三点中，对前端基础技术栈三件套的掌握程度是根基，没有根基就谈不上编程思维和编程能力

路径

• 基础：Html、CSS、JavaScript

• 进阶：React、Less、TypeScript

• 工程化：UmiJs、Ant Design、ahook

前端文档

• MDN 官方文档：https://developer.mozilla.org/zh-CN/docs/Web

前端社区

• GitHub

• stackoverflow

• 掘金

JS 学习资源

• 现代 JavaScript 教程：https://zh.javascript.info/

• 阮一峰 JS教程：https://wangdoc.com/javascript/

• 阮一峰 ES6教程：https://es6.ruanyifeng.com/

• TypeScript 入门教程：https://github.com/xcatliu/typescript-tutorial

• Node.js学习指南：https://blog.poetries.top/node-learning-notes/

JS 代码规范

1、Airbnb JavaScript Style Guide：

• 英文原版：https://github.com/airbnb/javascript

• 中文版：https://github.com/lin-123/javascript

2、clean code JavaScript：

• 英文原版：https://github.com/ryanmcdermott/clean-code-javascript

• 中文版1：https://github.com/alivebao/clean-code-js

• 中文版2：https://github.com/beginor/clean-code-javascript

前端刷题

• 前端进阶之道：https://yuchengkai.cn/

CSS 学习资源

• CSS灵感：https://github.com/chokcoco/CSS-Inspiration

• CSS的各种实现效果：https://lhammer.cn/You-need-to-know-css/#/

• css_tricks：https://github.com/QiShaoXuan/css_tricks

• 按需定制 CSS 动画效果：https://github.com/QiShaoXuan/css_tricks

字体相关资源

• 360字体版权查询：https://fonts.safe.360.cn/

• 最全的免费可商用字体-效果预览：https://wordshub.github.io/free-font/index.html

• 常见的免费字体：http://zenozeng.github.io/Free-Chinese-Fonts/

抓包工具

• Whistle：https://wproxy.org/whistle/

兼容性查看工具

• Can I use（前端API兼容性查看）：https://caniuse.com/

图片相关工具

• 图片压缩：https://tinypng.com/

• 图片压缩：https://docsmall.com/

• 生成代码截图：https://carbon.now.sh/

设计工具

• 墨刀：原型设计工具。网址：https://modao.cc/

• 蓝湖：一款产品文档和设计图的在线协作平台。网址：https://lanhuapp.com

• PxCook（像素大厨）：高效易用的自动标注工具。软件下载链接：https://www.fancynode.com.cn/pxcook

• 即时设计、稿定、master go

流程图工具

• ProcessOn：https://www.processon.com/

大纲笔记

• 幕布：https://mubu.com

• 飞书-思维笔记

markdown 编辑器

• typora

• VS Code

代码编辑器

• VS Code

• Sublime Text

七、前端书籍推荐

JS经典书籍

• 红宝书：《JavaScript高级程序设计》

• 小黄书：《你不知道的JavaScript》上、下册

• 犀牛书：《JavaScript权威指南》

• 绿皮书：《javascript语言精粹与编程实践》

JS进阶

• 《前端开发核心知识进阶》

• 《JavaScript 二十年》

• 《JavaScript 悟道》

• 《深入理解现代JavaScript》

• 《JavaScript忍者秘籍》

• 《编写可维护的JavaScript》

• 《了不起的JavaScript工程师：从前端到全端高级进阶》

• 《javascript设计模式与开发实践》

• 《WebKit技术内幕》

• 《JavaScript启示录》

CSS

• 《CSS世界》

• 《CSS新世界》

• 《CSS揭秘》

• 《精通 CSS》

Vue.js

• 《Vue.js设计与实现》

• 《深入浅出Vue.js》

Node.js

• 《深入浅出Node.js》

• 《Node.js：来一打 C++ 扩展》

数据结构和算法

• 《计算之魂》

• 《大话数据结构》

• 《学习JavaScript数据结构与算法》

后端

• 《领域驱动设计》

• 《推荐系统实践》

• 《数据密集型应用系统设计》

• 《代码精进之路：从码农到工匠》

项目管理和认知

• 《人月神话》

• 《黑客与画家》

• Joel Spolsky的书：《软件随想录》《Joel 说软件》《Joel 谈优秀软件开发方法》

• 《凤凰项目》

• 《持续交付2.0》

• 《Google软件工程》

• 《软技能：代码之外的生存指南》

• 《重来3：跳出疯狂的忙碌》

• 《程序员的思维修炼》

• 《管理的常识》

产品

• 《启示录》

• 《结网》

• 《人人都是产品经理》

• 《用户体验要素》

• 《有效需求分析》

• 《产品逻辑之美：打造复杂的产品系统》

• 《微信背后的产品观》

• 《俞军产品方法论》

• 《决胜B端——产品经理升级之路》

• 《给产品经理讲技术》

• 《精益数据分析》

• 《产品经理面试宝典》

• 《体验引擎：游戏设计全景探秘》

设计

• 《设计心理学》四册

• 《用户体验要素》

• 《点石成金》

• 《写给大家看的设计书》

• 《About Face 4: 交互设计精髓》

• 《设计中的设计》

• 《破茧成蝶》

• 《简约至上：交互式设计四策略》

• 《Web表单设计：点石成金的艺术》

• 《触动人心：设计优秀的iPhone应用》

• 《瞬间之美：Web界面设计如何让用户心动》

• 《用户体验度量：收集、分析与呈现》

运营

• 《运营之光》两册

• 《我在一线做用户增长》

• 《增长黑客：创业公司的用户与收入增长秘籍》

• 《流量池》

• 《超级运营术》

商业

• 《史蒂夫·乔布斯传》

• 《浪潮之巅》

• 《赢》

• 《你凭什么做好互联网：从技术思维到商业逻辑》

• 《计算广告》

• 《详谈：左晖》

• 《在线：数据改变商业本质，计算重塑经济未来》

• 《零售的哲学》

• 《我看电商》

• 《冲浪板上的公司》

• 《一本书读懂财报》

思维和认知

• 《学会提问》

• 《思考，快与慢》

• 《清醒思考的艺术》

• 《把时间当作朋友》

• 《智识分子》

• 《少有人走的路》

• 《沟通的方法》

• 《我们为什么要睡觉》