,---
title: 基于Firebase搭建酷炫的博客
date: 2016-12-15 20:41:24
tags: Firebase
Let`s do it.
效果：
步驟
Step 1
安裝Node.js與npm(Node Package Manager)锌唾。(npm會(huì)隨Node.js自動(dòng)安裝,安裝過程請(qǐng)百度)
Step 2
打開cmd(不要使用Git Bash,很多東西出不來搭综，我吃過的苦頭大家就別再吃了值桩。)，執(zhí)行 npm install -g firebase-tools 如果執(zhí)行失敗颜阐，請(qǐng)檢查node.js是否安裝正確。安裝完成后杯巨，執(zhí)行 firebase login，用以授權(quán)部署網(wǎng)站到你的firebase項(xiàng)目下的權(quán)限給當(dāng)前命令行環(huán)境蛉顽。
如果授權(quán)成功則提示:
Step 3
創(chuàng)建項(xiàng)目(項(xiàng)目名既是你的博客地址)
項(xiàng)目名格式一定是 aaa-bbb 個(gè)人建議項(xiàng)目命名時(shí)添加一個(gè)-尤筐，因?yàn)槿绻惶砑拥脑捴笊涉溄拥臅r(shí)候Firebase會(huì)自動(dòng)給你的地址加上一寫奇怪的代碼诉探，就像我之前的項(xiàng)目名是futaosmile日熬，但是給出來的鏈接是futaosmile-479f5。所以為了避免這種情況的發(fā)生肾胯，建議項(xiàng)目名中間加上-竖席。
創(chuàng)建項(xiàng)目
Step 4
在電腦上創(chuàng)建一個(gè)文件夾用于保存項(xiàng)目。建議與項(xiàng)目名同名敬肚，比較好記毕荐。
之后通過cmd進(jìn)入該文件夾，并執(zhí)行 firebase init進(jìn)行初始化艳馒。
選擇你的項(xiàng)目
Step 5
網(wǎng)站部署
這里我們就不自己寫一個(gè)博客網(wǎng)站了憎亚，我們從http://getmdl.io/templates/index.html 上下載一個(gè)模板。
下載完后把壓縮包解壓弄慰，把里面所有的文件都拷貝出來第美，放到上一步生成的public目錄下。
你可以執(zhí)行firebase serve在本地查看網(wǎng)站的狀態(tài)陆爽，如果覺得滿意了就可以通過firebase deploy部署了什往。
最后一步，執(zhí)行firebase deploy墓陈，網(wǎng)站就成功上線了恶守。
Step 6
你可以通過執(zhí)行firebase open或者打開瀏覽器輸入https://futaosmile-95.firebaseapp.com/ 就能訪問我們剛剛上傳的網(wǎng)站了第献。
至此網(wǎng)站就部署完畢啦贡必，你可以把它修改成你想要的任何樣子哦，當(dāng)然前提你需要會(huì)寫一些前端代碼庸毫。
