服务时间: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前端的生态系统几乎涵盖了目前市面上所有的软硬件,web前端在中国的地位20年都是霸主,几乎是万能的,你能想到的,web前端基本都能实现。

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

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

  • Html5

  • Css3

  • Js

  • Es6

  • 可视化

  • React

  • Node.js

  • Vue.js

  • ·网页制作工程师
  • ·Html5开发工程师
  • ·Web开发工程师
  • ·小程序开发工程师
  • ·前端开发工程师
  • ·网站重构工程师
  • ·前端架构师
  • ·小游戏开发工程师
  • WEB前端开发课程体系(项目驱动型)

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

    第一阶段

    专业核心基础

    第二阶段

    Web后台技术

    第三阶段

    数据库和框架实战

    第四阶段

    移动端和微信实战

    第五阶段

    就业与补充强化

    阶段目标

    1. 熟练掌握HTML5、CSS3、Sass、响应式布局、移动端开发

    2. 熟练运用HTML+CSS特性完成页面布局

    3. 熟练应用CSS3技术,动画、弹性盒模型设计

    4. 熟练完成移动端页面的设计

    5. 熟练运用所学知识仿制任意Web网站

    6. 能综合运用所学知识完成Woniu官网设计和家居网实战

    阶段项目

    12306网页实战、apache网站实战、豆瓣网首页实战、英雄联盟页面设计、室内装修门户网站整站、家具网站整站开发、生鲜平台整站开发、天猫商城移动端开发、苹果官网移动开发

    第一周

    HTML和CSS入门

    课程目标

    熟练运用HTML和CSS样式属性完成页面的布局和美化,基于PSD原稿完成页面像素级还原布局和设计

    知识要点 PhotoShop抠图切片技巧Web前端开发环境HTML常用标签表单元素CSS基础样式使用字体图标设计选择器权重计算PhotoShop抠图技巧利用PS完成APP图标设计网页的切片制作Web前端开发环境HTML常用标签表单元素表格列表HTML5音频视频iframe框架浏览器加载网页的流程CSS的结构和语法CSS基本属性字体(字体引用技术)字体图标背景文本超链接锚点
    第二周

    布局实战和H5控件

    课程目标

    熟练掌握网页布局设计,理解动画的原理,掌握动画的基础设计并完成网页动态效果设计

    知识要点 选择器样式继承IFCBFCCSS兼容处理见布局技巧CSS新增特性选择器权重CSS属性继承CSS布局盒模型(标准和模型、怪异盒模型)浮动概念和设计4种定位的使用网页布局实战BFCIFC三列布局圣杯布局双飞翼布局等高布局H5新增表单控件语意化标签浏览器兼容原理CSS处理兼容性的方案hack代码CSS3新增样式补充圆角背景线性变化和径向变化盒子阴影设计兼容处理
    第三周

    CSS3新特性和动画

    课程目标

    使用集合完成项目重构,实现保存棋谱及复盘功能

    知识要点 弹性布局transtion过渡tranform动画Animation动画使用技巧2D动画和3D动画设计弹性盒模型基础弹性布局弹性空间富裕控件弹性因子过渡的基础2D动画的设计transformrotateskew矩阵3D坐标透视基本概念动画设计关键帧Animation动画轮播图设计原理豆瓣网整站布局和设计在线课堂设计
    第四周

    移动端、SASS和BootStrap

    课程目标

    独立完成移动端页面设计、能够熟练使用 Less、Sass完成项目开发,深入了解BootStrap

    知识要点 响应式布局原理移动端页面设计预编译CSS技术LessSassBootStrap源码分析media媒体查询使用响应式页面设计移动端布局原理pxemrem的概念和区别viewport常用meta设置LessSass预处理器安装及编译变量运算继承混合父选择器循环语法BootStrap栅格系统源码常用组件BootStrap组件和插件轮播图插件tab页面切换模态框LayUI框架
    第五周

    项目实战及优化

    课程目标

    通过项目掌握第一阶段HTML、CSS的内容、完成PC端页面设计和移动端页面设计

    知识要点 使用HTMLCSSLESSSASS等技术完成家具网项目实战页面需求分析设计切图搭建项目骨架网站主页设计导航轮播图商品动画效果设计商品详情页面设计商品放大镜效果商品图片切换购买页面支付页面设计个人中心包括个人的基本信息个人订单页面项目验收和答辩
    阶段目标

    1. 了解JavaScript的发展历史、掌握Node环境搭建及npm使用

    2. 熟练掌握JavaScript的基本数据类型和变量的概念

    3.熟练掌握JavaScript中的运算符使用、结构语句和循环语句

    4. 掌握数组的使用和常见算法、掌握函数的使用

    5. 掌握DOM、BOM的技术,完成网页各种动态效果的设局

    6. 掌握ES5面向对象、ES6面向对象和ES6新特性。

    7. 熟练使用H5技术来开发音频视频、地图。掌握异步编程和http协议

    阶段项目

    JS贪吃蛇游戏、视频播放器、小麦网整站、电影购票网站整站

    第六周

    Node.js基础和JS基础

    课程目标

    掌握 Node.js的基本操作、熟练掌握JavaScript的基础知识

    知识要点 Node概念环境搭建npm操作算法变量数据类型控制结构数组和函数Nodejs环境安装变量概念输出浏览器环境输入运算符基本数据类型及其转换控制结构一维数组数组常见api及实现二维数组冒泡排序选择排序函数基础箭头函数函数嵌套arguments递归快速排序函数作用域声明提升IIFElet和const
    第七周

    WebAPI核心编程

    课程目标

    熟练使用BOM的各种对象、熟练操作DOM的对象

    知识要点 BOM操作DOM操作JavaScript原生对象属性和方法DOM树DOM选择器innerHTML和innerText事件基础Node&Element类常用属性和方法正则表达式闭包window对象historynavigatorlocationscreen弹出框定时器DOMCSS事件基础事件流event对象touch事件事件委托jQuery基础选择器常用apijQuery插件开发
    第八周

    面向对象和ES678

    课程目标

    熟练掌握JavaScript面向对象的开发以及掌握es6中的重要内容

    知识要点 JavaScript面向对象基础(ES6)异常处理机制常见对象apijs的兼容性ES6新特性面向对象概念类和对象基础属性和行为构造函数及this对象数组类属性和行为继承特性重写super内存空间垃圾回收JavaScript异常处理机制JavaScriptES5模拟面向对象(原型和原型链)apply内置对象apiObject类深克隆浅克隆严格模式ES6特性解构赋值扩展运算符set&map数据结构
    第九周

    H5实战和前后端分离

    课程目标

    熟练使用所学知识来完成电影城项目开发

    知识要点 H5相关apicanvasajax异步编程Promise数据模拟mockjscanvas上下文容器矩形绘制路径绘制样式控制创建图片图片裁剪requestAnimateFrameh5音频视频本地及离线存储拖拽H5定位百度地图api百度地图出行规划百度地图地址解析HttpHttps协议mockjs数据规范fastmock使用同步和异步原生ajax设计jQuery-Ajax封装ES6-PromiseES7-AsyncGenerator函数
    第十周

    项目设计和优化

    课程目标

    熟练使用所学知识来完成电影城项目开发和小麦网项目开发

    知识要点 使用HTML、CSS、LESS、SASS、JavaScript、jQuery、Ajax等技术完成项目实战
    阶段目标

    1. 综合运用Web前端技术进行页面布局与美化

    2. 综合运用Web前端开发框架进行Web系统开发

    3. 熟练掌握Mongodb数据库的发开

    4. 熟练掌握vue.js、webpack、elementui等前端框技术

    5. 熟练运用Node.js开发后台应用程序

    6. 熟练使用MySQL,掌握数据库高级操作

    7. 熟练使用JDBC,掌握开源工具DbUtils的使用

    8. 对Restful,Ajax,JSON,开发过程有深入的理解,掌握git的基本技能

    阶段项目

    珠宝首饰在线购买、宠物寄养管理系统、电脑维修管理系统

    第十一周

    Node基础和MongoDB

    课程目标

    熟练运用Node.js运行环境和后台开发框架完成Web系统的后台开发

    知识要点 模块系统函数路由全局对象文件系统请求处理Web模块Express框架MongoDB数据mongose插件Node.js回顾缓存处理npm命令常用API(http、os、path)http的数据获取文件的读取fsrequire模块化异步请求数据渲染模版引擎atr-templateexpress框架Nosql数据库MongoDB环境安装创建数据库文档集合CRUD-APIMongoDB条件查询分页查询效率优化多表联合查询mongose插件安装以及使用
    第十二周

    Node.js进阶Webpack

    课程目标

    熟练运用Node.js运行环境和后台开发框架完成Web系统的后台开发,熟练使用打包工具

    知识要点 RestfulAPI文件上传状态管理处理方案Webpack打包loaderplugins配置RestfulAPIMVC三层架构设计文件上传和下载Restful风格接口设计跨域处理SessionCookieJWTToken状态管理打包概念grunt和gulpwebpackentryoutputDevServerwebpackloaderplugins插件安装的配置框架和库RestfulAPI文件上传状态管理处理方案Webpack打包loaderplugins配置vueMVVM环境搭建常用指令
    第十三周

    Vue.js框架实战

    课程目标

    对Vue.js框架的基本使用有清晰的理解,能够运用Vue.js完成基础前端开发、熟练运用Vue.js框架的高级功能完成Web前端开发和组件开发,对MVVM模式有深刻理

    知识要点vue的组件生命周期路由前端工程化vuexelementui框架vue事件绑定属性操作属性动态计算过滤器常用api学习vue生周期钩子函数组件传值SPA单项数据流vue-cli脚手架单文件组件props虚拟dom和跨域axiosaxios请求和响应vuerouter导航守卫vuexVueX工作流程MutationsActionsModelselementui引入基础布局组件sourcetree安装sourcetree使用
    第十四周

    项目设计和优化

    课程目标

    基于Node.js+Vue.js+Webpack+MongoDB+Git,实现整站项目完整功能并上线发布

    知识要点 需求分析数据库设计使用vue、node完成pc和移动端整站开发
    阶段目标

    1. 熟练掌握React.js框架,熟练使用React.js完成开发

    2. 掌握移动端开发原理,理解原生开发和混合开发

    3. 熟练使用react-native和Flutter框架完成移动端开发

    4. 掌握微信小程序以及uni-app一站式开发

    5. 基于学院项目池,完成租车系统

    阶段项目

    todolist任务管理、豆瓣电影APP、Woniu跑腿APP、停车缴费小程序、WoniuCarRental微信小程序和APP

    第十五周

    React实战

    课程目标

    熟练使用react全家桶完成项目开发

    知识要点 组件propsstate事件生命周期hooksReduxReactRouterReact(MVC、VirtualDOM、Diff算法)脚手架工具React元素与JSX函数组件和类组件propsstate(设置state、修改state)事件合成事件受控组件与非受控组件生命周期pureComponenthooks(useState、useReducer、useEffect、自定义hook)reactrouter(路由的设置、路由嵌套、路由跳转、路由传参)redux(action、reducer、store)设置数据初始值react-redux组件获取数据并渲染redux中操作数据react搭配fetch连接服务端中间件(logger和thunk/saga)
    第十六周

    React-native和Flutter框架

    课程目标

    Flutter:环境搭建、widget、statefullwidget和statelesswidget、事件、网络请求、列表刷新、底部tab导航栏、路由、打包 APK

    知识要点 ReactNative环境搭建组件样式表单事件网络请求列表刷新导航底部tab导航栏打包APK移动端开发原理移动端开发模式ReactNative开发环境搭建基础组件样式屏幕适配输入框处理事件网络请求页面数据动态渲染列表下拉上拉ReactNavigation页面跳转及传参标题栏配置TabNavigationFlutterwidget屏幕适配静态页面练习轮播插件flutter-swiper生命周期网络请求dio路由fluro的配置页面跳转传参APK打包
    十七周

    uni-app和微信小程序

    课程目标

    uni-app:开发工具、基本使用、vuex、地图功能

    知识要点 微信小程序开发工具wxml和wxss全局配置和页面配置自定义组件本地存储网络请求导航云开发小程序发布布局基础样式基础组件使用视图容器组件表单组件多媒体JSON配置datasetData事件自定义组件组件通信页面和组件生命周期页面跳转网络请求数据渲染(列表渲染和条件渲染)列表刷新加载本地存储云开发云数据库云存储云函数uni-app介绍底部导航栏页面组件样式data数据事件生命周期地图组件和腾讯地图API相册拍照图片上传和预览Vuex的引入和使用各平台条件编译插件库
    第十八周

    毕业项目综合实战

    课程目标

    WoniuCarRental,整个项目前后端分离开发, 整个项目分为四部分:PC端网页、移动端APP、小程序、后台管理,团队协作开发,使用git进行版本控制

    知识要点 团队协作完成毕业项目
    阶段目标

    1. 基于学院的项目池继续拓展和积累实战项目经验

    2. 基于学院的视频课程和直播课程完善知识体

    3. 完成职业素养类课程,让学员成为一个职场专业人士

    4. 在就业老师的指导下,进行面试准备并去企业面试,最终完成就业

    补充自选课程
    区块链开发数据结构与算法游戏外挂UML项目管理Oracle数据库MongoDB大数据移动端App开发Web前端框架OpenCV图像处理Lucene全文搜索ES全文搜索人工智能自动化测试自动化运维Python开发等(持续更新中)
    就业与面试辅导
    知识体系梳理简历项目指导简历人事指导针对每个学生进行模拟面试针对每个学生基础进行查漏补缺职业素养类课程简历指导与面试技巧模拟面试与辅导办理离校手续讲师与导师全程辅导直到正式就业
    WEB前端学习必备书目推荐

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

    高性能JavaScript [美}Nicholas C. Zakas(尼古拉斯.泽卡斯)

    这本书是JavaScript界的神书之一,如果你说你没看过这本书而且你还是一个Web前端开发者,那你就跟号称经济学家却没读过《微观经济学》一个水平了。

    编写可维护的JavaScript [美] Nicholas C. Zakas(扎卡斯)

    程序是写给人读的,只是偶尔让计算机执行一下。在我们的日常开发中,往往维护代码的时间占据着很大比重, 既然这样那么为什么我们不在编写代码的时候就重视它呢?

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

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

    CSS禅意花园 [美]Dave、[美]Molly E.Holzschlag

    看过css禅意花园后,会让你对网页设计产生了很大的兴趣,书中每个例子都堪称经典,都代表了各位作者对网页设计的理解,这些设计并没有使用什么花哨的技术,使用最基本的css即可完成佳作~

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

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

    web网页前端培训讲师简介及答疑
    Alice

    web前端设计培训

    擅长互动教学,并引导学员建立设计思维,将实际工作场景带入课堂,使学员快速进入企业工作模式。 点击咨询
    • 01 WEB前端开发前景怎么样

      现在互联网行业普遍缺少前端工程师,越来越多的人将会加入前端的大军,不仅是因为大多数前端工作提供的优渥薪水和办公环境,也是因为web前端编程变得越来越有挑战和意义。

    • 02 web前端可以自学吗

      自学最痛苦的事情莫过于自己研究一个问题研究大半天没有结果,如果你身边有一个大咖存在,并且愿意免费带你,那我觉得自学这条道路还是可行的,否则劝你还是认真考虑考虑。

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

      作为一款web安全开发工具,Secureheaders能够自动实施安全相关的header规则,包括内容安全政策(CSP),防止 XSS、HSTS等攻击,防止火绵羊(Firesheep)攻击以及XFO点击劫持等。

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

      Share Icon--提供超过25万中ICON矢量图片素材的站点,120多种分类,所有的素材都提供PNG、SVG格式,素材有多种尺寸尺寸包括 512*512、256*256、128*128、64*64、32*32、16*16等。

  • 上一篇广州web前端开发培训机构哪家好
  •   
      
    相关课程
    1. 岳阳学习web前端开发哪家好
    2. 福州零基础学web前端哪里好
    3. 哈尔滨web前端培训哪家好
    4. 芜湖web开发培训
    5. 大同web学习班哪家好