Nuxt.js 简介、客户端与SSR 服务端渲染区别

介绍Nuxt需求和SEO搜索引擎优化

服务端渲染SSO和客户端渲染是什么

搭建 Nuxt.js 开发环境和创建服务端渲染项目

搭建开发环境和NPM安装Nuxt脚手架

NPX安装Nuxt.js脚手架创建项目

详解服务端渲染项目目录结构和配置

配置项目端口号主机名和根目录别名

自定义项目布局与错误页

创建默认页面布局和配置

自定义组件布局和详解Conext上下文

引用布局注意事项和定义错误页

设置视图组件的Head页面头部标签信息

Nuxt.js 中定义 Plugin 插件实战 

插件注入到Vue实例中

插件注入到Context实例中

插件同时注入到Context和Vue

使用@nuxtjs/axios和服务端请求asyncData

安装Axios异步加载数据asyncData

Nuxt.js代理转发解决跨域问题

扩展axios异步请求响应、错误拦截器

Nuxt.js 插件方式封装 API 调用服务接口

插件解耦在Nuxt中封装API调用接口

根据页面组件自动生成路由表 Vue-Router

基础路由和nuxt-link路由跳转

动态路由_下划线为前缀的文件

动态路由_下划线为前缀的目录

嵌套路由实战操作

中间件 middleware 权限控制和详解生命周期流程

什么是中间件和权限拦截中间件实操

详解Nuxt.js生命周期流程图

梦学谷博客门户网站演示与环境搭建

梦学谷博客社区门户网站介绍演示

介绍项目使用的技术栈和创建项目

修改页面中的Header配置

Nuxt项目整合Element组件库

自定义ElementUI项目主题

引入全局样式和安装配置跨域代理转发

梦学谷项目布局设计

实现项目整体布局结构

采用Element编写响应头部布局

Element响应式自适应布局组件

头部区域Logo和菜单和登录注册头像效果

基于Element组件快速回到顶部

前后端分离SSO单点登录注册&amp;退出&amp;刷新令牌项目1

前后端分离单点登录功能介绍

单点登录背景介绍

图解同域下Cookie来实现单点登录

VueCLI脚手架创建单点登录项目

搭建SSO客户端项目环境

创建项目布局-头部底部布局组件

VueRouter路由配置登录组件

详解登录和注册组件

封装Axios与Mock创建登录服务接口

创建Vuex状态管理Store实例

前后端分离SSO单点登录注册&amp;退出&amp;刷新令牌项目2

用户状态管理Cookie保存认证信息

登录表单校验与重定向回引发跳转地址

创建校验用户和注册和用户协调接口

校验注册表单数据是否合法

提交注册用户数据

图文分析单点退出系统流程

创建退出接口与定义API函数

定义退出行为和拦截器实现统一退出系统

流程图分析刷新令牌获取新令牌

创建刷新令牌组件与配置刷新路由

前后端分离SSO单点登录注册&amp;退出&amp;刷新令牌项目3

创建刷新认证接口和定义API接口方法

完成刷新令牌获取新认证令牌重定向回应用

博客认证用户信息Vuex状态管理&amp;注册功能

跳转认证客户端和重置Vuex用户状态

根据不同运行环境动态获取不同变量值

Nuxt服务端获取Cookie赋值状态

控制显示隐藏登录注册按钮和头像

请求头带上访问令牌

梦学谷社区门户网跳转到统一注册页

博客社区门户网退出系统和刷新令牌获取新令牌

梦学谷博客社区门户网退出系统

令牌过期响应401刷新令牌获取新认证信息

博客首页技术频道、文章列表、广告区视图组件实现

实现首页左侧技术频道视图效果

实现首页中间和右侧广告区域视图

实现首页博客列表视图效果

博客首页数据接口创建与渲染数据

Mock创建导航和文章列表和广告接口

封装首页调用数据接口API插件

技术频道和广告数据查询和渲染

文章列表数据渲染

滚动式分页查询文章列表

博客文章详情页&amp;评论回复区&amp;文章内容目录导航

介绍与实现博客文章详情整体布局

创建与封装添加文章详情和更新浏览数接口

文章详情调用API和高亮显示文章

发布日期格式化刚刚、1分钟前

实现博客点赞功能

介绍带表情包评论组件

渲染博客评论组件视图

查询评论列表数据接口与渲染评论数据

修改数据接口显示删除评论按钮

提交、回复和删除评论信息

采用Markdown文本编辑器发布和修改博客文章1

实现新增文章所属标签选择组件

实现新增文章表单模板页面

创建分类与标签数据接口与查询渲染

实现上传文章主图组件

创建与封装上传主图服务接口

发布博客组件调用上传图片服务接口

安装Markdown和富文本编辑器

mavon-editor渲染Md编辑器

在Markdown编辑器上传和删除图片

校验提交新增文章表单数据

采用Markdown文本编辑器发布和修改博客文章2

提交新增文章数据

完成编辑文章路由跳转

创建修改接口和提交修改数据

问答模块热门、最新、等待回答列表实现

问答模块功能演示与介绍

问答列表使用el-tabs组件展示

引入el-table表格组件渲染问答列表

分页查询问答列表和渲染等待、最新问答

问答详情展示&amp;点赞&amp;Markdown 编辑器实现回答问题

创建与封装问答详情数据接口

查询与渲染问题详情和回答列表数据

实现问答点赞、回复和删除问答信息

Markdown实现提交问题问答信息 

实现发布和修改问题功能

标签模块根据不同标签渲染博客文章与问答列表

详解技术频道分类和标签模块需求

动态查询渲染分类和标签数据

实现标签动态问答和文章列表视图效果

根据标签查询技术问题列表渲染

根据标签查询博客文章列表渲染

根据路由地址动态高亮显示菜单栏

动态高亮显示头部导航菜单

我的主页模块上传头像、个人博客&amp;问答列表、修改资料

我的主页功能介绍与实现页面组件渲染

添加我的主页数据接口和封装API方法

服务端渲染用户信息和公开文章列表

分页查询我的公开和私密文章列表

分页查询我的提问列表

实现修改个人资料功能

校验原密码和修改用户密码

el-upload 上传用户头像

middleware 权限中间件拦截路由请求

Nuxt.js中间件权限拦截器

阿里云服务器搭建Nginx+Node部署博客社区项目

教你选购阿里云ECS服务器和域名

阿里云ECS服务器安装Nginx服务器

打包认证客户端和配置Nginx部署项目

打包博客社区门户网项目并上传服务器

阿里云ECS安装与配置node.js

生产环境启动博客社区项目

Nginx代理转发域名访问博客社区项目

吴祥

nuxt.js教程vue.js/element/axios博客社区项目实战SSO单点登录

适合人群：
有一定前端基础的编程新手，获得技术优势并提高面试竞争力。
技术储备要求：
Html/Css基础，JS交互知识 ，基本的Vue知识。

nuxt.js教程vue.js/element/axios博客社区项目实战SSO单点登录

讲师介绍

课程详情