資訊專欄INFORMATION COLUMN
摘要：總的來說就是開發博客系統，探索前端走向全棧之路。我會記錄下來整個過程在我的專欄，有興趣的可以關注一下，一起學習，歡迎討論。話不多說，先進行前后端項目的初始化。安裝完成后，輸入命令切換到項目文件夾后輸入命令訪問一下項目初始化完成。
學習JS也有一段時間了，準備試著寫一個博客項目，前后端分離開發，后端用node只提供數據接口，前端用vue-cli腳手架搭建，路由也由前端控制，數據異步交互用vue的一個插件vue-resourse來做，數據庫用mongodb。總的來說就是 node + vue + mongodb 開發博客系統，探索前端走向全棧之路。
我會記錄下來整個過程在我的專欄，有興趣的可以關注一下，一起學習，歡迎討論。
話不多說，先進行前后端項目的初始化。
前端項目初始化新建項目的文件夾，并切換到新建的文件夾
安裝vue腳手架vue-cli 命令行輸入 npm install vue-cli -g
安裝完成后，輸入 vue init webpack blog // vue初始化，blog是項目的名稱，可自行更改，初始化的數據可根據自己的的需要選擇默認或是自己命名，需要說明的是，vue-router選項需要選擇yes，因為要前后端分離，路由由前端控制。
安裝完成后，輸入命令 cd blog 切換到項目文件夾后,輸入命令 npm run dev 訪問一下 http://localhost:8080,項目初始化完成。（最新版本的vue-cli不用手動安裝依賴，他會自動安裝，所以沒有了 npm install )
下面解釋一下項目的目錄
build和config文件都是關于webpack的相關配置，暫且先不管它
項目中安裝的依賴都存放在node_modules目錄中
src目錄就是我們在開發過程中寫代碼的地方
assets存放一些js css 圖片等資源，可根據需要選擇要與不要
components中放的就是.vue的文件，每一個文件都是一個組件
router中index.js就是我們寫路由的地方
app.vue就是最終的單頁面呈現的組件
main.js就是整個項目的入口文件
這里我用的node的express框架，先安裝expres生成器，用來快速生成express應用骨架
命令行輸入 npm install express-generator -g
安裝成功后，命令行輸入 express blog-server // 這里blog-server是后端項目的名稱，根據自己需要改變
安裝完成后，進入后端項目 cd blog-server
然后執行 npm install 安裝項目依賴
安裝完成后，啟動項目 npm start
打開瀏覽器訪問 localhost:3000 可看到啟動成功
前端和后端都啟動成功，接下來就正式開始開發。
show time~
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/19145.html
摘要：總的來說就是開發博客系統，探索前端走向全棧之路。我會記錄下來整個過程在我的專欄，有興趣的可以關注一下，一起學習，歡迎討論。話不多說，先進行前后端項目的初始化。安裝完成后，輸入命令切換到項目文件夾后輸入命令訪問一下項目初始化完成。 學習JS也有一段時間了，準備試著寫一個博客項目，前后端分離開發，后端用node只提供數據接口，前端用vue-cli腳手架搭建，路由也由前端控制，數據異步交互用...
摘要：用寫一個用寫一個上一節我們把數據庫連接成功了，這節我準備寫關于文章的數據接口增刪改查上次說到接口都在文件夾里面寫，打開文件，首先引入文章的模型新增文章新增文章方法保存數據到數據庫如果出現錯誤，直接把錯誤進的錯誤中樞處理儲存成功后，返回給客戶 【Part1】用JS寫一個Blog （node + vue + mongoDB）【Part2】用JS寫一個Blog （node + vue + m...
摘要：用寫一個用寫一個上一節我們把數據庫連接成功了，這節我準備寫關于文章的數據接口增刪改查上次說到接口都在文件夾里面寫，打開文件，首先引入文章的模型新增文章新增文章方法保存數據到數據庫如果出現錯誤，直接把錯誤進的錯誤中樞處理儲存成功后，返回給客戶 【Part1】用JS寫一個Blog （node + vue + mongoDB）【Part2】用JS寫一個Blog （node + vue + m...
摘要：用寫一個上一節前后端項目分別初始化完成，這一小節我就從后端項目開始寫。每一個都映射到一個的集合，并定義了該集合中的文檔的形式。 【Part1】用JS寫一個Blog （node + vue + mongoDB） 上一節前后端項目分別初始化完成，這一小節我就從后端項目開始寫。實現mongoDB數據庫的連接。 整理后端目錄 下面是通過express-generate生成的項目的目錄 show...
摘要：用寫一個上一節前后端項目分別初始化完成，這一小節我就從后端項目開始寫。每一個都映射到一個的集合，并定義了該集合中的文檔的形式。 【Part1】用JS寫一個Blog （node + vue + mongoDB） 上一節前后端項目分別初始化完成，這一小節我就從后端項目開始寫。實現mongoDB數據庫的連接。 整理后端目錄 下面是通過express-generate生成的項目的目錄 show...
閱讀 3813·2021-10-12 10:11
閱讀 3637·2021-09-13 10:27
閱讀 2540·2019-08-30 15:53
閱讀 1972·2019-08-29 18:33
閱讀 2189·2019-08-29 14:03
閱讀 994·2019-08-29 13:27
閱讀 3316·2019-08-28 18:07
閱讀 763·2019-08-26 13:23
