LvBlog:Laravel + Vue 全家桶+ Element UI 構建 SPA 應用

項目簡介

LvBlog 是我們應用的名稱,“L” 是 Laravel 的縮寫 , “v” 是 Vue 的縮寫,本項目基於 Laravel 5.8 + Vue 2 開發一個 API 驅動的前後端分離項目。
Laravel 作爲 API 服務器,實現前後端分離,可以同時向手機APP,網頁 APP 等不同的終端返回數據,達到支持多終端,跨平臺的目的。

SPA ( single page web application )
即單頁Web應用程序,是一種只需要將單個頁面加載到瀏覽器之中的Web應用程序,向用戶提供無縫的訪問體驗。

Vue是一個典型的 MVVM 設計模式前端框架,有了它我們就可以着重把注意力放在 M 層的開發之上,面向數據編程,而不再是是面向 DOM 進行開發。
在這裏插入圖片描述Element UI,正如官網所示,網站快速成型工具,正如“天下武功,唯快不破“!我認爲一個優秀的程序員,應該能夠運用已有的工具來開發出優秀的作品,而不是把時間花在無休止的框架的學習當中。

Element,一套爲開發者、設計師和產品經理準備的基於 Vue 2.0 的桌面端組件庫。

效果圖:

首頁截圖登錄截圖

LvBlog 應用構建系列教程:

第一章: Laravel+Vue+Element UI 項目模板

  • 項目分解
  • Laravel 初始化
  • JavaScript 初始化
  • 安裝 DingoAPI
  • 安裝 PostMan

第二章: 用戶註冊和登錄

  1. 手機號註冊
  2. 第三方登錄

第三章: 用戶數據

  1. 實現 Laravel 後端 API 接口
  2. 通過 Vue Router 配置前端路由
  3. 通過 Axios 庫構建 API 請求
  4. 構建 Vuex 模塊獲取用戶個人信息
  5. Vue 引入 Vuex 模塊,導航條頁面模板的構建
  6. 通過 Vue 組件實現單頁面應用無跳轉登錄
  7. Vue 編輯個人資料信息和模板的構建
  8. 實現 Laravel 後端更新用戶數據的 API 接口

第四章: 博客數據

  • 實現 Laravel 後端獲取用戶的分類列表的 API 接口
  • Vue 獲取用戶的分類列表信息和側邊欄模板構建
  • 實現 Laravel 後端獲取用戶的博客列表的API 接口
  • Vue 獲取用戶的博客列表信息
  • 前臺博客列表模板構建、無限滾動、懶加載餘下博客
  • 實現 Larave 後端獲取某一篇博客信息的 API 接口
  • Vue 獲取某一篇博客信息和模板的構建
  • Vue 發佈博客和模板的構建
  • 實現 Laravel 後端發佈、更新、刪除博客的 API 接口

第五章: 回覆數據

  • Vue 添加評論和模板的構建
  • 實現 Laravel 後端發佈評論的 API 接口
  • 實現 Laravel 後端獲取所有評論的 API 接口
  • Vue 獲取所有評論和模板的構建
  • Vue 刪除評論和模板的構建
  • 實現 Laravel 後端刪除評論的 API 接口

第六章: 其他功能

  • Vue 獲取某一個分類下所有文章
  • 實現 Laravel 後端某一個分類下所有文章的 API 接口
  • Vue 獲取標籤雲和側邊欄模板構建
  • 實現 Laravel 後端某一個用戶文章的所有標籤和數據統計的 API 接口
  • Vue 獲取友情鏈接和側邊欄模板構建
  • 實現 Laravel 後端文章友情鏈接的 API 接口
  • Vue 獲取文章推薦和側邊欄模板的構建
  • 實現 Laravel 後端文章推薦的 API 接口

第七章: 權限控制

  • LvBlog 角色權限
  • LvBlog 權限列表
  • LvBlog 用戶角色

第八章: API測試和文檔

  • Laravel API 集成測試
  • API 文檔

更多信息

紅色字體爲本系列教程已實現的章節,教程不斷更新中,總共分爲 8 大章節,40 餘篇教程,關注我的微信公衆號 LAMPer技術棧 獲取更多信息,QQ羣: 670494430
LAMPer 技術棧

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章