前端的的技术一直在变化,更新和变革,现在基本是三驾马车(vue,angualr,react)主导整个前端框架,但是无论对于新人或者有经验的程序员,这些知识在必须掌握

前端必会技能

上图罗列了整个前端的一些技术架构,可能有些东西已经过时了,但是以下这些东西必须得了解和掌握。

  1. html的语法、格局,常用的标签极端作用,了解标签的嵌套。

  2. 学习运用firefox+firebug或许chrom的调试工具,可以运用这些工具调试html、css、js、断点调试、抓包 2.怎么引入css、js。

  3. 了解id、class属性的区别,学会css的常用选择器,了解盒子模型(padding,margin,border,width,height,),css坐标系,css布局(position的absolute、relative 、fixed、static),css浮动(float:left、right )和清除浮动clear),display:inline、block、inline-block、flex 3。

  4. 了解掌握js的执行顺序,基本的编程基础(变量、运算、流程操控、数组、调用函数、自定义函数、对象)、json、js的dom操作、js的事件机制(委托、绑定、监听,冒泡和阻挠冒泡,兼容性),了解ajax的xmlhttprequest及其创建办法(多浏览器兼容)、跨域,明白其作业原理。

  5. 熟悉http协议对web开发的方方面面都有不少帮助,比如了解及运用ajax,比如调试程序、抓取数据等等,不过http是一个很杂很细的东西,内容很多,我建议也囫囵吞枣式地学习,先了解、熟悉简略的,今后在项目中遇到深化点的再进一步学习。

  6. 树立服务器,弄个傻瓜服务器比如wamp,phpstudy等软件,可以一键树立一个apache+php+mysql的服务器,前期可以把你的静态页发布到本地服务器,运用本地服务器配合ajax学习。

  7. 熟悉或者至少了解node的基本语法和用法,在现在流行的手脚架配置都离不开node,而且node可以启动服务器,正真做一个全栈工程师。

  8. 最后推荐一下我的前端教程学习群640633433,如果你想制作酷炫的网页,想学习前端知识,小编欢迎你的加入。小编会在群中不定期分享学习干货、趣味源码,包括我精心整理的一份前端零基础教程。欢迎各位小伙伴来一起学习!

  9. vue,angular,react至少精通其中之一,了解内部运行机制,至少熟读源码。

2018年web前端学习路线图的更多相关文章

  1. 2015 WEB前端学习路线图

    2015 WEB前端学习路线图,欢迎小伙伴补充 @落雨

  2. 2020年全新web前端学习路线图,学完就业20K!

    第一阶段:HTML5+css 配套学习视频: 前端小白零基础入门HTML5+CSS3 第二阶段:移动web网页开发 移动web进阶教程 第三阶段:JavaScript网页编程 前端与移动开发基础入门到 ...

  3. 2020年最新版Web前端学习路线图-前端小白入门必读-pink老师推荐

    Hello,大家好,相信很多学习前端的小伙伴,会有很多的疑惑: 我要学习那些技术? 我要到哪里去学习这些技术呢? 学习这些技术的目的对就业有什么帮助呢? 我学到什么程度可以胜任工作? ... 这里,p ...

  4. Web 开发者学习路线图

      2017 Web 开发者学习路线图(头图源自谷歌) 本文是源自 Github 上 Kamran Ahmed 建立的一个仓库.在文中,作者为他的老教授分享了一组成为前端与后端开发者以及 Devops ...

  5. 每天成长一点---WEB前端学习入门笔记

    WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...

  6. 【web前端学习部落22群】分享 碰撞的小球开源小案例

    对于课程中的疑问,大家可以加 web前端学习部落22群 120342833和其他老师还有众多的小伙伴们进行沟通交流哦,群里还有不少技术大拿.行业大牛 可以一起探讨问题,我们也会安排专业的技术老师为大家 ...

  7. web前端学习部落22群开源分享 左边菜单导航

    有大量web前端开发工具及学习资料,可以搜群[ web前端学习部落22群 ]进行下载,遇到学习问题也可以问群内专家以及课程老师哟 <!DOCTYPE html> <html lang ...

  8. 【前端】Web前端学习笔记【2】

    [2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...

  9. 立方体旋转 【web前端学习部落22群120342833】

    效果: HTML部分: <body class="body"> <div class="rect-wrap">   <!-- // ...

随机推荐

  1. MySQL数据类型转换函数CAST与CONVERT的用法

    MySQL 的CAST()和CONVERT()函数可用来获取一个类型的值,并产生另一个类型的值.两者具体的语法如下: 1.CAST(value as type) 就是CAST(xxx AS 类型) 2 ...

  2. uImage和zImage的区别

    1.各种文件的意义 vmlinux  编译出来的最原始的内核文件,未压缩. zImage   是vmlinux经过gzip压缩后的文件. bzImage bz表示“big zImage”,不是用bzi ...

  3. 手淘的flexible.js解决手机适配问题

    如何使用flexible.js做手机适配 做移动端网页肯定需要做适配,以前都用的fixscreen.js,对比一下,觉得flexible.js更好吧,毕竟是大厂出的东西. 第一步要给页面加在viewp ...

  4. 关于python使用cv画矩形并填充颜色同时填充文字

    font = cv2.FONT_HERSHEY_SIMPLEX # 使用默认字体 cv2.rectangle(im, (10, 10), (110, 110), (0, 0, 255), thickn ...

  5. element-ui,router.push到其他路由,菜单栏不会高亮对应的路由

    使用饿了吗的路由,使用this.$router.push({path: ''})跳到其他的路由,菜单不会高亮. 如图所示,点击图上三个位置,需要使用this.$router.push({path: ' ...

  6. Python 之 基础知识(一)

    首先,对于初学者在一个项目中设置多个程序可以执行,是非常方便的,可以方便对不同知识点的练习和测试 对于商业项目而言,通常在一个项目中,只有一个可以执行的Python程序 一.注释 为了提高可读性,注释 ...

  7. bzoj:3085: 反质数加强版SAPGAP

    Description 先解释一下SAPGAP=Super AntiPrime, Greatest AntiPrime(真不是网络流),于是你就应该知道本题是一个关于反质数(Antiprime)的问题 ...

  8. codeforce 367dev2_c dp

    codeforce 367dev2_c dp 标签: dp 题意: 你可以通过反转任意字符串,使得所给的所有字符串排列顺序为字典序,每次反转都有一定的代价,问你最小的代价 题解:水水的dp...仔细想 ...

  9. DFS入门__poj1979

    Red and Black Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 26944   Accepted: 14637 D ...

  10. HDU_5563Clarke and five-pointed star

    Clarke and five-pointed star Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K ( ...