基于Firebase搭建酷炫的部落格

,---

title: 基于Firebase搭建酷炫的部落格

date: 2016-12-15 20:41:24

tags: Firebase

Let`s do it.

效果：

1. https://futaosmile-95.firebaseapp.com/
2. https://futaosmile-479f5.firebaseapp.com/ 官方連結 官方幫助文檔

步驟

Step 1

安裝Node.js與npm(Node Package Manager)。(npm會随Node.js自動安裝,安裝過程請百度)

Step 2

打開cmd(不要使用Git Bash,很多東西出不來，我吃過的苦頭大家就别再吃了。)，執行 npm install -g firebase-tools 如果執行失敗，請檢查node.js是否安裝正确。安裝完成後，執行 firebase login，用以授權部署網站到你的firebase項目下的權限給目前指令行環境。

Firebase Login

如果授權成功則提示:

Success

Step 3

建立項目(項目名既是你的部落格位址)

項目名格式一定是 aaa-bbb 個人建議項目命名時添加一個-，因為如果不添加的話之後生成連結的時候Firebase會自動給你的位址加上一寫奇怪的代碼，就像我之前的項目名是futaosmile，但是給出來的連結是futaosmile-479f5。是以為了避免這種情況的發生，建議項目名中間加上-。

建立項目

Step 4

在電腦上建立一個檔案夾用于儲存項目。建議與項目名同名，比較好記。

之後通過cmd進入該檔案夾，并執行 firebase init進行初始化。

firebase init

選擇你的項目

項目清單

Step 5

網站部署

這裡我們就不自己寫一個部落格網站了，我們從

http://getmdl.io/templates/index.html

上下載下傳一個模闆。

下載下傳完後把壓縮包解壓，把裡面所有的檔案都拷貝出來，放到上一步生成的public目錄下。

你可以執行firebase serve在本地檢視網站的狀态，如果覺得滿意了就可以通過firebase deploy部署了。

最後一步，執行firebase deploy，網站就成功上線了。

Step 6

你可以通過執行firebase open或者打開浏覽器輸入

就能通路我們剛剛上傳的網站了。

至此網站就部署完畢啦，你可以把它修改成你想要的任何樣子哦，當然前提你需要會寫一些前端代碼。

寫的很匆忙，比較粗糙，湊活看吧。不了解的地方可以聯系我或者百度，如果有遺漏的大問題之後再補充，謝謝。