2020年最新版Web前端学习路线图-前端小白入门必读-pink老师推荐
Hello,大家好,相信很多学习前端的小伙伴,会有很多的疑惑: 我要学习那些技术? 我要到哪里去学习这些技术呢? 学习这些技术的目的对就业有什么帮助呢? 我学到什么程度可以胜任工作? ...
这里,pink老师给你们最全的解答。
1. HTML5 + CSS3
根据web前端发展史,建议大家先学习pc端页面开发。 包含: HTML5、CSS3、浮动、定位、盒子模型、高级技巧等等。 不用说,这是我们前端入门的最基本要求,目的是能完成页面的布局开发,这部分必须精通。 这部分知识比较简单,不要去买书看了(太浪费时间),直接看pink老师视频就够了哈。 https://www.bilibili.com/video/av80149248
学完之后,只要网上看到喜欢的页面,就可以模仿下来,意味着你掌握成功。
2. 移动端页面开发
我们先学习了pc端页面开发,但是现在移动端太常见了,所以我们也需要做移动端页面开发。 主要学习移动端常见布局:流失布局、flex布局、rem布局、响应式布局等。其中市场rem布局用的最多了,重点掌握。 网上相应的布局视频很多,可以重点学习。 最终起码把几个大厂的移动端首页写出来才可以。比如淘宝、京东、小米等。
3. JavaScript 系列
JavaScript是我们前端的核心,需要精通掌握,可以直接学习ES5,ES6就可以了。这样就可以让我们页面交互效果动态展示起来了。 包含: JavaScript 基础语法及 Web API 开发动态交互(⽹⻚特效)的⽹⻚、JavaScript ⾼级特性,如⾯向对象、闭包、事件循环等技术、 jQuery也要了解一些,现在市场很多老项目还是大量有jQuery的,你说不会jQuery,人家不相信你前端工作过。。。
学习渠道:
1. 最权威的JavaScript网站 MDN: https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/JavaScript_basics 当然还可以去菜鸟教程等。
2. 各种视频网站, 首推B站, 还有 慕课,腾讯课堂等。搜索相关关键字即可。
3. JavaScript 相关面试题可以去 掘金、牛客网、github 等网站。
4. 相信我,最好的还是百度。 学到js ,你应该要有自己的 github 或者码云的账号了,里面有大量资源可以让你去查阅学习。
推荐的书籍: 《JavaScript DOM 编程艺术 》、 《JavaScript高级程序设计》、 《你不知道的JavaScript 》、 《锋利的jQuery 》等, 建议直接网上搜电子书即可。
4. Ajax 和 git
前面我们写的所有页面都是静态的,也就是所有的数据都是假数据,实际开发的时候,数据都是从后台获取过来的,那么如何获取后台的相关数据呢? 答案就是 ajax。
前端必备哦 通过 Ajax 实现与服务器的通信,获取服务器提供的数 据,然后动态渲染输出,实现动态⽹⻚的开发。
学习 git 版本管理⼯具,实现企业级多⼈协同开。 学到这里,最好有个项目练习, 这样可以更好的明白动态网站是如何开发的。 现在网站都是流行前后端分离,这个阶段我们能知道如何调用后端接口。
5. Node.js
相信学ajax 的时候,很多教程搭配php或者其他后台语言来学习,但是我更推荐ajax和node来学习,毕竟都属于我们前端内容,省去在学习另外一门语言的痛苦。
目的: 通过学习 Nodejs 和 MySQL 深⼊理解⽹站的本质,以及前端在整个⽹站开发中的⻆ ⾊,为在企业中前后端协同开发提供帮助。体会 Nodejs 在前端⼯程化开发中的重要作⽤。
学习推荐地址: 推荐一个博客: https://cnodejs.org/getstart
6. VUE
前端三大框架 你肯定听过 vue 、react 、 angular。 国内最火的框架是 vue,而且vue3.0 马上也要发布了,肯定还会火一把。 有了这些框架,我们开发页面更加快速和高效,性能维护有了极大提高。 目的是:掌握 MVVM、模块化、组件化、状态管理、路由等技术在实战项⽬的应⽤,丰富开发经 验、提升实战能⼒,为⾼薪就业提供保障。
Vue官网就非常全面: https://cn.vuejs.org/ 而且b站上面也非常多的视频教程。 学完开发一个pc端和移动端的网站练手。
7. React
如果说vue国内最火,那么国外react是最火的,而且 现在react在国内大厂使用非常普遍,也有越来越多人选择react。
8. 微信小程序
小程序也能增加我们就业方向,也需要我们学习。 学习并掌握⼩程序开发的相关知识,能够独⽴完成⼩程序的开发。通过学习跨平台⼩程 序技术⽅案,实现⼩程序的跨平台⽀持。 首推 uni-app 和 taro 来学。也是火的一塌糊涂。
最后一句话, 一个人自学很难,要么参加培训,要么拉个志同道合的人一起监督学习, 要是能找个师傅最美了。。。 加油吧,各位前端大神们~~~~
2020年最新版Web前端学习路线图-前端小白入门必读-pink老师推荐的更多相关文章
- 2019前端学习路线心得-黑马程序员pink老师
在规划之前先给大家分享几点心得哈: 1. 学习,特别是在线学习,是非常辛苦的事情,为了少走弯路, 所以一定要系统学习,多借鉴与前辈们总结出来的经验. 2. 不要相信任何说 一周掌握 css, 一周学完 ...
- 2015 WEB前端学习路线图
2015 WEB前端学习路线图,欢迎小伙伴补充 @落雨
- Web 开发者学习路线图
2017 Web 开发者学习路线图(头图源自谷歌) 本文是源自 Github 上 Kamran Ahmed 建立的一个仓库.在文中,作者为他的老教授分享了一组成为前端与后端开发者以及 Devops ...
- 2020年全新web前端学习路线图,学完就业20K!
第一阶段:HTML5+css 配套学习视频: 前端小白零基础入门HTML5+CSS3 第二阶段:移动web网页开发 移动web进阶教程 第三阶段:JavaScript网页编程 前端与移动开发基础入门到 ...
- 2019 Web开发学习路线图
以下 Web 开发人员学习路线图是来自 Github developer-roadmap 项目,目前已经有繁体版翻译 developer-roadmap-chinese. 主要有三个方向,分别为前端开 ...
- 2018年web前端学习路线图
前端的的技术一直在变化,更新和变革,现在基本是三驾马车(vue,angualr,react)主导整个前端框架,但是无论对于新人或者有经验的程序员,这些知识在必须掌握 前端必会技能 上图罗列了整个前端的 ...
- 个人前端学习路线图与github优秀前端开发者的路线图推荐
1.个人目前学习的路线图 2.github优秀前端开发者的路线图推荐 打开github首页,在搜索框输入developer-roadmap,搜索github前端路线图 选择kamranahmedse/ ...
- web前端开发学习路线图
Web前端是一个入行门槛较低的开发技术,但更是近几年热门的职业,web前端不仅薪资高发展前景好,是很多年轻人向往的一个职业,想学习web前端,那么你得找到好的学习方法,以下就给大家分享一份适合新手小白 ...
- 【web前端学习部落22群】分享 碰撞的小球开源小案例
对于课程中的疑问,大家可以加 web前端学习部落22群 120342833和其他老师还有众多的小伙伴们进行沟通交流哦,群里还有不少技术大拿.行业大牛 可以一起探讨问题,我们也会安排专业的技术老师为大家 ...
随机推荐
- OLE DB访问接口“MICROSOFT.JET.OLEDB.4.0”配置为在单线程单位模式下运行,所以该访问接口无法用于分布式
OLE DB访问接口"MICROSOFT.JET.OLEDB.4.0"配置为在单线程单位模式下运行,所以该访问接口无法用于分布式 数据库操作excel时遇到的以上问题的解决方法 解 ...
- Ubuntu gnome 美化与个别组件安装
1. 安装 gnome 工具 sudo apt install gnome-tweaks# 打开时中文直接选择 "优化" 即可 1.1. gnome 官网 # https://ex ...
- Ⅱ:python入门
一.编程语言介绍 编程语言的分类: 机器语言 汇编语言 高级语言(编译型.解释型号) 总结: 执行效率:机器语言>汇编语言>高级语言(编译型>解释型) 开发效率:机器语言<汇编 ...
- 攻防世界Mobile5 EasyJNI 安卓逆向CTF
EasyJNI 最近正好在出写JNI,正好看到了一道JNI相关的较为简单明了的CTF,就一时兴起的写了,不得不说逆向工程和正向开发确实是可以互补互相加深的 JNI JNI(Java Native In ...
- 7-3 jmu-python-回文数判断(5位数字) (10 分)
本题目要求输入一个5位自然数n,如果n的各位数字反向排列所得的自然数与n相等,则输出‘yes’,否则输出‘no’. 输入格式: 13531 输出格式: yes 输入样例1: 13531 输出样例1: ...
- 前端进阶系列(三):HTML5新特性
HTML5 是对 HTML 标准的第五次修订.其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入.HTML5 的语法是向后兼容的.现在国内普遍说的 H5 是包 ...
- 前端每日实战:74# 视频演示如何用纯 CSS 创作一台 MacBook Pro
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/MXNNyR 可交互视频 此视频是可 ...
- 【Geek议题】合理的VueSPA架构讨论(上)
前言 web前端发展到现代,已经不再是严格意义上的后端MVC的V层,它越来越向类似客户端开发的方向发展,已独立拥有了自己的MVVM设计模型.前后端的分离也使前端人员拥有更大的自由,可以独立设计客户端部 ...
- idea使用Tomcat部署war 和 war exploded的区别
war模式:将WEB工程一包的形式上传到服务器中.war exploded模式:将WEB工程以当前文件夹的位置关系上传到服务器.解析:war 模式这种可以称为是发布模式(完整的项目),将项目打成war ...
- I - A计划 HDU - 2102
A计划 Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submiss ...