服务时间:8:30-18:00

web前端培训
WEB前端 互联网+所需技能

行业前景广 / 岗位选择宽 / 发展空间大 / 就业薪资高

  • Web开发工程师

  • 前端工程师

  • 网站开发工程师

  • 小程序开发工程师

  • H5开发工程师

  • 高级前端开发工程师

  • App开发工程师

(*以上数据源自职友集)

  • >10年

    27400.0元
  • 5-10年

    19100.0元
  • 3-5年

    14000.0元
  • 1-3年

    10100.0元
  • 应届生

    6300.0元

web/' target='_blank'>Web前端的发展前景是一片光明的,web/' target='_blank'>Web前端的发展趋势不言而喻,而Web前端工程师待遇随着工作经验的增长也会逐渐提高,所以还在犹豫的朋友赶紧抓住机会来学Web前端吧。

前端全栈 让前端不止于前端

前端技术+工作技巧+全栈开发能力,逐层递进的掌握企业所需核心技术点

  • 移动应用程序
  • 多媒体
  • 网页制作
  • 苹果
  • 游戏
  • 微信小程序
  • 谷歌微软
  • 课程大纲及学习周期安排

    为保证课程内容紧跟市场变化,课程章节将逐步更新开放,直至课程完结*

    • + 阶段一: 前端基础入门
      27门课 · 课程总时长:47小时 · 练习题:405 · 大作业:2 · 考试:2 · 教辅资料:68
      第1周
      第2周
      第3周
      第4周
      第5周
      第6周
      第7周
      第8周
      第9周
      HTML5基础语法与标签

      本周是入门前端的第一步,学会IDE插件安装和使用,掌握H5语法和基础标签的应用,学完本周内容可以进行简单的页面结构搭建。

      课程安排:

      1、了解前端行业发展

      2、了解HTML5对于网页的意义

      3、学习常用标签/属性,进行结构搭建

      4、掌握无序列表/有序列表/自定义列表

      5、学习表单标签/属性,能创建常见表单结构

      6、掌握标签嵌套规则/行内元素/块元素的使用

      7、学习VSCode开发工具使用,能创建简单网页

      CSS3基础语法与盒模型

      CSS3是网页的"美容师",本周开始学习CSS3样式,掌握语法结构、选择器、盒子模型、文本和字体样式设置,能够对网页进行简单的样式开发。

      课程安排:

      1、掌握CSS3基本语法和使用

      2、掌握CSS3各类选择器/样式属性,快速进行样式设置

      3、学习文本、字体等常见属性

      4、盒子模型核心知识讲解,深入理解原理

      5、掌握行内元素和块级元素设置与转换

      CSS3浮动定位与背景样式

      简单的样式开发还不够,通过掌握浮动、定位、边框、背景样式以及2D&3D转换,以及布局技巧。能够进行特殊图形绘制,开发更美观的网页效果。

      课程安排:

      1、浮动与定位核心知识,灵活运用实现网页布局

      2、常见布局方法,解决布局常见问题

      3、如何绘制圆角边框/阴影框/图片边框等特殊图形

      4、掌握元素扭曲/移位/旋转,更自由的装饰HTML

      5、BFC规范和浏览器差异

      CSS3动画与穷游首页开发实战

      CSS3也能实现炫酷的网页动态效果,结合企业级上线“旅游网”项目,综合运用前面所学的知识,完成穷游首页排版布局和CSS3动画特效开发。

      课程安排:

      1、大项目:结合H5/CSS3,完成PC端仿穷游首页布局开发

      2、掌握不同布局结构与技巧

      3、掌握过渡的使用与缓动效果,实现常见小案例

      4、运用动画效果,实现炫酷动画效果

      5、大作业:慕家居网页布局开发

      JS基础语法与表达式

      JS是网页编程的第一步,本周开始学习JS编程语言,掌握基础语法结构、变量声明和命名规则、数据类型、表达式和操作符,学完本周内容可以进行简单的JS代码编写。

      课程安排:

      1、掌握JS基本语法使用

      2、掌握JS变量声明与提升的机理

      3、掌握JS运算符操作与表达式

      4、学习基本数据类型和复杂数据类型使用

      5、深入理解数据类型转换与检测

      6、小案例:计算器和表达式综合运用

      JS流程控制语句与数组

      本周继续深入学习JS编程语言,掌握条件分支语句、循环语句和数组,学完本周内容可以用简洁的代码实现强大功能。

      课程安排:

      1、掌握if,if elseif,switch等条件分支语句使用

      2、掌握for、while、do while循环语句使用

      3、掌握数组基本使用和常用方法

      4、break和continue语句的特点及应用

      5、运用数组知识,学习基本算法

      6、使用简单的逻辑实现复杂业务逻辑

      7、小案例:常见算法综合运用

      JS函数与DOM

      如想实现更炫的动态效果,那么操控网页元素很重要,通过掌握函数编程、DOM操作、事件以及BOM对象,让你能实现典型的触发和动态交互效果。

      课程安排:

      1、掌握DOM操作和DOM事件

      2、掌握函数基础与函数高级应用

      3、掌握BOM浏览器对象模型,与浏览器“对话”

      4、掌握函数封装,提升编码质量

      5、小案例:有趣的动画效果开发

      面向对象

      面向对象是开发中非常重要的思想,在本周我们将开始运用面向对象思想进行程序开发,编写高质量代码,解决企业级编程协同问题。

      课程安排:

      1、学习this规则与使用

      2、掌握构造函数概念以及创建、调用与使用

      3、理解原型和原型链的关系与运用

      4、闭包和作用域应用

      5、熟练使用面向对象思想进行DOM编程

      6、掌握JS模块化编程方式,编写高质量代码

      7、掌握模块化开发技巧,解决企业级编程协同问题

      8、小案例:俄罗斯方块游戏开发

      项目实战:仿穷游JS特效开发

      实战出真知,本周综合运用H5、CSS3和JS所学知识,从0到1完成一个具备CSS3动画和JS特效的多特效旅游网页。掌握企业常见的网页开发方式和各类特效实现方案。

      课程安排:

      1、结合H5/CSS3/JS,完成PC端仿穷游首页特效开发

      2、项目动画效果分析,帮助更快梳理思路

      3、大作业:家居网页JS特效开发

    • + 阶段二: 组件化与移动WebApp开发
      25门课 · 课程总时长:53小时 · 练习题:137 · 大作业:3 · 考试:2 · 教辅资料:89
      第10周
      第11周
      第12周
      第13周
      第14-15周
      第16周
      第17周
      第18周
      第19周
      ES6基础入门

      ES6是JavaScript新的语法规范,让代码更规范、可读性高、方便操作。本周将开启ES6的学习,这是学习前端必备的一步。掌握ES6相关知识后,能够更便捷的编写代码,提高开发效率。

      课程安排:

      1、ES6基本语法与使用

      2、掌握ES6中变量和常量的使用与区别

      3、学习可以嵌入表达式的字符串字面量--模板字符串

      4、掌握箭头函数的特点与应用

      5、掌握如何自动解析数组或对象中的值

      6、了解对象字面量更加简洁与灵活的表达方式

      7、掌握参数默认值的使用

      ES6语法扩展

      本周将继续学习ES6的基础,通过进一步学习ES6引入的新特性,了解ES6的新方法,掌握新的集合类型,更深入的了解数据的遍历。

      课程安排:

      1、剩余参数与展开运算符的对比进行学习

      2、了解如何实现减少逻辑或操作符的使用

      3、认识ES6中新增的数据结构

      4、了解ES6中新增的方法

      5、了解遍历原理,以及学习新的循环方式

      ES6之Promise与Class类

      Promise 和 Class(类)是ES6中非常重要的知识点。Promise 是异步编程的一种解决方案,比传统的回调函数更合理和更强大。Class(类)来作为对象的模板使用,强化面向对象的使用。

      课程安排:

      1、学习如何高效解决回调地域问题

      2、了解如何运用ES6 Promise进行异步编程

      3、掌握Class基本语法的使用

      4、掌握更加清晰与便捷的对象继承方式

      5、掌握更高级的面向对象编程思想

      ES6之Module模块与Babel编译

      ES6 在语言标准的层面上,实现了模块功能。可以实现将一个大程序拆分成互相依赖的小文件。而babel的使用,完美的解决了ES6的兼容性问题,让ES6有更多可能性,使前后端差异越来越小。

      课程安排:

      1、了解企业级的开发形式——模块化的使用

      2、学习将一个复杂的功能拆分,从而提高复用率

      3、了解如何更好的维护代码

      4、掌握babel转换器的使用,解决ES6的兼容问题

      5、学习如何将Webpack与配合Babel使用,完成更高效的开发

      6、掌握Webpack项目构建配置

      HTTP 协议、存储、Ajax

      本周将开启前后端数据交互的学习,来理解前后端开发的区别,了解网络通信的相关概念,并对与后台通信、获取数据有一个初体验。概念比较抽象,先作为了解。在后面项目开发环节,随着对知识的运用,对概念会有更深一步的理解。

      课程安排:

      1、了解如何区分前后端

      2、理解HTTP协议,熟悉网络通信相关概念

      3、学习本地存储的多种方式,了解数据缓存机制

      4、了解JOSN数据的几种书写格式

      5、熟悉原生Ajax请求流程与细节

      6、掌握常见的跨域技巧

      7、学习如何自己封装Ajax

      8、了解基于promise的Ajax插件——Axios

      项目实战:仿穷游组件化开发

      组件化开发是一种高级编程思想,适用于团队协作开发,是企业中常见的一种开发模式。本周会使用组件化方式来完成“仿穷游商城首页”的重构。掌握组件化开发能够更好的促进团队协作,提高开发和调试效率,可维护性更高。

      课程安排:

      1、综合运用H5/CSS3/ES6等知识,使用“组件化的开发思想”重构旅游网首页

      2、了解项目组件化划分方式

      3、了解模块化与组件化区别

      4、采用模块化与组件化结合的开发方式

      5、使用Webpack构建项目

      6、运用 art-template 模板引擎,高效开发

      7、真实的数据接口,实现前后台联动

      8、通过自己封装的Ajax向后端请求数据

      9、使用Class、Module模块完成轮播图的基类,实现模块化,提高复用率

      移动基础

      移动开发基础是进行webApp开发第一步。本周将开启前端学习的新篇章。通过移动端基础知识的学习,能够独立实现适配不同移动端终端的页面。

      课程安排:

      1、学习移动基础概念

      2、理解移动端与pc端web开发的区别

      3、掌握移动端常用的Rem适配方案

      4、掌握Flex布局的使用

      5、学习响应式布局开发

      6、不同的适配方法

      7、学习栅格系统的使用

      8、了解移动端屏幕、移动端浏览器、操作系统的不同

      移动进阶之高效开发

      移动端高质量的开发,是移动端开发的必备技能。本周继续移动端的学习,学习移动端的事件、开发中的常见问题,以及如何使项目的性能更加优化。

      课程安排:

      1、掌握移动端常用的事件

      2、小案例:移动端幻灯片的实现

      3、移动端开发中常见的问题

      4、主流移动端页面开发技术选型与解决方案

      5、学习如何从HTML、CSS、JavaScript三方面优化性能

      项目实战:仿穷游移动webapp开发

      接下来的一周,我们将迎来webApp项目的开发,实现从PC端开发迈向移动端。从项目分析、组件划分、结构搭建、功能实现、性能优化。体验真实企业中移动端项目的开发流程

      课程安排:

      1、综合运用H5/CSS3/ES6/移动知识,重构旅游网WebAPP的首页、目的地页

      2、符合企业标准的开发流程,从项目分析、项目搭建、模块开发到数据对接

      3、采用模块化与组件化结合的开发方式

      4、使用Webpack构建项目

      5、运用 art-template 模板引擎,高效开发。

      6、完成 18 个典型组件开发(搜索、商品、导航等组件)

      7、运用Swiper高效移动端插件开发轮播图

      8、使用Ajax 处理与获取数据

      9、如何处理多次请求的解决方案

      10、如何运用组件化思维,拆分和复用组件

      11、完成各组件性能的优化

    • + 阶段三: 小程序与主流框架开发
      14门课 · 课程总时长:48小时 · 练习题:175 · 大作业:3 · 考试:1 · 教辅资料:10
      第20周
      第21周
      第22-23周
      第24周
      第25-26周
      小程序基础与慕课小程序实战

      本周开始学习爆火的轻应用开发技术——小程序 。通过对小程序知识的学习,能够独立开发企业级小程序,拥有解决主流小程序功能需求的能力。

      课程安排:

      1、大项目:结合Flex/Template模板,开发慕课小程序首页/活动页/热门排行页

      2、了解小程序注册流程/注册方式/注册主体

      3、小程序的全局生命周期和页面级生命周期

      4、小程序基础语法与常用API

      5、小程序开发工具的调试办法

      6、小程序多页面下的开发工作流及目录结构

      React.js基础语法与新闻网站实战

      React.js是企业开发热门框架之一 。通过对React.js基础和项目的学习,具备构建企业级项目和解决核心业务问题的能力,快速接入企业项目。

      课程安排:

      1、大作业:运用React组件完成新闻网站项目常见功能开发

      2、理解React的开发理念与内部原理

      3、React的基本使用及Ant Design组件库进行项目开发

      4、使用React封装项目中用到组件,实现复用

      5、React项目中常见问题的解决方案

      6、如何运用React-Redux进行状态管理

      7、声明式编程的思想与组件化开发的思想

      Sass基础与Vue.js基础语法

      Vue.js是企业开发另一热门框架,易用、灵活、高效,对于初学者很友好。本周通过对Vue.js基础和Sass布局技术的学习,为后续的全栈项目开发打下基础。

      课程安排:

      1、大作业:订单列表和购物车列表页

      2、掌握Webpack项目构建配置

      3、掌握基础语法与常见API

      4、组件的使用及组件的生命周期

      5、Axios网络请求及路由使用

      6、Vuex的引入、应用场景及项目中的实现

      7、使用Vue.js技术栈进行项目开发的方式方法

      8、掌握Sass布局基础

      项目实战:Vue.js仿京东到家电商全栈项目前端开发(上)

      从本周开始进入到电商全栈项目开发,首先使用Vue.js前端实战的第一部分首页和商家详情页,还原实际开发流程,综合运用所学知识,完成页面开发,掌握开发中常见问题解决技巧。

      课程安排:

      1、综合运用Sass和Vue.js完成登录页/注册页/首页/商家详情页

      2、使用vue-cli4.0创建开发环境

      3、使用axios发送Mock请求

      4、使用路由守卫实现基础登陆校验功能

      5、动态路由/异步路由与组件拆分复用

      6、首页/商家详情页数据渲染

      7、Vue.js项目中常见问题的解决方案

      项目实战:Vue.js仿京东到家电商全栈项目前端(下)

      Vue.js前端项目实战的第二部分,实现电商核心业务订单和地址管理模块,掌握开发中常见问题解决技巧,真实数据访问,开发完整的Vue.js电商前端项目。

      课程安排:

      1、综合运用Sass和Vue.js完成订单提交页/地址列表页/地址编辑/地址新建页

      2、使用axios发送Mock 请求

      3、动态路由/异步路由与组件拆分复用

      4、订单提交页/地址列表页数据渲染

      5、Vue.js项目中常见问题的解决方案

      6、步骤大作业:完成订单列表页和购物车列表页开发

    • + 阶段四: Node.js全栈开发
      11门课 · 课程总时长:42小时 · 练习题:56 · 大作业:1 · 考试:1 · 教辅资料:59
      第27周
      第28周
      第29-30周
      第31周
      第32周
      全栈必备基础Node.js

      学前端不至于前端,从本周开始学习服务端基础知识,掌握什么是服务端以及服务端必备node.js,夯实基础,迈进前端全栈开发。

      课程安排:

      1、案例:搭建node.js服务器及创建MongoDB数据库

      2、了解什么是服务端,服务端与前端的关系

      3、掌握commonjs模块化与npm插件使用

      4、掌握inspect调试方法

      koa2中间件与MongoDB数据库

      真实企业开发离不开数据库,Koa2框架有效的提高开发效率,本周掌握前端必备的前端全栈开发知识,为后面开发全栈项目蓄力。

      课程安排:

      1、了解koa2中间件与洋葱圈模型

      2、了解关系型数据库与MongoDB基础API详解

      3、掌握node.js操作MongoDB方法与mongoose规范数据模型

      项目实战:node.js仿京东到家电商全栈项目后端开发

      本周开始进入到电商全栈项目的后端开发,对标企业标准开发流程。从登录实现方案、项目需求分析、接口和数据结构设计到业务开发,帮你打通前后端任督二脉,突破全栈技术瓶颈,为就业加码。

      课程安排:

      1、综合运用Node.js+koa2+MongoDB,实现电商全栈项目的后端

      2、掌握企业的开发流程与技巧,从0到1一步步实现

      3、项目采用前后端分离开发模式

      4、核心业务的数据库设计与实现

      5、真实数据接口和设计与实现

      6、Koa工作流程及常见Koa中间件使用

      7、掌握前后端数据联调技巧,打通前后的数据交互

      8、常见MongoDB与nodejs集成

      9、了解cookie 和session的关系

      10、大作业:订单和购物车列表页的数据库和接口设计

      就业必备基础技术面试分析

      面试是通往成功就业的关键一步,本周包含布局基础以及JS和ES6等常见考点和经典面试题分析,带你把知识串成线,掌握前端面试技巧,顺利通关基础技能面试。

      课程安排:

      1、H5语义化/CSS布局/定位/图文样式/响应式面试解题技巧

      2、原型和原型链的5个原则与面试解题技巧

      3、变量类型/计算/构造函数的面试解题技巧

      4、作用域和闭包的执行上下文/this面试解题技巧

      5、异步和单线程/常见的内置对象面试解题技巧

      6、DOM本质/节点操作/BOM操作面试解题技巧

      7、AJAX与事件解面试题技巧

      就业必备框架与全栈技术面试分析

      框架、小程序以及全栈相关内容也是面试必考。本周带大家梳理的常见考点和经典面试题分析,理清面试解题方法论,完成最后一厘米的冲刺。

      课程安排:

      1、Vue.js原理/MVVM面试解题技巧

      2、组件生命周期/父子组件传值面试解题技巧

      3、组件异步加载/缓存/抽离公共逻辑面试解题技巧

      4、vue-router/data监听面试解题技巧+5道Vue.js真题演练

      5、React基础语法/事件面试解题技巧

      6、React组件生命周期/父子组件通讯面试解题技巧

      7、React函数组件与class组件区别面试解题技巧

      8、Redux/react-router面试解题技巧

    WEB前端学习必备书目推荐

    持续学习 理论+实战实力 涨薪每一步

    CSS世界 [中]张鑫旭

    张鑫旭,前端开发工程师,国内知名前端博客“鑫空间-鑫生活”博主,目前就职于阅文集团用户体验设计部(YUX),担任技术经理。2007年开始接触前端,10年来一直工作在前端开发一线。

    深入浅出 Node.js [中]朴灵

    《深入浅出Node.js》所讲的知识则比较恒久远,无论是模块部分、异步部分、去深嵌套部分还是网络编程部分,都是 Node 中几乎稳定的知识。

    JavaScript设计模式与开发实践 [中]曾探

    从这本书中能收获比较多的知识,能够让自己的代码写的更加美观。特别是最后几章作者列出的几点原则比较有参考性,而一些与编程无关的举例具有画龙点睛的作用,很有启发。

    CSS揭秘 [希]韦鲁(Lea Verou)

    这本书是为新一代CSS所写的新一代CSS图书,在我所知的技术专家中,没人比Lea Verou更能领会新一代CSS的精髓--《网站重构》作者:Jeremy Keith。

    一线讲师阵容,传授真实项目经验

    讲师教授内容严谨、实用,一切以真实提升学员实战能力为导向

    web开发培训讲师简介及答疑
    Judith

    前端开发培训

    授课风格幽默风趣,善于从多种角度分析问题,准确洞察学生学习过程中的难点,让大家学习起来更加轻松。 点击咨询
    • 01 WEB前端开发前景怎么样

      未来常桉网络认为前端工程师的职业方向会偏向于h5衍生品、h5混合app、pc端这三个方面,而随着小程序和快应用的推广,以后前端开发人员的前途无量。

    • 02 web前端可以自学吗

      自学web主要是通过看书和视频,如何选择合适的学习资料就显得尤为重要了,但哪种才是真正适合自己的?还有,自制力和自控能力能不能做好都是决定最终结果的关键因素。

    • 03 初学者应该用什么编程软件

      Dreamweaver,作为老牌编辑器,在人们心目中的分量也是相当重的,以至于有些人对它有了情怀,所见即所得的功能是它的一大亮点,不过人家的代码编辑也是非常厉害的。

    • 04 WEB前端有哪些实用的工具

      oh-my-zsh,都说它是最好用的shell,没有之一,包含275+插件、150+主题、GitHub113,259星数,从这一系列的数字中就能够感觉到这个shell工具的完善以及强大之处,小白程序员也可以用,高端大气上档次!

  • 上一篇洛阳学习web前端开发哪家好
  •   
      
    相关课程
    1. 呼和浩特web学习班哪家好
    2. 福州零基础学web前端哪里好
    3. 唐山web前端开发哪里学比较好
    4. 遵义web培训哪家好
    5. 南京学web前端哪家好