web开发基础之json,web开发基础知识

本文目录一览：

• 1、在 java web开发中怎么使用json？
• 2、web前端开发需要用到哪些知识
• 3、web前端开发主要技术有哪些
• 4、web前端开发需要掌握的几个必备技术
• 5、2020年Web前端自学之路指南
• 6、web前端开发需要掌握哪些知识？

在 java web开发中怎么使用json？

一、JSON建构有两种结构：

json简单说就是javascript中的对象和数组，所以这两种结构就是对象和数组2种结构，通过这两种结构可以表示各种复杂的结构

1、对象：对象在js中表示为“{}”括起来的内容，数据结构为 {key：value，key：value,…}的键值对的结构，在面向对象的语言中，key为对象的属性，value为对应的属性值，所以很容易理解，取值方法为 对象.key 获取属性值，这个属性值的类型可以是 数字、字符串、数组、对象几种。在Java中就是一种Map结构。

2、数组：数组在js中是中括号“[]”扩起来的内容，数据结构为 [“java”,”javascript”,”vb”,…]，取值方式和所有语言中一样，使用索引获取，字段值的类型可以是 数字、字符串、数组、对象几种。在Java中是一种list结构。

经过对象、数组2种结构就可以组合成复杂的数据结构了。

二、Json in Javascript

使用Json语法创建对象

var people = {“name”:”jack”,”sex”:”mail”};

可以通过这种语法创建json对象，用“{}”括起来，用“，”隔开key：value

使用Json语法创建数组

var arr =[value1,value2…];

一个包含多个people的数组 peoples = [{“name”:”jack”,”sex”:”mail”},

“name”:”lily”,”sex”:”femail”};

Json数组可以通过这种语法创建，用”[]”括起来，数组元素之间用“，”分隔开，下面是这种语法的示意图：

在使用Json格式字符串与服务器交互时候，可以利用Json扩展的方法将字符串转换成一个JavaScript对象，或者将一个对象转换成Json格式字符串。不过先要登录下载Json2.js文件。引入该包后，js对象直接用toJSONString()装换为字符串格式，字符串可以用parseJSON()转换成js对象。

访问数据

只需用点号表示法来表示数组元素。所以，要想访问 上面peoples列表的第一个条目的名字，只需在 JavaScript 中使用下面这样的代码：

peoples[0].name

利用这样的语法，可以处理任何 JSON 格式的数据，而不需要使用任何额外的 JavaScript 工具包或 API。

修改数据

正如可以用点号和方括号访问数据，也可以按照同样的方式轻松地修改数据：

peoples[0].name = “Rachmaninov”;

在将字符串转换为 JavaScript 对象之后，就可以像这样修改变量中的数据。

web前端开发需要用到哪些知识

应该熟练掌握的基础技能：

HTML4，HTML5语法、标签、语义

CSS2.1，CSS3规范，与HTML结合实现各种布局、效果

Ecma-262定义的javascript的语言核心，原生客户端javascript，DOM操作，HTML5新增功能

一个成熟的客户端javascript库，推荐jquery

一门服务器端语言：如果有服务器端开发经验，使用已经会的语言即可，如果没有服务器端开发经验，熟悉Java可以选择Servlet，不熟悉的可以选PHP，能实现简单登陆注册功能就足够支持前端开发了，后续可能需要继续学习，最基本要求是实现简单的功能模拟，

HTTP

在掌握以上基础技能之后，工作中遇到需要的技术也能快速学习。

基本开发工具

恰当的工具能有效提高学习效率，将重点放在知识本身，在出现问题时能快速定位并

解决问题，以下是个人觉得必备的前端开发工具：

文本编辑器：推荐Sublime Text，支持各种插件、主题、设置，使用方便

浏览器：推荐Google Chrome，更新快，对前端各种标准提供了非常好的支持

调试工具：推荐Chrome自带的Chrome develop tools，可以轻松查看DOM结构、样式，通过控制台输出调试信息，调试javascript，查看网络等

辅助工具：PhotoShop编辑图片、取色，fireworks量尺寸，AlloyDesigner对比尺寸，以及前面的到的Chrome develop tools，

FQ工具：lantern, 壁虎漫步

学习方法和学习目标

方法：

入门阶段反复阅读经典书籍的中文版，书籍中的每一个例子都动手实现并在浏览器中查看效果

在具备一定基础之后可以上网搜各种教程、demo，了解各种功能的实际用法和常见功能的实现方法

阅读HTML，CSS，Javascript标准全面完善知识点

阅读前端牛人的博客、文章提升对知识的理解

善用搜索引擎

目标：

熟记前面知识点部分的重要概念，结合学习经历得到自己的理解

熟悉常见功能的实现方法，如常见CSS布局，Tab控件等。

入门之路

以下是入门阶段不错的书籍和资料

HTML先看《HTML CSS: Design and Build Websites》1-9章，然后《HTML5: The Missing Manual》1-4章。

CSS先看《CSS: The Missing Manual》，然后《CSS权威指南》

javascript先看《javascript高级程序设计》，然后《javascript权威指南》

HTTP看HTTP权威指南

在整个学习过程中HTML CSS JavaScript会有很多地方需要互相结合，实际工作中也是这样，一个简单的功能模块都需要三者结合才能实现。

动手是学习的重要组成部分，书籍重点讲解知识点，例子可能不是很充足，这就需要利用搜索引擎寻找一些简单教程，照着教程实现功能。以下是一些比较好的教程网址

可以搜索各大公司前端校招笔试面试题作为练习题或者他人总结的前端面试题还有个人总结的面试题（带参考答案）

有各种各样的教程

MDN也有很多教程，更重要的是里面有详细的文档，需要查找某个功能时在Google搜索：xxx site:

也有很多优质教程

原生javascript是需要重点掌握的技能，在掌握原生javascript的基础上推荐熟练掌握jQuery，在实际工作中用处很大，这方面的书籍有《Learning jQuery》或者去jQuery官网

建一个账号，保存平时学习中的各种代码和项目。

有了一定基础之后可以搭建一个个人博客，记录学习过程中遇到的问题和解决方法，方便自己查阅也为其他人提供了帮助。也可以去或者这样的网站注册账号，方便实用

经常实用Google搜索英文资料应该经常找到来自的高质量答案，与到问题可以直接在这里搜索，如果有精力，注册一个账号为别人解答问题也能极大提高个人能力。

经典书籍熟读之后，可以打开前面必备基础技能部分的链接。认真读对应标准，全面掌握知识

继续提高

有了前面的基础之后，前端基本算是入门了，这时候可能每个人心中都有了一些学习方向，如果还是没有。

可以参考前面必备技能部分提到的那两个项目，从里面选一些进行发展学习。以下是一些不错的方面：

Grunt：前端自动化工具，提高工作效率

less css：优秀的CSS预处理器

bootstrap：优秀的CSS框架，对没有设计师的团队很不错，与less结合使用效果完美

requirejs：AMD规范的模块加载器，前端模块化趋势的必备工具

Node.js：JavaScript也可以做后台，前端工程师地位更上一步

AngularJS：做Single Page Application的好工具

移动端web开发：智能手机的普及让移动端的流量正在逐步赶超PC端

Javascript内存管理：SPA长期运行需要注意内存泄露的问题

High Performance JavaScript(Build Faster Web Application Interfaces)

Best Practices for Speeding Up Your Web Site：重要技能

####工具

chrome dev tools：前端开发调试利器，着重注意几个功能：

liveload: 修改页面后自动刷新，不用按F5

dimensions：直接在页面上测量的利器

livestyle：css样式修改后自动起效果，不需要刷新，elements修改后也能同步到代码中

image tool：测量，取色

UC二维码：移动端调试扫码必备

pagespeed，YSlow：页面性能分析和优化插件

马克飞象：优秀的在线markdown编辑器，快速写周报，做记录

watch expression：通过表达式查看当前内存中的值

call stack：查看调用栈，开启async，可以看异步调用栈（这个非常有用，尤其是ajax调试的时候）

scope variables：作用域链上的变量，非常有用

console（废话）

elements:元素样式调整，很常用

sources：代码中添加断点，单步调试，以及单步调试过程中查看内存中的对象

network：抓包查看每个请求，非常重要，前后端联调必备

timeline：分析渲染、js执行等等各个阶段，性能优化利器

emulation：模拟移动端环境，mobile页面开发必备

一些插件:

sublime text2：编码方便，插件多，速度快，性能好

emmet：提升html编码速度必备

sublimelinter + 各种语言的lint和hint：代码纠错

一些snippets：自动补全，提升开发效率

Intellij IDEA和WebStorm：集成开发环境，集成了各种功能，开发比sublime要方便，但会比较吃性能

Mark Men：测量、取色、标注利器，拿到视觉稿之后第一个打开的软件

GFW Fucker：我用红杏，可以的话买个虚拟服务器当梯子

iHosts：非常优秀的hosts管理软件，轻松修改hosts，开发调试必备

Charles：Mac 平台最好用的抓包分析工具

Rythem：AlloyTeam出品的代理抓包软件，非常轻量，安装简单，移动端（真机）开发调试很好用

Wunderlist：一个非常不错的Todo List，任务、需求多的时候管理起来很方便

####技能

前端的技能其实除了JavaScript（包括NodeJS）、HTML、CSS以外，还有很多。其实前端的技能树很大，这里只能列一些我开发中见到的说一说

#####语言基础

JavaScript：

作用域链、闭包、运行时上下文、this

原型链、继承

NodeJS基础和常用API

CSS：

选择器

浏览器兼容性及常见的hack处理

CSS布局的方式和原理（盒子模型、BFC、IFC等等）

CSS 3，如animation、gradient、等等

HTML：

语义化标签

#####进阶

JavaScript:

异步控制（Promise、ES6 generator、Async）

模块化的开发方式（AMD、CMD、KMD等等）

JavaScript解释器的一些相关知识

异步IO实现

垃圾回收

事件队列

常用框架使用及其原理

jQuery：基于选择器的框架，但个人认为不能叫框架，应该算工具库，因为不具备模块加载机制，其中源码很适合阅读钻研

AngularJS/Avalon等MVVM框架：着重理解MVVM模式本身的理念和双向绑定的实现，如何解耦

underscore：优秀的工具库，方便的理解常用工具代码片段的实现

polymer/React: 组件化开发，面向未来，理解组件化开发的原理

CSS和HTML：主要是CSS3的特性和HTML5的特性，以及浏览器处理的流程和绘制原理

DOM树、CSSOM树、渲染树的构建流程及页面渲染的过程

解析HTML、CSS、JavaScript时造成的阻塞

HTML5相关

SVG及矢量图原理

Canvas开发及动画原理（帧动画）

Video和Audio

flex box布局方式

icon fonts的使用

常用NodeJs的package：

koa

express

underscore

async

gulp

grunt

connect

request

一些理念：

响应式Web

优雅降级、渐进增强

dont make me think

网页可用性、可访问性、其中的意义

SEO搜索引擎优化，了解搜索引擎的原理

SPA的好处和问题

性能优化：

减少请求数量（sprite、combo）

善用缓存（application cache、http缓存、CDN、localstorage、sessionstorage，备忘录模式）

减少选择器消耗（从右到左），减少DOM操作（DOM和JavaScript解释器的分离）

CSS的回流与重绘

生态系统

npm

bower

spm

搭建一个属于自己的博客

git pages

hexo

jekyll

#####未来

Web Componets：面向未来的组件化开发方式

HTML模板

Shadow DOM

Custom Elements

HTML Import

移动端Native开发：这也是需要了解的，以后前端工程师会经常地和webview打交道，也要了解native开发

web前端开发主要技术有哪些

前端开发是创建Web页面或app等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。Web前端的学习起来相对简单，未来的发展前景也是非常不错的。

web全栈工程师5.0课程包括：

①计算机基础以及PS基础

②前端开发基础（HTML5开发、JavaScript基础到高级、jQuery网页特效、Bootstrap框架）

③移动开发

④前端高级开发（ECMAScript6、Veu.js框架开发、webpack、前端页面优化、React框架开发、AngularJS 2.0框架开发等）

⑤小程序开发

⑥全栈开发（MySQL数据库、Python编程语言、Django框架等）

⑦就业拓展（网站SEO与前端安全技术）

互联网行业目前还是最热门的行业之一，学习IT技能之后足够优秀是有机会进入腾讯、阿里、网易等互联网大厂高薪就业的，发展前景非常好，普通人也可以学习。

想要系统学习，你可以考察对比一下开设有相关专业的热门学校，好的学校拥有根据当下企业需求自主研发课程的能力，能够在校期间取得大专或本科学历，中博软件学院、南京课工场、南京北大青鸟等开设相关专业的学校都是不错的，建议实地考察对比一下。

祝你学有所成，望采纳。

web前端开发需要掌握的几个必备技术

接下来由小编简单的列举出几个前端开发中必须要学会的知识：

第一阶段：

HTML+CSS:

HTML进阶、CSS进阶、div+css布局、HTML+css整站开发、

JavaScript基础：

Js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、BOM、定时器和焦点图。

JS基本特效：

常见特效、例如：tab、导航、整页滚动、轮播图、JS制作幻灯片、弹出层、手风琴菜单、瀑布流布局、滚动事件、滚差视图。

JS高级特征：

正则表达式、排序算法、递归算法、闭包、函数节流、作用域链、基于距离运动框架、面向对象基础、

JQuery：基础使用

悬着器、DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件基本使用。

第二阶段：

HTML5和移动Web开发

HTML5：

HTML5新语义标签、HTML5表单、音频和视频、离线和本地存储、SVG、WebSocket、Canvas.

CSS3:

CSS3新选择器、伪元素、脸色表示法、边框、阴影、background系列属性改变、Transition、动画、景深和深透、3D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS3网页制作。

Bootstrap:

响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS。

移动Web开发：

跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem、移动终端JavaScript事件、手机中常见JS效果制作、Zepto.js、手机聚划算页面、手机滚屏。

第三阶段：

HTTP服务和AJAX编程

WEB服务器基础：

服务器基础知识、Apache服务器和其他WEB服务器介绍、Apache服务器搭建、HTTP介绍。

PHP基础：

PHP基础语法、使用PHP处理简单的GET或者POST请求、

AJAX上篇：

Ajax简介和异步的概念、Ajax框架的封装、XMLHttpRequest对象详细介绍方法、兼容性处理方法、Ajax框架的封装、Ajax中缓存问题、XML介绍和使用。

AJAX下篇：

JSON和JSON解析、数据绑定和模板技术、JSONP、跨域技术、图片预读取和lazy-load技术、JQuery框架中的AjaxAPI、使用Ajax实现爆布流案例额。

第四阶段：

面向对象进阶

面向对象终极篇：

从内存角度到理解JS面向对象、基本类型、复杂类型、原型链、ES6中的面向对象、属性读写权限、设置器、访问器。

面向对象三大特征：

继承性、多态性、封装性、接口。

设计模式：

面向对象编程思维、单例模式、工厂模式、策略模式、观察者模式、模板方法模式、代理模式、装饰者模式、适配器模式、面向切面编程。

第五阶段：

封装一个属于自己的框架

框架封装基础：

事件流、冒泡、捕获、事件对象、事件框架、选择框架。

框架封装中级：

运动原理、单物体运动框架、多物体运动框架、运动框架面向对象封装。

框架封装高级和补充：

JQuery框架雏形、可扩展性、模块化、封装属于传智自己的框架。

第六阶段：

模块化组件开发

面向组件编程：

面向组件编程的方式、面向组件编程的实现原理、面向组件编程实战、基于组件化思想开发网站应用程序。

面向模块编程：

AMD设计规范、CMD设计规范、RequireJS，LoadJS、淘宝的SeaJS。

第七阶段：

主流的流行框架

Web开发工作流：

GIT/SVN、Yeoman脚手架、NPM/Bower依赖管理工具、Grunt/Gulp/Webpack。

MVC/MVVM/MVW框架：

Angular.js、Backbone.js、Knockout/Ember。

常用库：

React.js、Vue.js、Zepto.js。

第八阶段：

HTML5原生移动应用开发

Cordova：

WebApp/NativeApp/HybirdApp简介、Cordova简介、与PhoneGap之间的关系、开发环境搭建、Cordova实战(创建项目，配置，编译，调试，部署发布)。

Ionic：

Ionic简介和同类对比、模板项目解析、常见组件及使用、结合Angular构建APP、常见效果(下拉刷新，上拉加载，侧滑导航，选项卡)。

ReactNative：

ReactNative简介、ReactNative环境配置、创建项目，配置，编译，调试，部署发布、原生模块和UI组件、原生常用API。

HTML5+：

HTML5+中国产业联盟、HTML5PlusRuntime环境、HBuilder开发工具、MUI框架、H5+开发和部署。

第九阶段：

Node.js全栈开发：

快速入门：

Node.js发展、生态圈、Io.js、Linux/Windows/OSX环境配置、REPL环境和控制台程序、异步编程，非阻塞I/O、模块概念，模块管理工具、开发流程，调试，测试。

核心模块和对象：

全局对象global，process，console，util、事件驱动，事件发射器、加密解密，路径操作，序列化和反序列化、文件流操作、HTTP服务端与客户端。

Web开发基础：

HTTP协议，请求响应处理过程、关系型数据库操作和数据访问、非关系型数据库操作和数据访问、原生的Node.js开发Web应用程序、Web开发工作流、Node.js开发Blog案例。

快速开发框架：

Express简介+MVC简介、Express常用API、Express路由模块、Jade/Ejs模板引擎、使用Express重构Blog案例、Koa等其他常见MVC框架。

2020年Web前端自学之路指南

今天小编要跟大家分享的文章是关于2020年Web前端自学之路指南。许多人可能跟着网络上的各种教程就入了前端这行的门，但大多数都只是机械的学习着资料中的内容。俗话说，选择要比努力重要。那么学习开发，首先应该要有一个清晰的学习路线。希望这篇文章，能为大家在选择未来的发展方向时提供一些参考和帮助。下面来和小编一起看一看吧！

1、基础学习

●HTML+CSS基础：

HTML进阶、CSS进阶、div+css布局、排版、html+css整站开发，样式美化和浏览器兼容

●JavaScript基础：

掌握Js基本语法、条件、语句和循环、js内置对象常用方法、ECMAscript、DOM、BOM、定时器和焦点图，并学习增强逻辑的常用算法，实现木马、拖放、放大镜等常见的网络特效。

●JavaScript高级特性：

正则表达式与JSON、正则表达式案例、JavaScript原理与库封装、闭包、函数节流、作用域链、面向对象基础、事件与运动框架封装

●JQuery基础使用：

DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件的基本使用，开发复杂的交互功能和效果，并能熟悉JQuery的插件开发机制。

2、HTML5+CSS3和移动Web开发

●HTML5：

HTML5新语义标签、HTML5表单、音频和视频、离线和本地存储、SVG、WebSocket

●CSS3：

CSS3新选择器、伪元素、颜色表示法、边框、阴影、background系列属性改变、Transition、动画、景深和深透、3D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS3网页制作

●图像学：

Canvas、Canvas游戏、数据可视化、Heighcharts.js

●Bootstrap：

响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS

●移动Web开发：

跨终端WEB和主流设备简介、流式布局、弹性盒子、rem、移动终端JavaScript事件、手机中常见JS效果制作、Zepto.js、商城页面、滚屏

3、HTTP服务和AJAX编程

●WEB服务器基础：

服务器基础知识、Apache服务器和其他WEB服务器介绍、Apache服务器搭建、HTTP介绍

●PHP基础：

PHP基础语法，使用PHP处理简单的GET/POST请求

●AJAX上篇：

Ajax简介和异步的概念、Ajax框架的封装、XMLHttpRequest对象详细介绍方法、兼容性处理方法、Ajax框架的封装、Ajax中缓存问题、XML介绍和使用

●AJAX下篇：

JSON和JSON解析、数据绑定和模板技术、JSONP、跨域技术、图片预读取和lazy-load技术、JQuery框架中的AjaxAPI用法、使用Ajax实现瀑布流案例

4、面向对象进阶

●面向对象终极篇：

从内存角度到理解JS面向对象、基本类型、复杂类型、原型链、ES6中的面向对象、属性读写权限、设置器、访问器

●面向对象三大特征：

继承性、多态性、封装性、接口

●设计模式：

面向对象编程思维、单例模式、工厂模式、策略模式、观察者模式、模板方法模式、代理模式、装饰者模式、适配器模式、面向切面编程

5、封装一个属于自己的框架

●框架封装基础：

事件流、冒泡、捕获、事件对象、事件框架、选择框架

●框架封装中级：

运动原理、单物体运动框架、多物体运动框架、运动框架面向对象封装

●框架封装高级和补充：

JQuery框架雏形、可扩展性、模块化

6、模块化组件开发

●面向组件编程：

面向组件编程的方式、面向组件编程的实现原理、面向组件编程实战、基于组件化思想开发网站应用程序

●面向模块编程：

AMD设计规范、CMD设计规范、RequireJS，LoadJS、淘宝的SeaJS、CommonJS、ES6Modules

7、工程化构建、主流的框架

●Web开发工作流：

GIT/SVN、Yeoman脚手架、NPM/Bower依赖管理工具、Grunt/Gulp/Webpack、打包案例

●MVC/MVVM/MVW框架：

Vue.js、React、Angular.js、Backbone.js、Knockout/Ember、项目驱动

8、Node.js全栈开发

●快速入门：

Node.js发展、生态圈、Io.js、Linux/Windows/OS

X环境配置、REPL环境和控制台程序、异步编程，非阻塞I/O、模块概念，模块管理工具、开发流程，调试，测试;掌握node.js全栈的解决方案和在服务器端JS高效开发

●核心模块和对象：

全局对象global，process，console，util、事件驱动，事件发射器、加密解密，路径操作，序列化和反序列化、文件流操作、HTTP服务端与客户端、Socket.IO

●Web开发基础：

HTTP协议，请求响应处理过程、关系型数据库操作和数据访问、非关系型数据库操作和数据访问、原生的Node.js开发Web应用程序、Web开发工作流、Node.js开发Blog案例。

●快速开发框架：

Express简介+MVC简介、Express常用API、Express路由模块、Jade/Ejs模板引擎、使用Express重构Blog案例、Koa等其他常见MVC框架。

●数据库：

mongoose/mongoDB、MYSQL

●Node.js开发电子商务实战：

需求与设计、账户模块注册登录、会员中心模块、前台展示模块、购物车，订单结算、在线客服即时通讯模块

9、微信系列

●微信公众号

JS-SDK配置、定制菜单、回调、定制分享内容、扫一扫、地理位置、微信音频、图像、语音识别功能、服务器端curl

库、支付、卡券、微店、微信开发模式与公众号分析、统计分析

●微信小程序

小程序项目、uni-app、mpvue

10、移动APP(Web/Native/Hybrid)

●ReactNative简介、ReactNative环境配置、创建项目，配置，编译，调试，部署发布、原生模块和UI组件、原生常用API

●Ionic简介和同类对比、模板项目解析、常见组件及使用、结合Angular构建APP、常见效果(下拉刷新，上拉加载，侧滑导航，选项卡)

11、其他

●职业素养

沟通表达、团队合作、目标管理、时间管理、心态管理

●就业指导

简历投递技巧、面试笔试技巧

12、推荐一些编程学习网站

01、哔哩哔哩

这个网站如果让我评价，可谓是上边的视频都是非常高质量的，你可以去搜索看一下。

02、菜鸟教程

这个网站虽然不是视频网站，一听名字就知道适合菜鸟的，但是基础的知识写的非常详细，很清晰易懂，非常适合刚开始学习编程的小伙伴。

03、W3School

之前刚开始学WEB开发时，经常在该网站，就是结合w3school学习前端，开发时，如果遇到记不清的标签，就去w3school搜索，平常有时间，就来慕课看前端视频。

类似这样的学习网站还有很多，该开始入门的话上面的网站足矣。其他的网站推荐还有腾讯课堂、实验楼、果壳MOOC学院等、知乎、掘金……

以上就是小编今天为大家分享的关于2020年Web前端自学之路指南的文章，希望本篇文章能够对正在从事Web前端工作的小伙伴们有所帮助，想要了解更多Web前端知识记得关注北大青鸟Web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的Web前端工程师。

文章来源：原创前端猿前端猿指北

web前端开发需要掌握哪些知识？

一.基础学习

主要就是html、css、JavaScript。建议直接从html5、css3、ES5入手进行来学习。由于该部分是web前端开发中的基础部分，因此建议大家基础一定要打牢固。

二.与美工相关、后端开发、设计相关的学习

优秀的web前端开发工程师，将熟知自己工作界面的各种布局。因此，这也将是你工作中的重点。根据公司的不同，大家可扩大知识面，加深对自身产品的理解。

与美工相关，主要是精通ps、切图类工具的应用。Photoshop是必然需要掌握的，这里我们不强调作图的精美，但是至少需要掌握它的应用。一技之长，无论何时何地总会大有应用。

后端开发，一般情况下，前端开发和后端开发是分开的，不过也存在特殊情况。因此，需要我们做出选择后端的主要学习阵地，很多人都在比较PHP、Python、Node.js哪种好，其实三者差别不大，从市场上的热度来看，Node.js视乎更受欢迎一点，当然Node.js对js熟悉的前端来说也更容易上手。

三.各种框架类库的学习

jquery，bootstrap等，现在的框架比较多，但是jquery和bootstrap这样级别的必须得熟练掌握，要不很多公司都没法干活。一般类库和框架都有垂直的网站可以学习，如bootstrap中文网之类的都很不错。