研究使用Github Pages搭建具有資料庫的個人網站
這段時間想使用github搭建一個個人網站，但是木有錢買伺服器（+﹏+），聽說github有一個Github Pages的功能，很好用，經過我的測試它支援html+css+js。而且網上也有很多已經開發好的框架可以直接使用，例如：Hexo。Hexo非常火，網上有很多人都在用，而且使用非常方便，經過幾個簡單步驟就可以把網站搭建起來。但是有一個問題，它的所有資料都是靜態的，它所展示的頁面都是提前渲染好的，而且無法連線資料庫。像我這種後端程式設計師，怎麼能忍受呢，完全不能忍啊有木有！突然我靈光一閃（好吧，我也就瞎想想），想到以下問題：
1、pages中，我不可能去安裝一個數據庫啊，也就不能使用mysql、mongodb等等了；
2、通過查詢資料發現，可以通過ajax的方式讀取專案中某路徑下的檔案，並且我把它放到Pages中也是可以讀取的，當時讀取的是一個json檔案。
3、那麼同上，我也就可以使用js去讀取sqllite的資料檔案了，最後經過我查詢資料發現，sql.js可以直接操作sqllite中的資料，無需進行任何安裝操作，程式碼如下：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="js/sql.js"></script>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
</head 注意：需要引入jquery和sql.js，並且需要在工程目錄下建立 ./db/test.db ，這裡的test.db是我提前準備好的sqllite資料檔案。
sql.js檔案下載：https://github.com/kripken/sql.js
jquery檔案下載：http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js
sqllite資料視覺化工具：http://www.xue51.com/soft/5371.html
如果要生成一個帶有資料sqllite檔案，可以使用以下程式碼，(執行後，點選下載)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="js/sql.js"></script>
</head>
<body>
<button name="test" type="button" value="val" onclick="save()">下載</button>
</body>
<script>
function save() {
//Create the database
var db = new SQL.Database();
db.run("CREATE TABLE test (列1 int, 列2 char);");
db.run("INSERT INTO test VALUES (0,'hello');");
db.run("INSERT INTO test VALUES (1,'world');");
db.run("INSERT INTO test VALUES (55,'34534545');");
db.run("INSERT INTO test VALUES (166,'woteggrgrld');");
//save to local file
var data = db.export();
var arraybuff = data.buffer;
var blob = new Blob([arraybuff]);
var url = window.URL.createObjectURL(blob);
var a = document.createElement("a");
a.href = url;
a.download = 'test.db';
a.click();
window.URL.revokeObjectURL(url);
}
</script>
</html>4、但是有一個問題，我查詢資料發現，只能讀不能寫啊，咋辦，但是我大膽的想了一下，github是一個程式碼倉庫，我們能否在儲存資料庫的時候去模擬git的提交操作的呢？這樣就可以去修改倉庫中的資料檔案了。但是做起來可能很麻煩，慢慢研究…
5、再後來我又看了一篇文章，裡面使用了h5內嵌的sqllite和indexdb，但是後來發現它並沒有把資料儲存到伺服器端，只是把資料儲存在客戶端的瀏覽器中，不適用。
6、我也希望能和大家一起研究，做一個能夠在github Pages功能支援下的前後端都有專案，這樣我們以後的人就可以直接用了，比如進行簡單的登陸、評論、點贊等（簡單的資料互動）
7、我並不想去造輪子，但是目前經過我查詢資料還沒有發現任何框架能做到這一步，我覺得還是蠻有意義的。後期主要解決的問題是：如何把資料儲存到github倉庫中
參考資料：
https://blog.csdn.net/sunnyloves/article/details/48002839
https://github.com/kripken/sql.js
https://developer.mozilla.org/zh-CN/docs/Learn/Common_questions/Using_Github_pages