xinbiancheng.cn
为什么要进行web前端学习?
  • 010竟争对手
  • 02行业无限制
  • 03就业口径大
适合人群
  • 在校大学生

  • 刚刚毕业的技术小白

  • 零基础 想转行的
    非在职IT人员

  • 有基础想转行的
    在职IT人员

  • 希望得到技能提升
    的IT研发人员

课程介绍:阶段学习,稳扎稳打,逐步深入巩固所学知识点

阶段一 : 前端基础

HTML
浏览器与浏览器内核、HTML基本结构、HTML常用标签、 【案例】路径和锚点定位、【案例】HTML综合案例、 【案例】表格和列表标签及案例、【案例】表单相关元素及属性、【案例】综合案例-注册页面
CSS
CSS介绍和CSS基本选择器、font字体、文本样式和CSS样式表、【案例】综合案例-新闻页面、chrome调试工具和emmet语法、CSS复合选择器、 【案例】标签显示模式和案例、【案例】CSS背景及应用案例、【案例】综合案例-五彩导航、CSS三大特性、【案例】CSS盒模型及应用案例、 【案例】PS基本操作及综合案例、【案例】综合案例-快报模块、圆角和阴影的应用、【案例】浮动及应用案例、清除浮动、PS常用操作及cutterman插件使用、 【项目】学成网在线项目、【案例】CSS四种定位、淘宝焦点图案例、元素显示和隐藏应用案例、CSS精灵图和字体图标、CSS(问题解决技巧)、CSS(布局技巧)
HTML5和CSS3
HTML5新增标签、CSS3新增选择器
电商项目
电商项目介绍及准备工作、导航、头部和底部区域制作、网页主体区域制作、网页列表区域制作、注册页面制作、网站上传

市场价值 : 能够根据PSD文件文件,完成PC端静态网页的开发工作,学完此阶段,尚不能够达到企业用人标准。

阶段二 : 移动Web网页开发

H5C3进阶
vscode编辑器基本使用、HTML5新增标签、【案例】CSS3新增选择器及案例、【案例】2D转换及相关案例实现、【案例】3D转换和旋转木马案例
Flex 伸缩布局
移动端基础知识、【案例】移动端电商首页制作、Flex伸缩布局基础知识、【案例】移动端携程网首页制作
移动web开发
媒体查询、less介绍和使用、rem适配及原理、【案例】移动端苏宁首页制作和rem适配、响应式开发介绍、Bootstrap介绍和使用、【案例】阿里百秀响应式页面制作

市场价值 : 能够完成移动Web网页、响应式页面以及炫酷页面的开发工作,学完此阶段,尚不能够达到企业用人标准。

阶段三 : JavaScript网页编程

JavaScript基础语法
计算机基础和JavaScript介绍、JavaScript变量、JavaScript数据类型、JavaScript操作符、 【案例】JavaScript流程控制及案例、【案例】JavaScript循环及案例、JavaScript数组和冒泡排序、 JavaScript函数及应用、JavaScript作用域及预解析、JavaScript对象、【案例】JavaScript内置对象及案例、 JavaScript简单类型和复杂类型
WebAPI编程
API 和 Web API、DOM介绍、【案例】事件和样式操作及案例、【案例】百度换肤、【案例】表单全选案例、 【案例】tab栏切换案例、【案例】节点操作及发布留言案例、【案例】动态创建表格案例、【案例】事件详解及案例、 BOM介绍及应用、【案例】定时器和相关案例、this指向和js执行机制、【案例】location、navigator、history对象、 offset、client、scroll三大家族介绍及案例应用、缓动画的原理和封装、【案例】网页轮播图实现、节流阀、 【案例】返回顶部及筋斗云案例、【案例】移动端轮播图实现、【案例】移动端插件使用及轮播图的实现、 【案例】HTML5本地存储及记住用户名案例
jQuery快速开发
jQuery介绍及常用API导读、【案例】jQuery选择器及案例、jQuery链式编程及样式操作、 【案例】jQuery动画及王者荣耀手风琴案例、【案例】jQuery实现购物车案例、【案例】jQuery实现电梯导航案例、 jQuery事件绑定和解绑、jQuery插件的使用、【案例】jQuery实现todolist案例
【项目】 基于ECharts数据可视化项目
ECharts介绍和配置、数据可视化项目适配方案、数据可视化项目-监控区域实现、饼形图和用户统计模块实现、柱形图定制区域实现、销售统计模块实现、渠道分布模块实现、季度进度模块实现、全国热榜模块实现
JavaScript高级用法
面向对形象编程介绍、类和对象、【案例】面向对象tab栏切换案例、构造函数和原型对象、forEach、some、 【案例】filter方法及查询商品案例、Object.defineProperty方法、函数进阶、call、apply、bind的使用、 闭包及应用、递归及应用、正则表达式及应用、ES6中的let和const、ES6解构赋值、ES6箭头函数、剩余参数和拓展运算符、 Array实例方法、ES6模板字符串和set数据结构

市场价值 : 能够完成PC端网页、移动Web网页、响应式页面中的功能和特殊效果的开发工作,学完此阶段,具备一定的企业基础用人标准,但尚未达到初级前端开发工程师水平。

阶段四 : Node与Ajax

Ajax+HTTP
ajax介绍、【案例】图书列表案例、【案例】聊天机器人、form表单+案例、【案例】模板引擎+案例、正则与字符串操作、xhr的基本使用、数据交换格式、封装自己的Ajax函数、XHR Level2的新特性、jQuery用法、axios、同源策略、跨域、Jsonp、【案例】淘宝搜索案例、防抖和节流、HTTP协议简介、HTTP请求消息、HTTP响应消息、HTTP响应状态码
Git和github基本使用
关于版本控制、Git基础概念、安装并配置Git、Git的基本操作、开源相关的概念、github、分支
【项目】后台管理项目
准备工作、登录注册、后台主页、基本资料、重置密码、更换头像、文章类别、文章列表、分页、删除文章、发布文章
Node基础
node介绍和环境安装、node-fs模块、node-path模块、【案例】node-时钟案例、node-http模块、node-服务器概念、node-创建基本web服务器、node-根据不同的url响应不同的html内容、【案例】node-时钟web服务器案例、node-模块化
npm+模块加载机制
包、npm、包管理配置文件及解决下包慢的问题、包的分类、开发属于自己的包、发布包、模块的加载机制
Express
express、中间件、【案例】基于express写接口
MySQL数据库
cors+jsonp、数据库的基本概念、sql、mysql模块
身份认证
web开发模式、身份认证+session、jwt
【项目】NodeAPI接口项目
注册新用户、登录、获取和更新用户信息、重置密码、更改头像、获取文章分类列表、新增文章分类、根据Id删除、获取,更新文章分类、发布新文章

市场价值 : 能够完成前后端数据交互、基于前后端分离模式、传统模式的开发的工作,学完此阶段,具备企业基础用人标准,能够达到初级前端开发工程师水平。

阶段五 : Vue.js 项目实战

Vue基础
【案例】Vue指令及案例(选项卡案例)、修饰符、样式绑定、v-model底层原理、计算属性、过滤器、侦听器、Vue声明周期、【案例】图书管理综合案例、vue组件、【案例】购物车案例、Promise、Fetch、axios、【案例】基于后台接口的图书管理案例、vue路由、【案例】路由案例、前端工程化和模块化
webpack
前端工程化和模块化、webpack介绍与安装、webpack之loader配置与使用、webpack与vue结合使用
Vue-cli3和Element-UI
Vue-cli3(Vue脚手架)、Element-UI组件库
【项目】Vue电商后台管理系统
电商管理项目介绍和初始化、登录功能、退出功能、首页布局和功能实现、用户列表布局和功能实现、用户添加、修改、删除功能、权限列表、角色列表、分配权限和角色、商品分类、分类参数、商品列表、商品添加、订单列表、Echarts数据统计、项目优化、项目部署上线
Vuex
Vuex基础、【案例】基于Vuex的todos案例
【项目】社交媒体
项目初始化、登录注册、个人中心、首页-展示文章列表、频道编辑、文章搜索、文章详情、文章评论、编辑用户资料
【项目】HR-saas中台管理项目
登录、登出、角色管理业务、组织架构业务、角色权限、角色列表、员工管理业务、Echarts 雷达图、审批业务、工作日历、多语言功能、全屏(screenfull)、tabs 页多页签组件、导入导出 Excel、Excel 复杂型表头、图片上传、预览及打印、el-upload 上传第三方云服务器、图片生成二维码

市场价值 : 能够实现基于Vue技术栈项目的开发能力,学完此阶段,具备企业用人标准,能够达到中级前端开发工程师水平。

阶段六 : 微信小程序

微信小程序
微信小程序介绍、 微信小程序配置、 微信小程序代码构成、 微信小程序宿主环境、微信小程序协同工作和发布、 微信小程序基础、 微信小程序进阶、微信小程序数据请求和案例、微信小程序页面导航、微信小程序页面事件和上拉触底案例、微信小程序生命周期和wxs、【案例】本地生活综合案例、微信小程序组件和样式、微信小程序数据、方法、属性和数据监听、微信小程序数据监听案例、组件生命周期和插槽、父子组件通信和behaviors、vant 小程序 UI 组件库和API的Promise化、微信小程序全局数据共享、分包、自定义tabBar、微信小程序事件和导航、网络请求
电商项目
客户消息、微信支付、微信地址、小程序转发、区域滚动、上拉加载 、下拉刷新 、数据缓存、用户信息、自定义组件、微信登录、意见反馈、上线发布

市场价值 : 能够使用小程序原生框架和uniapp框架进行微信小程序项目开发,学完此阶段,具备企业用人标准,能够达到中级前端开发工程师水平。

阶段七:React.js项目实战

React基础
React基本使用、JSX语法、React组件基础、React组件进阶、React原理及优化、React路由
【项目】React项目
项目介绍和初始化、项目首页布局+功能实现、百度地图API使用、城市选择和渲染、顶部导航组件封装、CSS Modules、地图找房功能实现、FilterTitle、FilterPicker、FilterMore组件实现、房源筛选及房屋详情功能、用户登录功能实现、房源收藏功能实现、发布房源和搜索房源功能实现、项目打包及项目优化

市场价值 : 能够实现基于React技术栈项目开发能力,配合常用组件库解决项目中的一些共性问题,满足前端开发行业中的常见需求,学完此阶段,具备企业用人标准,能够达到中级前端开发工程师水平。

阶段八:面试指导

前端-工作面试指导技巧
简历内容篇、求职内容篇、面试内容篇、工作内容篇、市场行情篇、人事内容篇、工作心理篇

市场价值 : 通过面试指导+就业指导资料,更加容易通过企业的面试。