HTML是网页内容的载体内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。要熟练掌握div、table、ul li 、p、span等这些标签,这些都是最常用的。
二、CSS(Cascading Style Sheets)—样式。
一般看到web前端开发工程师的要求里面,有一个会使用css+html 或者 css+div 来进行界面布局,所以css是用于辅助html来布局和展示的,
称之为“css样式”,CSS要熟练掌握float、position、width、height,以及对于的最大最小、会使用百分百、overflow、margin、padding,标题字体、颜色变化,或为标题加入背景图片、边框等等,这些都是跟布局有关系的样式,必须要掌握的。
三、JavaScript:
学习JavaScript的基本语法,以及如何使用JavaScript编程将会提高开发人员的个人技能。
四、操作系统:
了解Unix和Linux的基本知识,对于开发人员有益无害。
五、网络服务器:
了解Web服务器,包括对Apache的基本配置,htaccess配置技巧的掌握等。
javascript:
数组常用方法的使用,比如遍历有forEach,map,filter,every, some,reduce,操作方法有splice,slice, join,push,shift, pop,sort等基本数据结构,引用类型(对象,数组)基本逻辑运算if else, switch,三目运算:?,for/while循环等字符串常见api(如replace,slice, substr,indexOf)基本正则使用变量作用域,作用域链,变量提升,函数声明提升对象基本用法,面向对象编程(关注优就业,学习更多IT知识)
css:
基本盒模型(border/content/padding等)4种常用定位(static/absolute/relative/fixed)常用布局方式(浮动布局/弹性布局flex/自适应布局/网格布局grid)css3基本样式与动画(transition,animation)
html:
新标签基本用法和使用head标签作用与用法(主要是meta属性的用法)
其次根据不同企业对技术栈和职位级别的要求。
对于react技术栈为主的,需要掌握以下知识:
react+redux+redux-thunk/redux-saga+react-router,并熟悉ant-design等第三方ui库这是比较基础的岗位能力。
对于vue技术栈为主的,需要掌握以下技能:
vue+vuex+vue-router,并熟悉elementUI等第三方ui库。
对于中高级前端岗位,还需要对webpack,gulp等前端工作流有一定或者较深的理解。
对于一些没有编程经验的人来说,一开始就学习 web 前端可能会让你觉得比较困难。
因为你的能力还处在初始阶段,你根本不知道你缺少哪方面的知识。
所以,在正式学习之初,你非常有必要先了解一下前端的能力模型。
前端工程师,都需要掌握哪些能力呢?
简单粗暴点,只需要掌握这张图里的能力就行了。
开个玩笑,新手的话,还是要循序渐进。
LV1:学会制作静态页面(Web + Mobile)
HTML、HTML5:
理解如何浏览和创建网页、基本的语法规范、常用标签及属性、网页之间的链接与跳转、标签节点层级节点。
CSS:
基本语法和三种书写位置、选择器和格式化排版、盒模型的高级用法、常用布局模型
LV2:学会制作动态页面
JavaScript :
基础语法和变量、数据类型和数据类型转换、条件判断、循环语句、函数、数组等内置对象
(有了这三个,你基本可以写一些简单的页面了,但是仍然需要学一些经典的库和框架。)
经典库:比如 jQuery,YUI2,YUI3
经典框架:比如 Bootstrap
LV3:前后端分离,打造 Web App
Vue.js/AngularJS2/React
Node.js,使用 Express/Koa 配合 MongoDB/Redis 涉足到后端领域
自动化测试
其他:
熟悉 Git 与 Shell 的使用
学习路径
1.入门 HTML + CSS
这里推荐一本书,Head First HTML与CSS(第2版)。从原理到方法都介绍得很详细,通俗易懂,活泼有趣。html和css入门力荐。学完大概 1-2 个周。
2.JavaScript + jQuery
JS:看 w3school 教程,花 2-3 天,但 w3school 教程有点过时,看完只能了解个基础,深入学习的话,推荐看《JavaScript 权威指南》,《JavaScript 高级程序设计》。两部都是大部头。看完还需要在去网上找 ES6 资料学习,推荐 ECMAScript 6入门,深入浅出ES6。
jQuery 的话,去官方文档看即可。
熟练掌握大概需要1个月。
3.Vue.js/Angular 2/React
Vue.js:查看官方中文文档大约需要 3 天左右。Vue 上手容易,但没有其他前端框架使用基础的人只看官方文档难以理解 Vue 高级用法以及在生产环境中的运用。目前 Vue 社区还比较小,除官方文档外难以找到优秀资料。
4.webpack & 测试
webpack 是目前应用最广泛的前端模块管理工具,功能强大。
测试相关的框架多且杂,大多是社区产物,较难系统学习。
以上的这些资源足够你学习几个月的,但它们不会带你走得更远。
但是,如果你已经学了这么多,你已经有足够的能力去继续前端的学习,直到你可以完美胜任一个前端工程师的要求。
最后留一点小的建议
你会经常地遇到 bug 和其它一些问题。这可能会让人沮丧,但你要尽量保持冷静,并系统地去思考。记住实践是解决问题的最佳方法。
大家采集的是石头,但是必须时刻展望未来的大教堂。
持续做一些小改进,慢慢地你就会惊奇地发现你的经验得到了怎么样的发展,你的技能得到了怎样的提升。