資訊專欄INFORMATION COLUMN
摘要：說到底，當自己獨自開發從搭建開發環境，到前端的每一個組件，到動作交互，再到和后端的數據交互，難免遇到不少問題。單頁面博客從前端到后端基于和的權限驗證與的設計引入來實現富文本編輯器是開源的用于構建富文本編輯器的框架。
不會后端的前端，不會寫單頁面應用...
單頁面應用的概念已經被提出很長時間了，無論是基于 vue, angular 還是 react，相信大家或是耳濡目染，或是設身處地都有所體會。說到底，當自己獨自開發從搭建開發環境，到前端的每一個組件，到動作交互，再到和后端的數據交互，難免遇到不少問題。在這個過程中，值得記錄每一個需要學習、分享的知識點。
SITUATION如果還沒有自己實現過一個單頁應用，那可以參考我的一起 交流學習
如果已經輕車熟路，歡迎給我 挑毛病
初衷也就是上面所提到的，綜合自己所學的知識，打通前后端。不過結果讓人欣喜讓人憂。當初以為自己會個 react， 寫個應用就不得了。當把自己作為一個偽全棧工程師去踩一個個的坑時，恍然發現路漫漫其修遠。
TASK作為一個前端，不滿足于使用 hexo 來生成自己的博客 = =，至少該是 Gatsby 。那就可以開發一個讓自己賞心悅目的博客系統。
ACTION 搭建開發環境前端基于 react 、antd、dva等 react 生態圈等框架，構建工具首選必然是 webpack。相信使用腳手架來開發的時候，遇到了問題，還是需要扒一扒源代碼，我們不如自己來搭建開發環境，以熟悉 webpack 的每個配置。
【單頁面博客從前端到后端】環境搭建
引入 Dva + Antd 實現前端交互【單頁面博客從前端到后端】基于 DVA+ANTD 搭建博客前后臺界面
基于 koa@2 + mongodb + passport 來實現后端邏輯如果后端只是簡單的增刪改查，那有違我們的初衷。要實現基本的 Auth2.0 權限認證，還要進行基本的業務邏輯和數據層分離等。
【單頁面博客從前端到后端】基于 Passport 和 Koa@2 的權限驗證與 DVA 的 Model 設計
引入 Draftjs 來實現富文本編輯器Draft.js 是 Facebook 開源的用于構建富文本編輯器的 JavaScript 框架。你可以用它實現像 Bear 筆記那樣的 web 端編輯器，極力推薦。
RESULT一開始后端我用的是 express，如果還不熟悉 nodejs 框架的朋友可以參考這個 github倉庫，上手 express。之后我用了 koa 重構了整個項目，在用 async 函數梳理異步流時，竊喜。
在寫下這篇文章過程中，突然發現自己的這個項目已經有兩顆星星了，很高興！這幾天的疲憊全無！
項目我已經部署上線，查看 演示地址
測試賬號：{username: "test", password: "test"}
前后端同構，服務端渲染
引入 flow 來對 js 做靜態類型的檢查
加入測試代碼
完善文檔
最后歡迎來 star, pr, issues…
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/83502.html
摘要：在的的配置中添加自定義主題由腳手架和官網介紹，我們已經自己配置并新建好了主題文件。單頁面博客從前端到后端環境搭建單頁面博客從前端到后端基于搭建博客前后臺界面單頁面博客從前端到后端基于和的權限驗證與的設計 在上篇文章我們已經搭建好了基礎的開發環境，接下來會介紹如何引入 DVA 和 ANTD ，以及在引入過程中需要注意的問題。這里只會詳細的書寫部分組件，其他的組件都是大同小異。你可以在 g...
摘要：的配置其中就不多說會解決更改組件的時熱更新直接刷新頁面的問題。 工欲善其事，必先利其器。單頁面應用的開發和生產環境涉及文件的編譯、壓縮、打包、合并等，目前前端最流行的莫過于 webpack 。為了深入了解 webpack 以及其相關插件，我們決定不采用腳手架，自己來搭建基于 webpack 的開發和生產環境。 基礎環境 nodejs的安裝： 移步官網 建議使用nvm來管理nodejs...
摘要：我們就采用這種方式來進行權限驗證。這里我還是使用在中的下新增單頁面博客從前端到后端環境搭建單頁面博客從前端到后端基于搭建博客前后臺界面單頁面博客從前端到后端基于和的權限驗證與的設計 基于 JWT 的權限驗證 這里有一篇文章描述的已經非常詳盡，闡述了 JWT 驗證相比較傳統的持久化 session 驗證的優勢，以及基于 angular 和 express 驗證的簡單流程。 基于Json ...
摘要：所以單頁應用的部署，需要將所有的頁面請求都返回，瀏覽器下載了后會自動解析并導航到對應頁面。總結單頁應用與以前的常規多頁面應用還是有區別的，開發過程與后端解耦了，同時會出現跨域鑒權以及應用部署的問題。 本文同步發布于我的個人博客上 - 單頁應用的部署方案 本文主要簡單講一下單頁應用的開發及部署方法，默認你懂一些服務端知識及nginx知識，如果有任何可以在下方評論留言。 單頁應用 SPA（...
摘要：項目地址這個項目是為了學習而建的，從前端到后端一手包辦。相對來說，還是有一定難度的，適合有一定編程基礎的人進階學習。教程一教程二在安裝完后，克隆項目。 項目地址 這個項目是為了學習 node 而建的，從前端到后端一手包辦。相對來說，還是有一定難度的，適合有一定編程基礎的人進階學習。 如果有問題，歡迎提 issues 注意，本項目的前后端代碼都是放在一起的，前端代碼放在 src 目錄，后...
閱讀 3793·2021-11-12 10:34
閱讀 2812·2021-09-22 15:14
閱讀 778·2019-08-30 15:53
閱讀 3196·2019-08-30 12:53
閱讀 1280·2019-08-29 18:32
閱讀 2761·2019-08-29 16:41
閱讀 1056·2019-08-26 13:40
閱讀 1795·2019-08-23 18:07
