Fe
《我的职业是前端工程师》 - Ebook:I'm a FrontEnd Developer
Install / Use
/learn @phodal/FeREADME
我的职业是前端工程师
2017 年 1 月份,看完村上春树的新书《我的职业是一个小说家》,我便萌发了写一个《我的职业是前端工程师》系列文章的想法——以个人视角来看前端领域的各种技术。整个系列的文章大概有 15 篇左右,从我是如何成为一个前端工程师,到各种前端框架的知识。
在线阅读地址:http://ued.party/
关注我的微信公众号(扫描下面的二维码或搜索 Phodal),回复书籍,可下载电子书版本

目录
- 关于作者
- 序
- 我要成为一个前端设计师
- 入门不是应该很简单吗?
- 如何选择合适的前端语言
- 如何选择合适的前端框架
- 必会的六个调试技能
- 如何以正确的姿势练习
- 前后端分离,你应该知道的八件事
- SEO 优化技巧
- 单页面应用的核心知识
- 客户端存储与模型的艺术
- 如何优化前端应用性能
- 移动应用选型指南
- 如何处理好前后端分离的 API 问题
- 如何从头开发一个前端应用
前端技能
来源:https://github.com/phodal/awesome-growth
- 基础
- HTML / CSS
- JavaScript
- DOM
- 中级篇
- 数据格式(如JSON、XML)
- RESTful API交互(如jQuery Ajax,Fetch API,ReactiveX)
- 正则表达式
- HTML语义化
- 命令行
- Node.js
- DIV / CSS
- SCSS / SASS
- 矢量图形 / 矢量图形动画(如SVG)
- 单页面应用
- 高级篇
- ES6 / TypeScript
- CSS3
- 面向对象编程
- 函数式编程
- MVC / MVVM / MV*
- 安全性(如跨域)
- 授权(如HTTP Basic、JWT等等)
- 工程化
- 代码质量(如JSLint / ESLint / TSLint / CSLint)
- 代码分析(如Code Climate)
- 测试覆盖率
- 构建系统(gulp、grunt、webpack等等)
- 自动构建(脚本)
- 兼容性
- 跨浏览器测试 (Chrome,IE,Firefox,Safari等等)
- 跨平台测试(Windows、GNU/Linux,Mac OS等等)
- 跨设备测试(Desktop,Android,iOS,Windows Phone)
- 跨版本测试(同一个浏览器的不同版本)
- 前端特定
- CSS / CSS3 动画
- JavaScript 动画
- Web字体嵌入
- Icon 字体
- 图形和图表
- CSS Sprite(如glue)
- DOM操作(如jQuery、React等等)
- 模板引擎(如JSX、Handlebars、JSP、Mustache等等)
- 软件工程
- 版本管理(如git、svn)
- 包管理(如npm、bower)
- 依赖管理
- 模块化(如CommonJS、WebPack)
- 调试
- 浏览器调试
- Debug工具
- Wireshark / Charles抓包
- 远程设备调试(如Chrome Inspect Devices)
- 测试
- 单元测试
- 服务测试
- UI测试
- 集成测试
- 性能与优化
- PageSpeed / Yslow 优化
- 加载优化(如gzip压缩、缓存等等)
- 性能测试(特别是移动Web)
- 可用性
- 压缩(如Minify、Uglify、CleanCSS等等)
- 设计
- 切页面
- 线框图(Wireframe)
- 响应式设计
- 网格布局(Grid Layout)
- Flexbox布局
- SEO
- Sitemap(站点地图)
- 内部链接建设
- MicroData / MicroFormat
- 页面静态内容生成
- H1、H2、H3和strong使用
- Title、Description优化
- 页面静态内容生成
LICENSE
© 2017 Phodal Huang. This code is distributed under the Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 License. See LICENSE in this directory.
Related Skills
node-connect
342.5kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
85.3kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
342.5kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
342.5kQQBot 富媒体收发能力。使用 <qqmedia> 标签,系统根据文件扩展名自动识别类型(图片/语音/视频/文件)。
