400-650-7353

全国统一专线:9:00-21:00

2024优就业

详细了解Web前端培训课程路线
学习实战Web前端技术

目前课程升级时间2024年1月

SYSTEM

优就业Web前端课程体系

  • 紧跟企业所需

    程研发随时关注最近技术与企业中使用频率高的技术,根据调研结果研发符合现在情况与未来潮流的课程大纲,课程中会去掉淘汰很久并且无用的技术,整套课程最终为培养成高级全栈开发工程师为目标,在讲解基础的同时,更会深入的讲解其原理,做到知其然也知其所以然,课程中也会涉及到Touch、jQuery、Zepto、JavaScript ES6、Node、Express、MySQL、Webpack+Gulp+模块化、WebSocket+Koa2、Vue、TypeScript、React等。为学员在就业中更加有竞争力。

  • 丰富实战项目

    程具体涉及的项目涵盖社区平台、点餐平台、旅游平台、电商平台、影视平台等多个方向,包括但不限于小U商城、优学在线、优社区项目、菜谱云平台、课堂监管大数据系统等,项目种类繁多,包含了大多常见领域的项目,对于各行各业都能进行深入的了解,在之后的面试中不论什么行业都可以轻松应对,而且项目中包含了每个阶段的知识点,在了解原理的同时,提升自己的动手操作能力。

  • 一体化学习模式

    过面授:老师面对面讲授、手把手辅导、搭配CTS系统晚上可以看白天录屏课程、保时保量,网课:优质团队随时随地在线学习、一年内反复听,直播:优就业实战讲师授课、直播+录播互动式教学、随时互动答疑、不定期推出众多免费公开课,图书:提供优就业自主研发书籍,可以更详细的了解课程知识。并配备各种专业老师,如教务老师、就业老师、学管师、助教老师、实训老师等等,为大家提供专项的服务。

ROUTE

优就业Web前端课程学习路线

开始Web前端学习

前端页面重构

前端交互设计

前端框架

服务器端开发

小程序+数据可视化

恭喜达成

Web前端初级开发工程师

恭喜达成

全栈开发工程师
小程序开发工程师
数据可视化开发工程师

恭喜达成

Web前端中级开发工程师
全栈开发工程师
Vue中高级开发工程师
React初级开发工程师

继续
晋级
继续
晋级

本章是前端入门章节,主要介绍静态页面布局的实现,包括PC端布局、移动端布局和响应式布局。

本章节主要介绍页面中的交互效果的实现,利用JS和jQuery库及相关插件使页面更丰富,增加用户的交互体验。

本章节主要主要讲解Vue和React两个目前比较流行的前端开发框架,通过本阶段学习能够使用框架快速开发前端项目。

本章节主要主要讲解ES6语法Node+Express+MySQL开发后台数据接口,项目模块化开发及Webpack实现项目打包。

本章节主要主要讲解小程序和数据可视化,通过本章学习可以快速开发各类小程序项目,并熟悉运用数据可视化工具。

小贴士:通过以上技术的学习大家都可以找到比较理想的工作,如果想要成为更顶级的大佬,还需要更多的实践。学习过程中不要忘了多上手操作。

OUTLINE

优就业Web前端课程大纲

  • 第一阶段

    前端页面重构

  • 第二阶段

    前端交互设计

  • 第三阶段

    服务器端开发

  • 第四阶段

    前端框架

  • 第五阶段

    小程序+数据可视化

  • HTML5
  • CSS3
  • Less

HTML

HTML简介
HTML语法
HTML属性和值
HTML注释
HTML基本结构
HTML常用标签
语义化

CSS

基本语法
选择器
文本属性
盒模型
浮动及清除浮动
position定位
浏览器兼容
CSS hack
CSS高级技巧
BFC规范

HTML5

HTML5简介
新增的结构化标签
音频和视频
新增表单元素
新增表单属性
html5shiv.js

CSS3

CSS3新增选择器
背景和渐变
用户界面属性
多列布局
圆角和阴影
过渡动画
2D与3D转换
弹性盒布局(Flex)
Grid网格布局
流式布局

Less

CSS预处理
Less编辑
Koala编译工具
导入
注释
变量
混合
嵌套
运算
内置函数

Photoshop

PS基本操作
PSD文件
网页图片优化技巧
图片格式分类及特性
GIF动态制作
一键切图插件

页面布局与屏幕适配

移动端浏览器及内核分析
viewport设置
Retina高清屏
PPI
dpr设备像素比解析
媒体查询
vw+rem布局
flexible.js+rem布局
媒体查询+rem
移动端reset

学完本阶段课程能够独立把设计师给的PSD效果图转换为静态代码页面,具备PC端和移动端静态页面的开发能力,
并可以适配不同的终端设备。但还达不到企业的用人标准,为后面继续学习网站编程打下基础。

  • JS核心语法
  • JS高级进阶
  • 面向对象编程
  • JS库及插件

JS核心语法

JS基础语法
数据类型
运算符
分支语句
循环语句
this对象
内置对象
定时器
事件
异步及回调

DOM和BOM

DOM概念
DOM作用及使用场景
DOM树
节点类型
节点操作
属性操作
表格操作
window对象
document对象
窗口操作及事件

JS高级进阶

事件对象
事件机制
正则表达式
RegExp对象
匿名函数
自执行函数
闭包
HTTP协议
AJAX原理分析及实现
JSON数据解析

面向对象

构造函数
new关键字
实例对象创建
Prototype对象
原型与原型链
对象与继承
模块与封装
工厂模式
观察者模式
单例模式

jQuery

jQuery对象与DOM对象关系
jQuery选择器
jQuery DOM操作
jQuery内置函数
jQuery事件
jQuery动画
jQuery AJAX
jQuery插件
jQuery EasyUI
jQuery UI

Touch

Touch.js介绍及使用场景
Touch.js事件绑定及事件配置
事件代理
事件触发
常用手势

Zepto

Zepto介绍
环境配置及编译
Zepto模块
选择器及事件模块
Zepto的touch模块

学完本阶段可以使用JavaScript/jQuery或JS相关插件开发网页特效和网页应用,并能够实现和服务器的一些交互,
具备开发一些简单交互项目能力,满足企业对初级前端开发的需求。

  • ES6
  • Node
  • Express
  • MySQL
  • Webpack

ES6

let和const
解构赋值
模板字符串使用
箭头函数
Iterator
Generator
Promise对象
async...await
class语法
ES6~ES10新语法

Node

Node安装配置
Node特点
Node模块和包管理
npm命令使用
fs模块文件读写操作
request和response对象
path模块
url模块
crypto模块
GET和POST数据解析

Express

Express的特性介绍
Express路由使用
路径动态参数解析
路径正则
中间件使用
ejs模板引擎
artTemplate模板引擎

MySQL

MySQL的优缺点
MySQL安装配置
navicate工具使用
数据库设计范式
CRUD操作指令
数据库操作指令
多表连接查询指令
Node封装MySQL操作
MVC和MVP理解
Node封装M层设计思路

Webpack

Webpack安装配置
Webpack中的模块和插件使用
Webpack打包HTML、CSS、JS
打包Less、Sass
Webpack拆分CSS
配置代理跨域
AMD和CMD的区别
RequireJS
ES6模块化和commonjs模块化对比
importx 和 export的使用

WebSocket-Koa2

WebSocket介绍
WebSocket和webservice对比
HTML5中的WebSocket
socket.io的使用
Koa2介绍
Koa脚手架使用
Koa与Express的对比

学完本阶段能够独立开发基于后台接口的动态网站、Ajax数据交互的项目;能够独立完成
企业网站从前台到后台的基本开发工作。满足企业对Node全栈工程师的基本需求。

  • Vue
  • TypeScript
  • React

Vue基础

MVC和MVVM设计模式
Vue模板语法
Vue指令
修饰符
Computed计算属性
Watch监听器
Filter过滤器
组件
生命周期
过渡与动画

Vue进阶

Vue-cli
组件通信
slot插槽
动态组件
路由
Axios
Vuex状态管理
Element-UI
Mint-UI
Vant-UI
服务器端渲染
Nuxt.js

BootStrap

BootStrap网格系统
BootStrap排版
BootStrap表格
BootStrap表单
BootStrap按钮组
BootStrap下拉菜单
BootStrap输入框组
BootStrap导航栏
BootStrap面包屑导航
BootStrap分页

TypeScript

TypeScript简介
基础类型
变量声明
接口
函数
泛型
枚举

React

虚拟DOM
JSX语法糖
diff原理
React脚手架
State和Props
组件间通信
DOM节点操作
组件的生命周期
React路由
AJAX、Axios、Fetch的使用
Redux
UI库(ant-design)

学完本阶段能够使用Vue和React技术栈开发企业级项目,掌握组件化开发和前后端分离式
开发的方式,理解框架开发原理、运行原理。满足前端开发中常见需求。

  • 小程序
  • 云开发
  • uni-app
  • 数据可视化

小程序

微信小程序介绍
微信开发者工具
小程序目录结构
全局配置与页面配置
组件
模块化
常用 API
WeUI组件库
网络请求
分包加载
基础库版本及兼容处理

云开发

云开发简介
云开发能力开通
数据库基本操作
存储服务
云函数的使用
深度了解HTTP API

uni-app

原生APP与混合APP
多端介绍
uni-app框架介绍
快速上手uni-app
HBuilderX可视化界面
Vue-cli命令行操作
目录结构
生命周期
运行环境判断
路由
使用 Vue.js 注意事项
uni-app 跨端开发注意事项

数据可视化

数据可视化介绍
数据可视化应用场景
Canvas
SVG
D3.js
选择元素和绑定数据
交互式操作
NVD3
n3-charts

学完本阶段能够掌握小程序和数据可视化的开发,能够掌握小程序的发展趋势,熟悉小程序的开发流程,能够开发企业级小程序,既可以开发原生小程序也可以
使用小程序框架完成项目;掌握数据可视化在前端项目中的使用场景及独立开发企业级数据可视化项目。

优就业教学服务特点
  • 每日测评,晚自习辅导

    每晚对学员当天知识的吸收程度、老师授课内容难易程度进行评分,老师会根据学员反馈进行分析,对学员吸收情况调整授课内容、课程节奏

  • 阶段测试,技术指导

    课程通过阶段进行学习,并进行阶段测试,根据学员的理解情况,在下个阶段是着重那些方向的知识学习,重点知识方向微调等

  • 就业辅导,面试技巧

    最后一个阶段进行就业课程,不仅可以将之前的知识进一步加深理解,并且可以查缺补漏,将所有知识点进行更深的理解

每一个  成功者  都有一个开始

勇于开始,才能找到成功的路

前端入门视频网课+前端学习路线图

咨询即可领取>>

申请5天免费线下课程

线下课程真实体验,拒绝虚假宣传

在线咨询