作为一名前端开发工程师，我以多年的工作经验、以师姐的身份给想入行web前端的朋友们一些建议，希望对你们有所帮助！
我是科班出身，在大二的时候就开始接触网页设计了。因为学校的网页设计课程太过基础了，所以那时候的我就开始在网上自学网页设计。学了半年之后，我就开始想找一点兼职来做，随便提升一下自己的技术水平。后来找着找着，就发现有前端开发这个岗位。很好奇，就网上百度了一下。
原来网页设计和前端开发的区别是：网页设计偏向于设计，而前端开发偏向于代码。我从自身的优劣势去考虑，我从小对设计就没有那么在行，相比于那些设计能力强的人来说，我处于劣势，而且做设计的大部分都是女孩子居多，而我不太喜欢女孩子多的地方。对于web前端开发，没有java等后端那么枯燥、逻辑性强，而且前端可以一边开发代码，一边看自己开发出来的界面效果，这种感觉特别有成就感和自豪感！
于是，我就开始了我web前端之路。
这一开始，就快3年了。
前端是这几年才刚刚出现的，我那时候刚刚开始正好是市场稀缺的时候，所以我很好的抓住了这个风口。现在很多人都纷纷转行做前端，前端是技术行业中最容易入门的一个，不管你有没有学过编程，不管你会不会英语，只要你全身心地用3个月去系统学习，我保证你可以拿到5k起的工资。如果想要拿到更高的工资水平，也是可以的，具体怎么做到，我就不详细在这里讲了，想了解更多的，可以私聊我。
我今天就讲一下前端入门，把我这几年来的工作经验和建议分享给想要入门前端的小伙伴们，希望你们能够快速学会，能少走一些坑，能够找到前端的工作！
入门web前端主要分为3个阶段：
1、网页编程（HTML、CSS、JavaScript）
HTML和CSS这个阶段的内容是最基础的，也是最简单的。但是不是简单基础的东西就不需要学习了，往往越是简单的东西越要重视，如果连基础的都学不会，后面那些难的就更加不用说了。就好比盖房子，首先把地基打牢，后面再进一步去深化。
HTML和CSS的学习，你可以去腾讯课堂或者慕课网上面去查找相关课程学习，网上很多这方面的课程学习的，这一块的学习你不需要找很多雷同的学习课程学习，你只需要在里面找到一系列HTML和CSS加起来大概4-5天的内容课程跟着视频学习并且一边看一边实操，把静态页面制作出来就基本搞定了。如果你想了解更多，或者喜欢看书的，我也可以推荐《HTML与CSS入门经典》。
JavaScript是至关重要的一个阶段。如果把这部分给打扎实了，后面无论前端出什么新的框架，你都能清楚明白里面的底层逻辑。我推荐有条件的话，最好买书籍回来研究《JavaScript权威指南》，这本书非常不错，是经典书籍来的。
如果你不喜欢看书的话，那么你就去W3C官网（ https://www.w3school.com.cn/h.asp）去学习，结合网上的一些教程一起学习，还是推荐腾讯课程或者慕课网，这部分内容要反复去学习，多看几遍，把它吃透。对于JS的基本数据类型、循环语句、对象、数组、事件的绑定、定时器、function函数、DOM、事件、AJAX请求、面向对象等内容都是重中之重，无论是面试还是项目开发都是经常出现的。所以这部分内容，你大概需要用到20天左右去深入研究学习，尽量结合项目实操来一起学习，一切的理论都需要通过实践去验证，因此能否学会，就看你操作起来的效果了。
HTML+CSS+JavaScript这三块内容你用一个月时间去搞定，基本是没有问题的。在开发项目过程中，如果不懂或者忘记了，立马去看W3C文档，这样一边实操一边发现自己的熟悉程度去到哪了，同时也能加深对技术的印象。
W3C开发文档
前端开发不需要配置环境，只需要有一个编辑器用来开发，然后在浏览器上查看效果就可以了。编辑器我推荐用WebStorm，浏览器的话我推荐使用Chrome谷歌浏览器就可以了。
WebStorm
2、基础进阶（HTML5、CSS3、JQuery、Bootstrap）
用一个月把基础搞定了，那接下来就是进阶啦。
进阶的内容相对来说会比较多，有了基础知识功底，接下来这个月就是要进入魔鬼训练了。
用2天时间把HTML5的内容学完。推荐可以到菜鸟教程（https://www.runoob.com/html/html5-intro.html）学习。
菜鸟教程
对于HTML5的新特性、跟HTML的区别，经常会被作为面试题来考。所以把这部分内容学扎实，HTML5才是前端的入门级别！
接下来就是CSS3。
CSS3用3天时间来学习，推荐可以去W3C文档（https://www.w3school.com.cn/css3/index.asp）。面试中经常会考到的内容：选择器、动画、浏览器的兼容性等。
接下来就是JQuery。
jQuery的话，推荐直接去jQuery官网（http://jquery.cuishifeng.cn/）一一对着里面的API进行实操一下。jQuery是一个 JavaScript 库，它极大地简化了 JavaScript 编程。所以一般公司没有特别说一定要写原生js的话，都会用jQuery框架，这样极大提高开发效率。
jQuery
这些的实操的话，你可以自己去网上找一些项目来做，或者看着别人的效果图来实现。如果不会的话，你也可以去网上找一些开源的项目，推荐GitHub（https://github.com/），上面会有很多大牛分享的源码，你可以看别人的源码来自己一步步做。或者还可以去腾讯课程或者慕课网上找一些专门带你实操项目的课程来一边听一边跟着开发，这样就能很快上手。我曾经都是这么过来的，这样学习的效率和掌握程度比较快。
下面讲一下Bootstrap。
Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。说到响应式布局就需要用到Bootstrap，它里面的 CSS 能够自适应于台式机、平板电脑和手机，它支持移动设备和浏览器，只要会css和html就很容易上手。推荐可以去看一下官方文档学习Bootstrap官网（https://www.runoob.com/bootstrap/bootstrap-intro.html）。移动设备的话，就会涉及到屏幕适配问题，ViewPort的运用和rem单位的转化了。
3、前端框架（Vue.js、angular、微信小程序）
到这里前端入门内容已经算是学完了，但是如果只是拿着上面那些技能去面试，肯定找不到工作，因为现在找工作都会问你会哪些前端框架。如果你连现在最火的一些框架的最基础的都不会的话，那你就不算一个前端开发工程师。
所以接下来用一个月时间学习前端框架，先从最基础1.0开始，学会了再在基础上进行进阶，这样就没有太大问题。
目前公司的招聘要求中都会有这三样，VUE、Angular、微信小程序，这些都是目前的主流技术。
学习这三门技术，你可以去到他们的官网去学习。我当初学习的时候，都是一边看官方文档，一边实操，遇到不懂马上看文档。不过我在对这些东西一窍不通时，是先去网上看视频，别人讲出来的东西会通俗易懂，然后自己再边实操边翻阅文档。技术的学习不是背书，而是实操理解。
VUE官方文档（https://vuejs.org/）
angular官方文档（https://www.angular.cn/）
微信小程序官方文档（https://developers.weixin.qq.com/miniprogram/dev/framework/）
微信小程序的话，需要下载微信web开发者工具，直接在上面进行代码编写和实时看效果。
以上内容的学习官方文档上都写的很详细，遇到不懂的马上查看文档。
如果在开发中遇到不懂的问题，可以去知乎、简书、CSDN上面去查找答案。平时也可以多去这些社区上逛逛，利用碎片时间，你也可以学到很多东西的。
最后，给大家一个福利，我已经整理出了一个前端从入门到高级的学习课程视频。
《
web从入门到高级
》
我是爱码字、爱瑜伽、爱码代码的小燕子，原创不易，如果你想了解更多关于IT技术精华，请关注 @小小燕雯
如果你想要上面讲到的《web从入门到高级》学习课程视频，可以私聊我“前端”，免费送给你哦！
网友评论