零基础如何学前端，如何规划？

Posted 2021-06-22 BOM485480

一直以来，IT行业都是以高薪资、高福利赢得不少求职者的青睐，而对于WEB前端而言，亦是如此。

对于零基础学习前端的人总会有两个问题：

前端学习路线是什么？

在入门阶段，你首先要学会最基本的技能：根据UI的设计稿，实现html的静态页面制作。这就要求你得掌握HTML、CSS页面布局排版、样式美化等技能。在开发初级这一个阶段，我们的目标是达到前端开发行业的基本要求，这个阶段我们要重点掌握这两方面的能力：利用jQuery、Bootstrap等框架开发复杂的交互功能与效果；利用HTML5、CSS3、Canvas进行移动端开发。最后是开发进阶阶段，在这个阶段，我们要重点掌握以下两个方面的能力：在实现功能的同时，考虑代码的优雅性，注重代码的性能和重用性；深入理解前端框架实现原理，并且能够开发和重构通用的前端组件。

零基础学习web要多久？

学习web前端的方式有很多种，可以通过自学，看书，网上找一些相关的视频，或者是进培训班。但是学习的时间还是根据每个人的掌握情况来定，现在市场上有很多的培训机构，大部分都是培训6个月左右的，当然如果自身学习能力比较强，就可以提前结束学习，投入到工作中去。

如何规划？需要学习哪些知识点。

阶段一 : 前端基础
学完前端的基础知识，大家基本能够根据PSD文件文件，完成PC端静态网页的开发工作，但是学完此阶段，尚不能够达到企业用人标准。

HTML：浏览器与浏览器内核、HTML基本结构、HTML常用标签。

CSS：CSS介绍和CSS样式表、CSS基本选择器、CSS复合选择器、 CSS三大特性。

阶段二 : 移动Web网页开发
学完移动Web网页开发,大家能够完成移动Web网页、响应式页面以及炫酷页面的开发工作，当然完成此阶段，任然不能够达到企业用人标准。

H5C3进阶：vscode编辑器基本使用、HTML5新增标签。

Flex 伸缩布局：移动端基础知识、Flex伸缩布局基础知识。

移动web开发：媒体查询、less介绍和使用、rem适配及原理。

阶段三 : javascript网页编程
学完JavaScript网页编程，相信大家已经能够完成PC端网页、移动Web网页、响应式页面中的功能和特殊效果的开发工作，具备一定的企业基础用人标准，但尚未达到初级前端开发工程师水平。

JavaScript基础语法：计算机基础和JavaScript介绍、JavaScript变量、JavaScript数据类型、JavaScript操作符、 JavaScript数组和冒泡排序、 JavaScript函数及应用、JavaScript作用域及预解析、JavaScript对象、JavaScript简单类型和复杂类型。

WebAPI编程：API 和 Web API、DOM介绍、 BOM介绍及应用、this指向和js执行机制、location、navigator、history对象、 offset、client、scroll三大家族介绍及案例应用、缓动画的原理和封装。

jQuery快速开发：jQuery介绍及常用API导读、jQuery链式编程及样式操作、 jQuery事件绑定和解绑、jQuery插件的使用。

JavaScript高级：面向对形象编程介绍、类和对象、构造函数和原型对象、forEach、some。

Object.defineProperty方法、函数进阶、call、apply、bind的使用、 闭包及应用、递归及应用、正则表达式及应用、ES6中的let和const、ES6解构赋值、ES6箭头函数、剩余参数和拓展运算符、 Array实例方法、ES6模板字符串和set数据结构。

阶段四 ：Node与Ajax
学完阶段四的内容，大家能够完成前后端数据交互、基于前后端分离模式、传统模式的开发的工作，学完此阶段，具备企业基础用人标准，能够达到初级前端开发工程师水平。

Node+Gulp：node介绍和环境安装、node模块化、gulp使用、服务器和http协议、Promise。

MongoDB+Express：MongoDB数据库和数据库的增删改查、mongoose验证、art-template模板引擎使用、Express框架。

Ajax：Ajax基础知识、Ajax函数封装、 CORS、jQuery中Aajx方法的使用。

Git和GitHub：git配置和使用、github及多人协作开发、git补充内容。

阶段五 : 前端工具和框架
掌握前端工具和框架，大家能够实现基于Vue技术栈项目的开发能力，学完此阶段，具备企业用人标准，能够达到中级前端开发工程师水平。

Vue基础：axios和vue-resource、vue动画、vue组件、vue路由

webpack：webpack介绍与安装、webpack之loader配置与使用、webpack与vue结合使用。

在前端领域混了这几年，总结了一套前端学习的精讲视频和学习路线，如果有对前端开发感兴趣的伙伴，不管你是想转行，或是大学生，还有工作中想提升自己能力的web前端党，欢迎大家的加入我的前端开发交流群：603985993
希望大家诚心交流！，与企业需求同步。好友都在里面学习交流，每天都会有大牛定时讲解前端技术!也可以关注我的微信公众号：【前端留学生】
每天更新最新技术文章干货。

前端学习注意事项

1、打好基础

无论做什么都一定要有扎实的基础，参加web前端培训也不例外，只有基础牢固，才能更深入的学习新技能。作为一名初级的web前端工程师，你必须要具备最基础的技术要素：HTML，CSS和JavaScript。这是作为web前端工程师所必须要掌握的。Web前端的入门门槛其实很低的，与其他语言先慢后快的学习节奏相比，他是一个先快后慢的过程。所以在前期的学习过程中，你会很容易的掌握其基础的技能。而随着HTML5技术的广泛应用，web前端的学习也会变得更加简单。

2、注重细节

有句俗语是这样说的：“细节决定成败”，很多web前端开发者在工作过程中为了追求速度，而忽略了一些细节性的东西。比如：给代码加备注，代码的命名规范，代码的简洁等。所有的这些看似不重要，其实却严重影响了项目的进度以及自身能力的提升。在开发过程中，适当的添加备注，能够加深对技术点的印象，也便于以后在修改的过程中迅速查找;规范的代码命名能够方便团队之间的沟通，提高工作效率;而简洁的代码能够直观的展现某一块代码的作用。

3、不断加强学习

优秀的web前端工程师之所以优秀，不是因为工作的年限有多久，而是具备快速学习的能力。web前端开发是一个特殊的工作，涵盖的知识面非常广，而且互联网行业技术的更新速度是非常快的，如果没有快速学习的能力，就很难跟上时代的步伐。所以，作为web前端工程师一定要不断的学习，提升技能。祝好~