6大优势构建AI新时代下的前端工程师核心能力

深度契合

打造真正企业级工作流场景

AI赋能

重构AI新时代前端学习新生态

即时更新

渐进式课程教学模式

额外附赠

架构师进阶视频豪华大礼包

广泛覆盖

主流高能技术模块深入剖析

大咖面授

名师云集全程带你从入门到突破

前端正在快速覆盖越来越多的新领域新场景

  • 电商
  • 在线教育
  • 金融
  • 保险
  • 银行
  • 区块链
  • 政务
  • 医药
  • 智慧城市
  • 租房
  • 物流
  • 广告
  • 直播
  • 音视频
  • 游戏
  • 车联网
  • 智慧交通
  • 供应链
  • 餐饮
  • 地产
  • 能源
  • 服务
  • 健康
  • 军工
  • 人工智能
  • 出行

大咖带队,全程实战

学员亲自上手实操AIGC背景下的前端工作

  • 尚品汇Vue2前台
  • 尚品汇Vue3后台
  • 谷粒仓储
    Vue2管理平台
  • 尚医通Vue3前台
  • 尚医通Vue3后台
  • 尚医通React前台
  • 尚医通React后台
  • 硅谷听书Vue3后台
  • 慕尚花坊小程序
  • 谷粒微课小程序
  • 尚上优选小程序
  • 尚品汇小程序
  • 硅谷听书小程序
  • 硅谷AI聊天机器人
  • 尚品汇数据可视化
  • 爱尚记账
项目特色
本项目采用模块化、组件化和工程化理念,结合高效技术实现多端展示、优化用户操作流程,提供完整的电商购物车与订单支持,并可通过物流跟踪等功能增强客户体验。
主要技术栈
Vue Vuex VueRouter ES6 Axios Babel ESLint Webpack
学习目标
  • 培养分析理解、技术性线路划分等能力
  • 应用模块化、组件化、工程化理念进行Vue页面设计
  • 实现电商平台的购物车、订单支持流程和物流模块等功能,并优化用户体验
  • 结合第三方平台集成客服系统等功能,提高开发效率,为大型电商项目的开发打下基础
项目特色
本项目提供了基于Vue3和TypeScript的企业级中后台前端解决方案,涵盖了RBAC权限管理、路由配置、Vuex数据传递、第三方插件应用、动态表单创建等多种功能模块。同时还注重性能优化和安全性需求,并具备文本格式转化、大屏可视化等特色功能。
主要技术栈
Vue3 TypeScript Vue-Router Pinia Axios Babel ESLint Vite Java SpringBoot SpringCloud MySQL
学习目标
  • 掌握企业级中后台前端解决方案的开发
  • 熟悉Vue3技术栈和TypeScript语法
  • 理解RBAC权限管理、路由配置、Vuex数据传递等功能模块,并学会性能优化和安全性需求的实现
  • 掌握第三方插件应用、动态表单创建、文本格式转化、大屏可视化等特色功能
项目特色
本项目是基于Vue2全家桶开发的谷粒仓储管理平台,包含了Vue生态核心技术栈、主流技术组件库Element等,项目结构清晰、组件化开发、技术完备,充分提升学员组件封装能力。
主要技术栈
Vue-Admin-Tempate Vue2 Vue Router3 Vuex3 Vue CLI Element UI Axios Sass Lodash
学习目标
  • 掌握Vue开发项目的流程和套路
  • 熟练掌握Element UI的使用
  • 掌握对组件库进行二次封装的思想
  • 熟悉Axios和Lodash等前端工具库的使用
  • 熟悉RBAC 权限管理系统的使用
项目特色
尚医通是以某医院预约挂号统一平台为原型而搭建的在线医疗服务平台,采用Vue3 全家桶、TypeScript、Pinia技术开发,该平台集成多家医院的挂号信息,提供全程跟踪服务,用户可以随时了解自己的挂号状态。
主要技术栈
Vue3 Vue Router4 TypeScript Vite Pinia Sass Axios Element Plus Ant-Design-Vue
学习目标
  • 巩固前端学习高级阶段的Vue3、Vite、Pinia、TypeScript、Axios等核心技术;
  • 熟练掌握Element Plus和Ant-Design-Vue的UI框架使用,了解如何通过组件库快速开发和美化页面
  • 学会如何进行网络请求和响应拦截器的使用,了解如何与后端交互从而获取数据
  • 掌握如何使用状态管理库Pinia在组件间传递数据,并实现组件的复用和解耦
  • 能够对组件进行二次封装
项目特色
尚医通后台项目是一款基于 Vue3、TypeScript、Vite4、Pinia、Element-Plus技术体系开发的的后台管理项目,使用目前流行技术栈开发。封装了一些常用组件、Hooks、指令、动态路由、按钮级别权限控制等功能。
主要技术栈
Vue3 Vue Router4 Vite Pinia TypeScript Sass Axios Element Plus
学习目标
  • 熟练掌握Vue3全家桶、TypeScript、Element Plus UI等技术的使用
  • 学会如何使用axios进行网络请求和响应拦截器的使用,了解如何与后端交互从而获取数据
  • 掌握如何使用状态管理库Pinia在组件间传递数据,并实现组件的复用和解耦
  • 能够对组件进行二次封装
  • 掌握RBAC权限管理
项目特色
尚医通是以某医院预约挂号统一平台为原型而搭建的在线医疗服务平台,采用React技术开发,该平台集成多家医院的挂号信息,提供全程跟踪服务,用户可以随时了解自己的挂号状态。
主要技术栈
React Redux React Router Antd react-i18next Axios TypeScript Babel ESLint Echarts Webpack
学习目标
  • 熟悉 React、TypeScript 等技术
  • 掌握完整项目开发流程
  • 学会如何进行网络请求和响应拦截器的使用,了解如何与后端交互从而获取数据
  • 掌握模块化、组件化、工程化
项目特色
本项目采用React18版本和TypeScript语言,使用Hook函数组件式开发模式,并且利用Antd、Axios等库提高了应用程序的效率、可维护性、可扩展性和用户体验。
主要技术栈
React Redux React Router Antd react-i18next Axios TypeScript Babel ESLint Echarts Webpack Java SpringBoot SpringCloud MySQL
学习目标
  • 熟悉 React、TypeScript、React Hook、Redux 等技术
  • 掌握完整项目开发流程
  • 实践搭建后台管理模板项目,实现国际化处理、用户认证流程等功能
  • 掌握模块化、组件化、工程化
项目特色
本项目是一款基于Vue3、TypeScript、Vite4、Pinia、Element-Plus等技术开发的后台管理框架,使用目前流行技术栈开发。封装了一些常用组件、Hooks、指令、动态路由、按钮级别权限控制等功能。
主要技术栈
Vue3 Vue Router4 Vite Pinia TypeScript Sass Axios Element Plus
学习目标
  • 熟练掌握Vue3全家桶
  • 熟练使用TypeScript进行开发
  • 掌握Element Plus UI框架的使用,快速开发和美化页面
  • 学会使用axios进行网络请求和响应拦截器的使用,与后端交互获取数据
  • 掌握状态管理库Pinia,在组件间传递数据,实现组件复用和解耦;并能对组件进行二次封装
  • 掌握RBAC权限管理
项目特色
慕尚花坊是一款使用原生小程序开发的在线鲜花商城,包含小程序开发所有常用知识点,拥有丰富的功能模块和高效的性能优化。使用组件库Vant、地图服务LBS等多种技术、开发者工具提供的自动生成骨架屏代码能力,提升用户体验度。
主要技术栈
小程序API 小程序模板语法 Node.js 慕尚花坊真实接口
学习目标
  • 学习小程序组件化、网络请求封装、LBS逆地址解析、UI组件库等技术特点
  • 进一步提升小程序开发能力
项目特色
谷粒微课是一款在线教育小程序平台,提供IT在线课程教学服务,为用户提供各类IT课程的在线试看、收藏、购买、播放等功能。项目包含完整的视频推流以及全支付过程,包括服务器宕机、断电等各种复杂情况。
主要技术栈
Vue3 UniApp 原生小程序 Vite Pinia TypeScript Sass Uni-UI
学习目标
  • 巩固前端学习的高级阶段的Vue3、Vite、Pinia、TypeScript、UniApp等核心技术
  • 了解视频推流等实际业务场景
  • 掌握网页的布局技巧
  • 熟悉多种支付平台核心功能点
项目特色
尚上优选是一个典型的O2O移动端电商项目,主要依托基于Vue3的UniApp和Tmui这一UI框架,并结合常见的第三方插件与功能类库,完成项目中具体的业务功能需求。从需求分析、功能开发到功能集成,遵循企业级的标准化项目开发流程。
主要技术栈
UniApp TypeScript
学习目标
  • 掌握Vue3、TypeScript、微信小程序、UniApp的开发技术
  • 通过项目实战了解项目规范、管理和开发流程
  • 在实际项目中深入理解并应用Vue3
  • 在项目中充分利用TypeScript的优势
  • 熟练掌握小程序开发中的支付、地图、组件封装等技术难点
项目特色
尚品汇是一款使用微信原生小程序开发的电商小程序,包含常见电商模块和支付等功能。项目使用腾讯的组件库TDesign-Miniprogram,使用npm管理包的依赖,采用小程序分包机制,减少主包体积。
主要技术栈
微信原生小程序 TDesign-Miniprogram
学习目标
  • 学习如何使用小程序基础语法
  • 学习如何使用微信支付功能
  • 学习如何对小程序进行分包
项目特色
本项目是一款使用UniApp开发的在线听书小程序,包含小程序开发所有常用知识点,拥有丰富的功能模块和高效的性能优化。使用组件库GraceUI,具有背景音频播放,视频直播,多人聊天室,微信支付、余额支付等多种技术的实现。
主要技术栈
UniApp Vue3 Pinia TypeScript Sass GraceUI Uni-UI
学习目标
  • 熟练掌握 UniApp、Vue3、TypeScript的开发
  • 使用组件库快速开发和美化页面
  • 掌握uni.request进行网络请求和响应拦截器的使用,实现与后端交互获取数据
  • 使用状态管理库 Pinia 实现组件间传递数据,实现组件复用和解耦
  • 对组件进行二次封装,了解工程化思想、微信登陆、支付流程
项目特色
一个基于ChatGPT的Web双端 项目,它使用OpenAI GPT来生成自然对话。用户可以通过与ChatGPT交互来获取有关各种主题的信息和建议。该项目还包括一个简单的用户界面,使用户能够轻松地与ChatGPT进行交互。
主要技术栈
Vue3 Vue Router4 Vite Pinia TypeScript Sass Axios NativeUI Node.js Express Axios ChatGpt
学习目标
  • 熟练应用Node.js进行后端开发
  • 基于ChatGpt工具库与GPT接口交互
  • 熟练使用Vue3全家桶
  • 掌握前后台Token鉴权
  • 熟练掌握对Axios的二次封装
  • 熟练掌握项目的多环境配置、Eslint的应用等
项目特色
本项目采用前端技术和数据可视化技术,将大量的数据以直观、易于理解的方式展示在大屏幕上。可以一目了然地观察到数据的趋势、关联和异常情况,从而帮助用户发现问题、优化业务流程和做出决策。
主要技术栈
Vue.js Vuex Vue Router Axios Element Plus Ant Design Vue ECharts
学习目标
  • 了解数据可视化的基本概念、原理和常用的可视化方法
  • 学习如何从不同的数据源获取数据,并对数据进行处理和转换,以满足可视化需求
  • 掌握常用的数据可视化库和工具
  • 熟悉流行的前端框架和组件库
  • 学习如何设计响应式的数据可视化大屏
项目特色
本项目是为全栈工程量身定制的一套全链路课程,以提高学员综合能力和对整个前后端开发过程的把控能力为目标,从产品设计、接口设计、数据库设计到前端开发,涉及整个互联网产品从0到1的开发过程,让你重新认识全栈开发的细节技术和架构选型。
主要技术栈
Node.js Egg Apifox Vite React React Hooks Egg-Jwt Egg-Mysql
学习目标
  • 学习如何使用Egg开发一个全栈项目
  • 学习如何使用Apifox进行接口调试
  • 学习如何鉴权

课程大纲开启AI赋能前端教学新纪元

与钉钉等企业合作共建AI时代的大前端课程
前端+后端+移动端+小程序+大屏可视化+AI赋能开发

200+技术点实时更新,打破信息差,学企业真正需要的技术

  • HTML
  • HTML5新特性
  • PhotoShop
  • 企业UI图布局
  • 精灵图
  • 浮动
  • 定位
  • CSS2
  • HTML5
  • 语义化标签
  • 自定义播放器
  • 响应式布局
  • 双飞翼布局
  • 圣杯布局
  • 伪等高布局
  • Canvas
  • Video
  • Audio
  • LocalStroage
  • SessionStorage
  • Websocket
  • 拖拽
  • Animation
  • Transition
  • 2D变化
  • 3D变化
  • 幽灵按钮
  • 文字特效
  • 阴影特效
  • 翘边阴影
  • Sass
  • Less
  • Stylus
  • SVG
  • 盒模型
  • 蓝湖
  • 设计稿
  • AI
  • JavaScript
  • Obejct
  • Array
  • Function
  • Ajax
  • Regex
  • ECMAscript2015
  • ECMAscript2016
  • prototype
  • __proto__
  • Bom
  • Dom
  • 函数化封装
  • JSONP
  • CORS
  • 闭包
  • 原型
  • 作用域
  • 性能优化
  • 单例模式
  • 工厂模式
  • 建造者模式
  • 原型模式
  • 代理模式
  • 事件队列
  • 流程语句
  • 条件语句
  • 队列
  • 编程模拟进出栈
  • 同步与异步
  • 回调函数
  • Promise
  • Generator
  • async与await
  • 宏队列与微队列
  • 宏任务和微任务
  • 高阶函数
  • 纯函数
  • 函数柯里化
  • 代码组合
  • 链表
  • 常用排序算法1: 冒泡
  • 常用排序算法1: 选择
  • 常用排序算法1: 插入
  • 函数防抖
  • 函数节流
  • 深拷贝
  • 浅拷贝
  • jQuery
  • jQuery插件
  • 事件模型
  • 事件委托
  • ArtTemplate
  • Echarts
  • 数据可视化
  • BootStrap
  • BootStrap源码分析
  • Angular
  • Angular模板解析
  • Angular双向数据绑定
  • Zepto
  • viewport
  • Rem
  • 多指事件
  • 事件点透
  • 物理像素
  • 橡皮筋效果
  • 封装移动端插件
  • 布局视口
  • 视觉视口
  • 理想视口
  • meta标签
  • 无缝滑屏
  • Node.js
  • Express.js
  • npm
  • cnpm
  • yarn
  • cookie
  • session
  • MongoDB
  • 跨域问题
  • Nginx
  • JSONP
  • 数据库增删改查
  • GET,POST请求
  • HTTP协议
  • SHA1、MD5加密隐私数据
  • 前端安全,数据加密
  • 中间件
  • Koa.js
  • Express.js
  • Koa-router
  • 校验服务器有效性
  • 接口管理
  • 用户管理
  • 群发消息
  • 获取全局接口调用凭据(ticket)
  • signature值的计算
  • 语音查电影功能
  • 爬虫
  • 微信公众号开发
  • 浏览器渲染原理
  • 浏览器内核
  • requestAnimationFrame
  • DNS、CDN
  • sessionStorage、localStorage
  • 跨页签通信的实现
  • 网页性能优化
  • Git
  • Svn
  • Github
  • requestAnimationFrame
  • DNS、CDN
  • css图层
  • 图层的合理应用
  • css、js阻塞
  • 重绘重排
  • webpack
  • Grunt
  • Gulp
  • Gulp热加载
  • linux常见命令
  • React
  • Vue
  • Vue-cli
  • MVVM
  • Mint-UI
  • Redux
  • Vuex
  • Weex
  • Mock
  • Json-server
  • Vue源码分析
  • Element UI
  • Axios
  • Fetch
  • flyio
  • iView
  • Vue指令
  • 组件化
  • 模块化
  • 单项数据流
  • 双向数据流
  • MVC
  • MVVM
  • 消息订阅发布
  • React-router
  • Vue-router
  • Eslint
  • slot
  • keep-alive
  • setter/getter
  • props
  • state
  • refs
  • Vue2
  • Vue3
  • TypeScript
  • 原生小程序
  • 生命周期
  • mpvue
  • 小程序组件
  • 小程序配置
  • 小程序音乐播放
  • mpvue生命周期
  • cocos creator
  • 小游戏
  • 微前端
  • Flutter
  • HTML
  • HTML5新特性
  • PhotoShop
  • 企业UI图布局
  • 精灵图
  • 浮动
  • 定位
  • CSS2
  • HTML5
  • 语义化标签
  • 自定义播放器
  • 响应式布局
  • 双飞翼布局
  • 圣杯布局
  • 伪等高布局
  • Canvas
  • Video
  • Audio
  • LocalStroage
  • SessionStorage
  • Websocket
  • 拖拽
  • Animation
  • Transition
  • 2D变化
  • 3D变化
  • 幽灵按钮
  • 文字特效
  • 阴影特效
  • 翘边阴影
  • Sass
  • Less
  • Stylus
  • SVG
  • 盒模型
  • 蓝湖
  • 设计稿
  • AI
  • JavaScript
  • Obejct
  • Array
  • Function
  • Ajax
  • Regex
  • ECMAscript2015
  • ECMAscript2016
  • prototype
  • __proto__
  • Bom
  • Dom
  • 函数化封装
  • JSONP
  • CORS
  • 闭包
  • 原型
  • 作用域
  • 性能优化
  • 单例模式
  • 工厂模式
  • 建造者模式
  • 原型模式
  • 代理模式
  • 事件队列
  • 流程语句
  • 条件语句
  • 队列
  • 编程模拟进出栈
  • 同步与异步
  • 回调函数
  • Promise
  • Generator
  • async与await
  • 宏队列与微队列
  • 宏任务和微任务
  • 高阶函数
  • 纯函数
  • 函数柯里化
  • 代码组合
  • 链表
  • 常用排序算法1: 冒泡
  • 常用排序算法1: 选择
  • 常用排序算法1: 插入
  • 函数防抖
  • 函数节流
  • 深拷贝
  • 浅拷贝
  • jQuery
  • jQuery插件
  • 事件模型
  • 事件委托
  • ArtTemplate
  • Echarts
  • 数据可视化
  • BootStrap
  • BootStrap源码分析
  • Angular
  • Angular模板解析
  • Angular双向数据绑定
  • Zepto
  • viewport
  • Rem
  • 多指事件
  • 事件点透
  • 物理像素
  • 橡皮筋效果
  • 封装移动端插件
  • 布局视口
  • 视觉视口
  • 理想视口
  • meta标签
  • 无缝滑屏
  • Node.js
  • Express.js
  • npm
  • cnpm
  • yarn
  • cookie
  • session
  • MongoDB
  • 跨域问题
  • Nginx
  • JSONP
  • 数据库增删改查
  • GET,POST请求
  • HTTP协议
  • SHA1、MD5加密隐私数据
  • 前端安全,数据加密
  • 中间件
  • Koa.js
  • Express.js
  • Koa-router
  • 校验服务器有效性
  • 接口管理
  • 用户管理
  • 群发消息
  • 获取全局接口调用凭据(ticket)
  • signature值的计算
  • 语音查电影功能
  • 爬虫
  • 微信公众号开发
  • 浏览器渲染原理
  • 浏览器内核
  • requestAnimationFrame
  • DNS、CDN
  • sessionStorage、localStorage
  • 跨页签通信的实现
  • 网页性能优化
  • Git
  • Svn
  • Github
  • requestAnimationFrame
  • DNS、CDN
  • css图层
  • 图层的合理应用
  • css、js阻塞
  • 重绘重排
  • webpack
  • Grunt
  • Gulp
  • Gulp热加载
  • linux常见命令
  • React
  • Vue
  • Vue-cli
  • MVVM
  • Mint-UI
  • Redux
  • Vuex
  • Weex
  • Mock
  • Json-server
  • Vue源码分析
  • Element UI
  • Axios
  • Fetch
  • flyio
  • iView
  • Vue指令
  • 组件化
  • 模块化
  • 单项数据流
  • 双向数据流
  • MVC
  • MVVM
  • 消息订阅发布
  • React-router
  • Vue-router
  • Eslint
  • slot
  • keep-alive
  • setter/getter
  • props
  • state
  • refs
  • Vue2
  • Vue3
  • TypeScript
  • 原生小程序
  • 生命周期
  • mpvue
  • 小程序组件
  • 小程序配置
  • 小程序音乐播放
  • mpvue生命周期
  • cocos creator
  • 小游戏
  • 微前端
  • Flutter

科学设置八大阶段由浅入深循序渐进,为解决实际问题而学习

阶段一:HTML + CSS核心基础 收起
掌握的技能
  • 1. HTML和HTML5基础语法
  • 2. CSS和CSS3的基础语法
  • 3. 掌握100+个企业级布局设计案例
  • 4. 使用蓝湖工具,根据设计稿,实现完整静态页面
课程设计特色

本阶段的课程设计注重HTML和CSS核心基础,覆盖HTML5、CSS3等新特性及经典布局案例。同时,提供蓝湖工具的实践使用,以尚品汇静态页面为目标,让学生掌握企业级布局设计技能。

通过简洁清晰的教学,学生将掌握HTML与HTML5的基本语法、CSS与CSS3的基本语法、并能独立完成多种企业级布局设计任务,初步构建自身的前端开发技术体系。

关键技术清单
  • HTML、CSS核心基础
  • HTML5新特性
  • CSS3新特性
  • CSS过渡与动画
  • 弹性盒模型
  • 经典布局案例(双飞翼,
    品字、响应式布局)
  • 蓝湖工具使用
  • 项目-尚品汇静态页面
阶段二:JavaScript 点击展开
掌握的技能
  • 1. ES5基础语法,BOM与DOM的语法使用和案例实现
  • 2. 封装工具函数库(节流、防抖、深浅拷贝、数组常用方法实现等)
  • 3. JavaScript作用域、闭包、原型、继承、内存分析、内存管理、垃圾回收等深入分析
  • 4. 借助蓝湖工具,根据设计稿,构建页面,到使用JS全部呈现项目完美流程
  • 5. Less和Sass的基本语法,BootStrap页面的构建及源码分析
课程设计特色

本阶段课程主要涉及JavaScript基础、BOM和DOM、操作DOM、CSS预编译器、工具函数库、JavaScript高级等内容。学生将掌握ES5基础语法、封装工具函数库、JavaScript作用域、闭包、原型、继承、内存分析等知识,学习使用蓝湖工具构建页面,掌握Less和Sass基本语法,以及BootStrap页面构建和源码分析。

本阶段课程全面覆盖市场主流JavaScript应用方案,并完整讲解了从设计稿到静态页面再到动态实现的全流程。通过本阶段的学习,提升学员的编程逻辑思维能力、锻炼JavaScript原生代码书写能力。

关键技术清单
  • JavaScript基础
  • Web API(BOM & DOM)
  • JavaScript操作DOM
  • CSS预编译器(Less & Sass)
  • 前端常用工具库
  • 手写工具函数库
  • JavaScript面向对象(JavaScript高级)
  • 项目-PC项目
    (HTML+CSS+JavaScript)实现
阶段三:ES6 + Node.js + 工程化 点击展开
掌握的技能
  • 1. 掌握分布式版本控制工具Git的综合使用
  • 2. 了解Node.js基础,HTTP服务搭建,接口编写
  • 3. 掌握Promise处理异步操作,使用async/await简化异步操作
  • 4. 掌握前后台交互技术Ajax,并封装Ajax库
  • 5. 掌握基于Webpack的工程化开发,全栈项目开发后台管理系统
课程设计特色

本阶段课程主要涵盖ES6、Node.js和工程化,包括常用命令、Git协同开发、框架、数据库、HTTP协议、模块化、构建工具和工程化项目等方面。通过学习这些内容,可以全面掌握现代Web开发

所需的技能,提高团队协作效率和项目管理能力。课程设计注重实践,让学员在理论知识的基础上独立完成项目,并加深对实际应用的理解。

关键技术清单
  • ES5+ & ES6
  • NPM与YARN常用命令
  • Git常用命令与协同开发
  • Node.js & Express框架
    & MongoDB
  • HTTP协议 & Cookie & Session
  • Ajax(原生、工具库、自定义封装)
  • ESM与ComonJS模块化
  • 构建工具Gulp、Webpack5.0
  • 工程化项目
阶段四:React技术栈 点击展开
掌握的技能
  • 1. 掌握React基础语法和最新的Hooks语法使用
  • 2. 掌握React核心插件的使用(React Router、Redux、Antd)
  • 3. 分析React和Redux源码,深入了解框架的实现原理
  • 4. 掌握TypeScript的核心语法使用,并与React相关库配合开发
  • 5. 掌握React+TS的企业级项目开发
课程设计特色

本阶段课程主要涵盖了React技术栈的核心内容,包括React基础语法、React Hooks、ReactRouter、Redux、React Antd等,并深入剖析了React与Redux的原理。此外,课程还特别关注了TypeScript的应用,并设计了一个大型React医疗项目及中台

Admin页面的实战案例,帮助学员全面掌握React在实战中的应用。课程设计注重理论结合实践,设计精良、内容丰富,帮助学员深度学习React技术栈。

关键技术清单
  • React基础语法
  • React Hooks
  • ReactRouter
  • Redux
  • React Antd
  • React与Redux原理分析
  • TypeScript
  • 尚医通-大型React医疗项目-
    中台Admin
阶段五:Vue技术栈 点击展开
掌握的技能
  • 1. 掌握Vue2的基础语法和核心扩展库(Router、Vuex、ElementUI)
  • 2. 掌握Vue3的最新语法和核心插件(Router、Pinia、ElementPlus)
  • 3. 理解Vue2与Vue3的响应式和虚拟DOM的原理及其区别
  • 4. 掌握Vue2+JS 与 Vue3+TS的企业级项目开发
课程设计特色

本阶段课程以Vue技术栈为主线,全面深入地探讨了Vue的基础知识、路由、状态管理,以及常用UI库的使用。同时,还涉及到Vue源码中的重要概念,如数据响应式和虚拟DOM。此外,本阶段还特别介绍了Vue3和TypeScript的综合应用,并附加实战项目—

—大型电商项目尚品汇的前台PC页面和中台Admin页面的开发过程。本阶段课程的特色在于结合实践案例讲解Vue的核心理念和实现原理,能够帮助学员深入掌握Vue的使用和运用。

关键技术清单
  • Vue基础
  • VueRouter
  • Vuex
  • ElementUI & VantUI
  • Vue源码(数据响应式、虚拟DOM)
  • Vue3+TS
  • 尚品汇-大型Vue电商项目-
    前台PC
  • 尚品汇-大型Vue电商项目-
    中台Admin
阶段六:小程序技术栈 点击展开
掌握的技能
  • 1. 掌握原生小程序核心语法,开发原生小程序应用
  • 2. 能快速开发基于UniApp的小程序应用
  • 3. 掌握项目开发的完整流程与应用技巧
课程设计特色

第六阶段课程聚焦小程序技术栈,内容涵盖原生小程序核心API、UniApp框架的核心API、uView UI组件库以及实际项目案例慕尚花坊和谷粒微课。课程设计注重实践操作,通过分步骤的演示和

练习,帮助学员深刻理解小程序开发的基本流程和技巧。同时,考虑到小程序在不同平台的应用场景,课程中既有针对原生小程序的讲解,也有对于多端统一开发的UniApp框架的介绍。

关键技术清单
  • 原生小程序核心API
  • 小程序框UniApp的核心API
  • 小程序UI组件库uView
  • 慕尚花坊(原生小程序)
  • 谷粒微课(UniApp小程序)
阶段七:AI融合项目 点击展开
掌握的技能
  • 1. 掌握AI的环境搭建与基本使用
  • 2. 利用AI简化并完善页面开发
  • 3. 利用AI来优化JS逻辑与工具函数封装
  • 4.利用AI解决项目中的bug与性能优化
  • 5.利用AI辅助解决项目中的bug与webpack优化
  • 6.利用Node.js开发调用AI的接口
  • 7.利用AI对React性能优化
  • 8.利用AI辅助开发React中台管理项目
  • 9.利用AI辅助Vue项目页面的快速开发
  • 10.利用AI辅助快速完成项目界面和交互实现
  • 11. 掌握基于Node.js与AI接口进行交互,并实现后台路由交互
  • 12. 掌握基于Vue3及相关技术实现话题列表、历史话题和实时
          问答等功能
  • 13. 掌握基于小程序相关技术的AI答题和AI实时面试等功能
课程设计特色

本阶段课程主要关注AI与不同领域的融合,包括AI项目构建、性能优化、压力测试等方面。同时,课程还介绍了硅谷AI聊天机器人和面试助手小程序的开发流程。通过学习本阶段课程,学员可以深入

了解AI在实际应用中的运用,掌握基本的AI构建技能和优化方法,并且了解如何使用AI技术来增强不同类型的应用程序。

关键技术清单
  • AI介绍以及基本使用
  • AI构建项目以及拆分项目逻辑
  • AI针对项目性能优化
  • AI进行压力测试
  • 硅谷AI聊天机器人
    (AI+Node.js+Vue3)
阶段八:实战 + 精讲+就业指导 点击展开
掌握的技能
  • 1. 掌握基于Vue和React技术栈的项目开发
  • 2. 掌握基于原生小程序和UniApp小程序的项目开发
  • 3. 掌握多人协同开发和解决bug的综合技巧
  • 4. 建立前端技术体系,搞定高频的面试题
  • 5. 利用AI辅助项目开发,提升开发效率和项目性能
  • 6. 利用AI辅助优化简历和模拟面试
课程设计特色

实战项目坚决按照开发的实际流程来实现,书写完整的接口文档,依循企业的编码要求。不仅仅讲解高频面试题,还为学生建立完

整的前端技术体系。

关键技术清单
  • Vue前台项目实战
  • Vue后台管理项目实战
  • React前台/后台项目实战
  • 小程序项目实战
  • 前端技术体系化复习总结
  • 高频&大厂面试题分析
  • 简历指导、职业规划、简历书写
  • 模拟面试
高级必备(选学) 收起
  • Git高级
  • Webpack高级
  • Taro框架
  • 数据结构算法
  • 设计模式 & 函数式编程
  • 自定义工具库
  • 自定义PubSub,EventBus
  • 自定义Promise高级
  • ReactNative
  • 微前端

新技术带来前端职业发展新机遇

Web
工程师
Node
后台开发
工程师
高级
架构师
移动端
开发工程师
小程序
工程师
前端开发
工程师
vue
工程师
资深
架构师
react
工程师
全栈
开发工程师
大屏可视化
开发工程师
PC端
开发工程师
CTO

豪华讲师团全程面授

多年企业实际工作经验+丰富前端授课经验

  • 张老师

    偶像级讲师,B站
    Vue+React视频天花板

  • 李老师

    多年开发经验
    项目经验丰富

  • 张老师

    全技术栈大咖讲师

  • 刘老师

    前后端兼备
    千余堂课堂授课经验

  • 李老师

    技术大牛,前端
    高起点求职定海神针

  • 熊老师

    多年全栈开发
    工作历练

  • 张老师

    游戏平台大规模高并发
    核心业务开发经验

  • 更多师资

全程护航,你们只管乘风破浪

从入学到就业后,尚硅谷始终在你身边,助力学员整个职业生涯持续提升
一站式服务模式,用更高的效率,更科学化的方法,提供长期就业辅导、推荐和技术支持

  • web前端培训

    不同于目前培训机构普遍采用的测试方式,我们对基础没有硬性要求,我们不会用提高技术门槛的方法来降低自己培训压力与风险,只要你是有志青年、 有学习潜力、热爱编程,尚硅谷就愿意为你提供学习平台,助你成才。

  • 根据每个学员具体情况制定预习方案,帮你提前进入状态。

  • web前端开发培训

    技术老师、辅导老师、班主任全程贯穿
    技术学习+项目实战+学习效果测评+辅导答疑+生活帮助

  • 就业老师1v1面试指导
    职业素养课+简历指导+模拟面试+面试

  • 前端培训课程

    毕业后仍可按需学习,免费充电,持续提升

  • 扶上马,再送一程,帮助学员解决工作中的问题。

全国校区

北京校区
北京前端培训 北京web前端培训
上海校区

前端培训课程 web前端开发培训
深圳校区
web前端培训机构 前端培训班
武汉校区
web前端培训班

西安校区
前端开发培训
成都校区
前端培训课程