前端系统班全面升级
01/我们是怎样的
02/ 校友们的心路历程
我最大的感受是，1.注重授人以鱼，不如授人以渔 ;2.对于学习中遇到的问题，先自己独立思考、分析、google，若还是不明白再去问老师;3.同学之间相互交流，学习氛围浓厚；虽是网络教学，彼此都没有见过面，但是前端让大家心心相惜；4.若真心喜欢前端，这里会给你一个很好的平台；很庆幸自己来饥人谷，遇到了若愚老师，方方老师，教导员青青和墨凌，还有一群喜欢前端的小伙伴们，大家一起学习，经历和成长，很开心；5. 做你喜欢的，Stay hungry, Stay foolish。
在饥人谷学习的最大感受就是公平，你的付出跟回报是完全成正比的，付出的多，回报也不会少，反之亦然。学到现在才明白编程这条路其实很长，需要脚踏实地的走，这也是方方老师为什么一直在强调初学者基础的重要性，老师苦口婆心，而现实中，或许只有等自己工作了才会明白。应了那句话，道理都是讲给别人听的，只有经历才是留给自己的.在谷里学习的这段时间受益很多，我也会一直学习下去，over。
在此我也想说其实真的我觉得在饥人谷，更多的是学到了一套丰富的解决问题的方法，去掉了之前不会主动学习的懒癌，主动学习，自我学习的能力是我在这收获最宝贵的财富。为了实现更高的理想，还会不断的学习的。
03/ 教学模式或许更科学
| 阶段 | 内容 |
|---|---|
| 体系学习（4个月） | ✦入学后接受老师1v1语音约聊 |
✦ 120小时+视频体系学习任务，4个中大型项目 | |
直播班会 | ✦ 每周会直播班会，1对1和老师直播互动 |
| 项目实践 (1~2个月) | ✦个性化定制项目，让学生的项目不再千篇一律； |
| 求职阶段 (持续到就业) | ✦多个老师对1名学生进行单独的简历辅导； ✦1v1模拟面试； ✦海量面试和笔试押题及答案讲解； ✦校友优质岗位内推
|
| AI助手 | ✦ 免费提供基于GPT3.5的AI助手辅助学习 |
04/令人激动人心的学习路线
| 走进前端工程师的世界 | 讲解互联网公司角色、项目发布流程、前端工程师职业要求、前端知识体系等行业入门知识 |
| 前端环境搭建/HTML | 讲解如何搜索、如何提问、如何写博客、markdown语法、学习资料、文章推荐等学习方法 讲解VSCode环境搭建、页面分块思路、重要标签、Emmet语法 |
| HTML标签、块、行、属性、规范 | 讲解常见标签、块与行、常见属性、HTML5标签、表单 讲解HTML规范、命名经验、常规命名法和BEM命名法 |
| Git与Github | 讲解Git命令行日常使用、Github的使用 |
| CSS引入、规范、调试、选择器 | 讲解CSS引入方式，书写规范、调试方法 讲解几种选择器用法 |
| CSS选择器优先级、样式继承、文本样式 | 讲解样式优先级规范、选择器权重计算方式 讲解样式继承；单位px、em、rem、vw 讲解常见文本相关样式 |
| 布局模式、盒模型、块和行的特性 | 布局模式、盒模型、ie盒模型、标准盒模型、box-sizing margin:0 auto; display: block、inline、inline-block、none 区别 |
| CSS外边距折叠、CSS3常见特效 | 讲解外边距折叠的几种案例 CSS3背景、渐变、阴影等用法 |
| flex布局精讲 | 讲解flex布局的原理、使用范例 flex-basis、flex-grow、flex-shrink的三个属性具体用法 flex:auto、flex:1、flex:0区别 垂直水平居中 |
| grid布局的使用、浮动、BFC的原理 | 讲解grid布局的原理、使用范例 两栏布局、三栏布局 浮动的用法、清除浮动原理和写法 BFC概念、作用 |
| CSS定位、层叠上下文 | 定位的几个值用法和区别 下拉菜单的实现 实现垂直水平居中 层叠上下文的原理和案例分析 |
| iconfont、svgicon、CSS3动画、响应式 | iconfont、iconpark的使用，字体图标、svg图标的使用 CSS3 过渡transition、动画animation、贝塞尔曲线案例 响应式布局@media用法和案例 |
| 实战 | 实现导航站/在线简历/企业站 |
| 数据类型、表达式、运算符 | JS引入、控制台调试、变量、标识符规范、表达式、运算符、语句 八种数据类型 typeof详解 算术运算符，++i和i++ 比较运算符、布尔运算符、位运算符 小括号、逗号、void |
| 运算符优先级、数字、字符串、数组、对象 | 运算符结合性与优先级 数字的日常用法字符串声明方式 字符串访问和拼接 字符串查找和截取 数组定义、访问、长度 对象基础 |
| 流程控制语句、函数、箭头函数 | if、switch、for、for-in、for-of、continue和break 函数、函数声明、参数、返回值 箭头函数 统计字符串字符个数、二进制转十进制 随机IP、随机颜色、打印杨辉三角 |
| 引用类型、块级作用域、var let const、词法作用域、作用域链 | 引用类型与案例分析 块级作用域案例分析 var、let、const区别 var声明前置 function声明前置 词法作用域 作用域链与案例 作用域、声明前置、TDZ案例 |
| 数组API和案例 | 数组push、pop、shift、unshift 数组splice、concat、join 数组sort、reverse forEach、map、filter、reduce、every、some 讲解和练习 类数组对象、数组转换、空数组 数组去重的几种方法 |
| Set、Map、WeakMap、正则表达式 | Symbol的使用 Set的用法、Set实现数组去重 Map的用法 WeakMap介绍 正则表达式作用、创建、用法 判断输入的是否是有效手机号 贪婪模式和非贪婪模式 正则分组实例 |
| DOM详解 | DOM获取元素、遍历元素、DOM元素属性 事件绑定 DOM创建和追加 关于createDocumentFragment的测试 DOM移动、替换、删除、DOM交换 DOM属性操作 style操作、class操作 实战练习：实现选项卡 |
| JavaScript事件流机制 | 事件范例、事件绑定两种方式 this与事件对象 JavaScript事件流、addEventListener详细用法 事件冒泡、阻止默认事件、事件代理 实战：实现简易todo 使用事件代理优化 |
| 更多事件类型 | click、dblclick、mousedown、mouseup、contextmenu mouseenter和mouseleave keyup、keydown 实站：实现一个安全键盘 change、input事件 submit事件 cut©&paste DOMContentLoaded、load |
| 浏览器加载机制 | 从URL输入到页面展现 重绘和回流 JavaScript的加载 CSS的加载 白屏与FOUC 异步加载async与defer的区别 域名、DNS、服务器的关系 |
| BOM(navigator、history、localStorage、cookie、session、session storage、jwt | navigator、history api pushState、repalceState、onpopstate实现单页 localStorage的特点和用法，给localStorage设置过期时间 session storage cookie的特点和用法 session机制 jwt原理 |
| JS项目实战 | 完整的项目实战 |
| JS 世界观之内存图 | 内存使用规则 内存分区Stack和Heap 重新认识 window 对象 对象的共有属性 原型链 画出JS世界 对象与函数 |
内存图 2 之 Call Stack | 函数与函数调用的区别 Call Stack 是什么 如何让 Stack 溢出 作用域与闭包 |
| 构造函数与类 | 自制一个构造函数 隐藏属性和共有属性 构造函数标准写法箭头函数不能当构造函数 class语法 |
| 如何封装一个库 | 闭包的作用解构赋值介绍 用闭包实现 jQuery 用构造函数和类实现 jQuerywindow和Window的区别 class的限制 this与5种函数调用形式、this的面试题、this与箭头函数、函数重载 |
| 封装实战 | MDN文档有多好用 Date API 实现 time.prototype.parts 实现 time.prototype.add 实战：判断闰年、取当月最后一天、实现格式化输出 |
| 任务队列与微任务队列 | 新的调试方式 不靠谱的 setTimeout 内存图之任务队列 微任务队列 |
| server.js 与 AJAX | Nodejs开发第一个server 用server.js创建网站 AJAX 封装 AJAX |
| 回调与异步 | 同步地摇色子、异步地摇色子 什么是异步、轮询与回调 什么是回调地狱 Node风格的回调 |
| 请求、响应、Cookie、跨域 | 请求是什么、响应是什么 wireshark抓包演示 Cookie与Session 同源策略 跨域之CORS JSON是什么 跨域之JSONP 跨域之反向代理 |
| EventEmitter 与 Promise | 实现发布订阅 Promise介绍 Promise API Promise的实现 |
| Axios 与 Mock | 新的调试方式：Vite 安装Axios 如何Mock 如何查看Axios英文文档 Axios使用方法 |
| 面试题精讲 | 面试策略 setTimeout面试题 call、apply、bind面试题 this面试题 闭包面试题 其它面试题 |
| ES 6 语法汇总 | ES5新特性汇 ES6新特性 ES7新特性 ES8之async和await ES9、10、11在哪看 |
| JS 模块化概论 | 代码组织方法一：注释 代码组织方法二：函数 代码组织方法三：命名空间 代码组织方法四：立即执行函数 代码组织方法五：CommonJS 代码组织方法六：AMD 代码组织方法七：ESM |
| Webpack 的使用 | 模块化的后遗症 为什么选 Webpack watch命令：边开发边预览 server命令：自动开启服务器 开发模式和生产模式 配置htmlWebpackPlugin 如何安装依赖 如何引入CSS 插件：CSS单独打包 如何引入图片 按需加载，打包成两个JS 如何看Webpack文档 |
| 脚手架的使用 | 使用vue-cli babel是什么 typescript是什么 SCSS是什么 eslint是什么 CRA的使用 Vite的使用 |
| MVC架构模式 | 用对象组织代码 update与重新绑定事件 用Class组织代码 合并render和bindEvents 引入模板引擎、封装 events、使用继承 MVC架构模式、model、view、controller model与发布订阅、让model继承eventEmiter、使用 class 实现继承
|
| Vue、React项目选择 | Vue路线主要内容 React路线主要内容 如何选课程项目 |
| 项目实践 (可选4个项目) | ✦个性化定制项目，让学生的项目不再千篇一律； |
| Vue2 开发印象云笔记 | Vue2、Vue CLI、ElementUI、Axios、Vuex、Vue
Router |
| Vue2 多人共享博客 | Vue2、VueCLI、ElementUI、Axios、Vuex、VueRouter |
| Vue2移动端手帐 | Vue 2 + TypeScript + Vue Router + Vuex |
| 造Vue2 UI 组件库和官网 | Vue、Sketch、单元测试Mocha&Chai、自动化测试Karma、持续集成TravisCI |
| Uniapp抽奖小程序 | Vue、Uniapp |
| 造Vue3UI组件库和官网 | Vue3、Vite、TypeScript、VueRouter4 |
| Vue3 山竹记账 | Vite、Vue3、TypeScript、Pinia、JWT、VantUI、TSX、VueRouter4、Axios... |
| React 山竹手帐 | React18、ReactRouter6、ESLint、TypeScript、Zustand.js、Axios、JWT、SWR... |
| React 大屏可视化 | React、Echart.js |
| React UI组件库 | React、Webpack、TypeScript |
| 原生项目 | 原生造轮子系列，如 造简易React 造简易ReactHooks 造简易Redux 造简易Vue 造JQuery 造Express.js 造符合Promise A+规范的Promise 造手势库 造模块加载器、打包器等等 原生应用类项目，如 音乐播放器 在线Markdown转PPT平台 个人导航站等等 |
04/关于老师
硕士毕业于北京航空航天大学，前百度、阿里巴巴工程师，饥人谷创始人，饥人谷前端课程主讲老师。主讲或者录制的原创课程几十门，教学(含直播、录播)时长数千小时，写过编程相关文章上百篇，主创的前端专栏《饥人谷前端学习指南》
获赞4.9w，亲自带就业班40多期，讲课经验极其丰富，学员遍布大中小厂。
饥人谷 CTO，在谷里主导在线教育平台和Saas系统冰草约课的开发，华中科技大学毕业，10年编程经验，之前在腾讯阿里工作。在知乎和b 站有数万粉丝。做讲师带过的学生数千人，去大厂的也不计其数。不是大厂学生做过直播分享经验，直播录屏在饥人谷官网或者b站查看。
05/课程保障？
入学1周内且任务5之前，可无条件全额退款；
退费承诺写入正式合同；
支持边学边付（非分期平台分期，无需贷款）；
承诺简历和求职辅导服务到就业为止；
06/费用&咨询联系
07/这些问题您可能关心
问
饥人谷有往期数据吗？
问
和其他机构相比你们有什么特色？