基于 Laravel + Vue 构建前后端分离应用

本系列教程将基于 Laravel 5.6 + Vue 2 开发一个 API 驱动的前后端分离应用,命名为 Roast,意为通过地图查找附近的咖啡烘焙店和专卖店,本系列课程将分为 10 大章节,40 余篇教程,通过这个系列教程的学习,你将学会 Laravel 基本开发流程,基于 Vue.js 进行前端开发,以及如何从零开始构建一个完整的、API 驱动的、包含后台管理系统的、前后端分离的单页面应用。

效果图

下面是 Roast 应用的部分截图。

首页:

详情页:

新增咖啡店:

管理后台:


以下是 Roast 应用构建系列教程:

第一部分:Laravel 初始化

第二部分:JavaScript 初始化

第三部分:Vuex、Vue Router 及 JS API 请求使用

第四部分:在地图上标记咖啡店功能实现

第五部分:Laravel 关联关系、添加喜欢及标签等功能

第六部分:使用 Vue Mixins 实现数据过滤

第七部分:通过 Vue 实现用户登录及前端路由保护

第八部分:编辑用户信息及图片上传

第九部分:Roast 应用重构篇(2.0版本)

第十部分:构建后台管理系统

增补篇

注:本项目基于 API Driven Development With Laravel and VueJS 这个项目进行汉化,源码位于 Github 上:nonfu/roastapp

如果你觉得本系列教程对你有所帮助和启发,可以选择购买「学院君订阅服务」对学院君进行支持:

一键升级为订阅用户

上一篇: 没有上一篇了

下一篇: 初始化 Laravel 单页面应用