搜尋
首頁web前端js教程使用node.js,git和markdown構建微博

構建基於Node.js、Git和Markdown的微型博客

本文探討瞭如何使用Node.js、Git和少量依賴項構建一個微型博客。此應用旨在從提交到存儲庫的文件中提供靜態內容。您將學習如何構建和測試應用程序,並深入了解交付解決方案的過程。最終,您將擁有一個極簡的、可運行的博客應用程序,您可以在此基礎上進行構建。

Building a Microblog Using Node.js, Git and Markdown

關鍵要點:

  • Node.js 提供了一套平衡的 API,非常適合構建無需不必要復雜性的微型博客平台。
  • Git 用於將博客文章存儲為版本控制的文本文檔,無需使用傳統的數據庫。
  • Markdown 用於博客文章格式化,允許使用輕量級內容,並可以逐步增強。
  • Roast.it 用於單元測試,因為它簡單且沒有依賴項,從而可以快速獲得反饋並增強開發人員的信心。
  • 微型博客架構的設計圍繞簡潔性,具有用於提供博客內容的路由和最少的依賴項,從而確保快速性能。
  • 應用程序使用自定義 Markdown 解析器和簡單的模板函數將 Markdown 轉換為 HTML,確保博客輕量且響應迅速。

微型博客的主要組成部分

要構建一個很棒的博客,首先,您需要一些組件:

  • 用於發送 HTTP 消息的庫
  • 用於存儲博客文章的存儲庫
  • 單元測試運行器或庫
  • Markdown 解析器

為了發送 HTTP 消息,我選擇 Node.js,因為它提供了從服務器發送超文本消息所需的一切。特別感興趣的兩個模塊是 httpfshttp 模塊將創建一個 Node HTTP 服務器。 fs 模塊將讀取文件。 Node 擁有使用 HTTP 構建微型博客的庫。

為了存儲博客文章存儲庫,我將選擇 Git 而不是功能齊全的數據庫。原因是,Git 本身就是一個具有版本控制的文本文檔存儲庫。這正是我存儲博客文章數據所需的一切。擺脫添加數據庫作為依賴項,使我不必為大量問題編寫代碼。

我選擇使用 Markdown 格式存儲博客文章,並使用 marked 解析它們。如果我以後決定這樣做,這將使我能夠自由地逐步增強原始內容。 Markdown 是普通 HTML 的一種不錯的輕量級替代方案。

對於單元測試,我選擇優秀的測試運行器 roast.it。我選擇這個替代方案是因為它沒有依賴項,並且滿足了我的單元測試需求。您可以選擇其他測試運行器,如 taper,但它大約有八個依賴項。我喜歡 roast.it 的原因是它沒有依賴項。

有了這個組件列表,我就擁有了構建微型博客所需的所有依賴項。

選擇依賴項並非易事。我認為關鍵是任何超出當前問題範圍的東西都可能成為依賴項。例如,我沒有構建測試運行器或數據存儲庫,因此將其添加到列表中。任何給定的依賴項都不能吞噬解決方案並劫持代碼。因此,只選擇輕量級組件是有意義的。

本文假設您已經熟悉 Node、npm 和 Git,以及各種測試方法。我不會逐步介紹構建微型博客的每個步驟,而是重點討論代碼的特定區域。如果您想在家中跟隨操作,代碼已上傳到 GitHub,您可以嘗試每個代碼片段。

測試

測試使您對代碼充滿信心並加強反饋循環。編程中的反饋循環是指編寫任何新代碼和運行它之間所需的時間。在任何 Web 解決方案中,這意味著要跳過許多層才能獲得任何反饋。例如,瀏覽器、Web 服務器甚至數據庫。隨著複雜性的增加,這可能意味著需要幾分鐘甚至一小時才能獲得反饋。使用單元測試,我們可以減少這些層並獲得快速反饋。這使重點放在當前問題上。

我喜歡從編寫快速的單元測試開始任何解決方案。這讓我開始為任何新代碼編寫測試。這就是您如何使用 roast.it 開始運行的方式。

package.json 文件中添加:

"scripts": {
  "test": "node test/test.js"
},
"devDependencies": {
  "roast.it": "1.0.4"
}

test.js 文件是您引入所有單元測試並運行它們的地方。例如,您可以執行以下操作:

var roast = require('roast.it');

roast.it('Is array empty', function isArrayEmpty() {
  var mock = [];

  return mock.length === 0;
});

roast.run();
roast.exit();

要運行測試,請執行 npm install && npm test。讓我高興的是,我不再需要費盡心思來測試新代碼了。這就是測試的意義所在:快樂的程序員獲得信心並專注於解決方案。

骨架

微型博客將使用 Node 來響應客戶端請求。一種有效的方法是通過 http.CreateServer() Node API。這可以在 app.js 中的以下摘錄中看到:

/* app.js */
var http = require('http');
var port = process.env.port || 1337;

var app = http.createServer(function requestListener(req, res) {
  res.writeHead(200, { 'Content-Type': 'text/plain; charset=utf-8'});
  res.end('A simple micro blog website with no frills nor nonsense.');
});

app.listen(port);

console.log('Listening on http://localhost:' + port);

通過 package.json 中的 npm 腳本運行此腳本:

"scripts": {
  "start": "node app.js"
}

現在,http://localhost:1337/ 成為默認路由,並向客戶端返回消息。其想法是添加更多路由以返回其他響應,例如使用博客文章內容進行響應。

文件夾結構

為了構建應用程序的結構,我決定使用以下主要部分:

使用node.js,git和markdown構建微博

我將使用這些文件夾來組織代碼。以下是每個文件夾用途的概述:

  • blog:存儲純 Markdown 格式的原始博客文章
  • message:可重用的模塊,用於構建對客戶端的響應消息
  • route:除默認路由之外的路由
  • test:編寫單元測試的地方
  • view:放置 HTML 模板的地方

更多路由和測試

對於第一個用例,我將介紹博客文章的另一條路由。我選擇將其放在名為 BlogRoute 的可測試組件中。我喜歡的是您可以將依賴項注入其中。單元及其依賴項之間的這種關注點分離使得單元測試成為可能。每個依賴項在隔離的測試中都會獲得一個模擬。這允許您編寫不可變、可重複且快速的測試。

例如,構造函數如下所示:

"scripts": {
  "test": "node test/test.js"
},
"devDependencies": {
  "roast.it": "1.0.4"
}

有效的單元測試是:

var roast = require('roast.it');

roast.it('Is array empty', function isArrayEmpty() {
  var mock = [];

  return mock.length === 0;
});

roast.run();
roast.exit();

目前,BlogRoute 期望一個 req 對象,它來自 Node API。為了使測試通過,只需執行以下操作:

/* app.js */
var http = require('http');
var port = process.env.port || 1337;

var app = http.createServer(function requestListener(req, res) {
  res.writeHead(200, { 'Content-Type': 'text/plain; charset=utf-8'});
  res.end('A simple micro blog website with no frills nor nonsense.');
});

app.listen(port);

console.log('Listening on http://localhost:' + port);

有了這個,我們可以將其連接到請求管道。您可以在 app.js 中執行以下操作:

"scripts": {
  "start": "node app.js"
}

擁有測試的好處是我不必預先擔心實現細節。我很快就會定義 messageresreq 對象來自 http.createServer() Node API。

存儲庫

下一個要解決的問題是在 BlogRoute.route() 中讀取原始博客文章數據。 Node 提供了一個 fs 模塊,您可以使用它從文件系統讀取。

例如:

/* route/blogRoute.js */
var BlogRoute = function BlogRoute(context) {
  this.req = context.req;
};

此代碼片段位於 message/readTextFile.js 中。在解決方案的核心,您讀取存儲庫中的文本文件。請注意,fs.readFile() 是一個異步操作。這就是它採用 fn 回調並使用文件數據調用它的原因。此異步解決方案使用簡單的回調。

這提供了文件 IO 的需求。我喜歡它的地方在於它只解決一個問題。由於這是一個跨領域的問題,例如讀取文件,因此無需進行單元測試。單元測試應該只測試您自己代碼的隔離性,而不是其他人的代碼。

理論上,您可以模擬內存中的文件系統並以此方式編寫單元測試,但是解決方案隨後將開始在各個地方洩漏關注點並變成混亂。

讀取文件等跨領域問題超出了代碼的範圍。例如,讀取文件取決於您無法直接控制的子系統。這使得測試變得脆弱,並增加了反饋循環的時間和復雜性。這是一個必須與您的解決方案分離的問題。

Markdown 解析器

下一個問題是將存儲庫中的原始 Markdown 數據轉換為 HTML。此過程分為兩個步驟:

  • view 文件夾獲取 HTML 模板
  • 將 Markdown 解析為 HTML 並填充模板

在健全的編程中,其想法是將一個大問題分解成小的、易於處理的部分。讓我們解決第一個問題:如何根據我在 BlogRoute 中的內容獲取 HTML 模板?

一種方法可能是:

/* test/blogRouteTest.js */
roast.it('Is valid blog route', function isValidBlogRoute() {
  var req = {
    method: 'GET',
    url: 'http://localhost/blog/a-simple-test'
  };

  var route = new BlogRoute({ req: req });

  return route.isValidRoute();
});

請記住,這將替換上一節中使用的虛擬回調,稱為 dummyTest

要替換回調 dummyTest,請執行以下操作:

"scripts": {
  "test": "node test/test.js"
},
"devDependencies": {
  "roast.it": "1.0.4"
}

(後續內容因篇幅限製而省略,請根據需要自行補充)

以上是使用node.js,git和markdown構建微博的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
JavaScript的核心:它是在C還是C上構建的?JavaScript的核心:它是在C還是C上構建的?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc; sanInterpretedlanguagethatrunsonenginesoftenwritteninc.1)JavascriptwasdesignedAsignedAsalightWeight,drackendedlanguageforwebbrowsers.2)Enginesevolvedfromsimpleterterpretpretpretpretpreterterpretpretpretpretpretpretpretpretpretcompilerers,典型地,替代品。

JavaScript應用程序:從前端到後端JavaScript應用程序:從前端到後端May 04, 2025 am 12:12 AM

JavaScript可用於前端和後端開發。前端通過DOM操作增強用戶體驗,後端通過Node.js處理服務器任務。 1.前端示例:改變網頁文本內容。 2.後端示例:創建Node.js服務器。

Python vs. JavaScript:您應該學到哪種語言?Python vs. JavaScript:您應該學到哪種語言?May 03, 2025 am 12:10 AM

選擇Python還是JavaScript應基於職業發展、學習曲線和生態系統:1)職業發展:Python適合數據科學和後端開發,JavaScript適合前端和全棧開發。 2)學習曲線:Python語法簡潔,適合初學者;JavaScript語法靈活。 3)生態系統:Python有豐富的科學計算庫,JavaScript有強大的前端框架。

JavaScript框架:為現代網絡開發提供動力JavaScript框架:為現代網絡開發提供動力May 02, 2025 am 12:04 AM

JavaScript框架的強大之處在於簡化開發、提升用戶體驗和應用性能。選擇框架時應考慮:1.項目規模和復雜度,2.團隊經驗,3.生態系統和社區支持。

JavaScript,C和瀏覽器之間的關係JavaScript,C和瀏覽器之間的關係May 01, 2025 am 12:06 AM

引言我知道你可能會覺得奇怪,JavaScript、C 和瀏覽器之間到底有什麼關係?它們之間看似毫無關聯,但實際上,它們在現代網絡開發中扮演著非常重要的角色。今天我們就來深入探討一下這三者之間的緊密聯繫。通過這篇文章,你將了解到JavaScript如何在瀏覽器中運行,C 在瀏覽器引擎中的作用,以及它們如何共同推動網頁的渲染和交互。 JavaScript與瀏覽器的關係我們都知道,JavaScript是前端開發的核心語言,它直接在瀏覽器中運行,讓網頁變得生動有趣。你是否曾經想過,為什麼JavaScr

node.js流帶打字稿node.js流帶打字稿Apr 30, 2025 am 08:22 AM

Node.js擅長於高效I/O,這在很大程度上要歸功於流。 流媒體匯總處理數據,避免內存過載 - 大型文件,網絡任務和實時應用程序的理想。將流與打字稿的類型安全結合起來創建POWE

Python vs. JavaScript:性能和效率注意事項Python vs. JavaScript:性能和效率注意事項Apr 30, 2025 am 12:08 AM

Python和JavaScript在性能和效率方面的差異主要體現在:1)Python作為解釋型語言,運行速度較慢,但開發效率高,適合快速原型開發;2)JavaScript在瀏覽器中受限於單線程,但在Node.js中可利用多線程和異步I/O提升性能,兩者在實際項目中各有優勢。

JavaScript的起源:探索其實施語言JavaScript的起源:探索其實施語言Apr 29, 2025 am 12:51 AM

JavaScript起源於1995年,由布蘭登·艾克創造,實現語言為C語言。 1.C語言為JavaScript提供了高性能和系統級編程能力。 2.JavaScript的內存管理和性能優化依賴於C語言。 3.C語言的跨平台特性幫助JavaScript在不同操作系統上高效運行。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

VSCode Windows 64位元 下載

VSCode Windows 64位元 下載

微軟推出的免費、功能強大的一款IDE編輯器

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )專業的PHP整合開發工具

MantisBT

MantisBT

Mantis是一個易於部署的基於Web的缺陷追蹤工具,用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

WebStorm Mac版

WebStorm Mac版

好用的JavaScript開發工具