nodeでjs建ブログ(二)-最初のmarkdownページを構築
9539 ワード
上の文章『NodeBlog(一)-node.jsインストールおよびExpressフレームワークの概要』では準備ができています.次に、最初のブログを迅速に構築する必要があります.もちろん、このブログはmarkdownに基づいて文法に基づいています.
Markdown構文のCheatsSheet添付ファイルはダウンロードされています.
http://dl.iteye.com/topics/download/2cca1dea-14a2-35d5-bb05-78e03a87b437
1.プロジェクトにmarkdown-js依存を追加し、markdown解析能力を追加する:
expressはmarkdown構文を直接サポートするものではなく、プロジェクトにmarkdown-jsモジュールの依存を追加する必要がある.
まずexpressプロジェクト構造を振り返ってみましょう.
Expressディレクトリ構造t-1
ディレクトリ/ファイル
説明
./
ルートディレクトリ、私たちのnode.jsコードはすべてこのディレクトリになります
package.json
npm依存プロファイルはrubyのGemfile,java Mavenのpomに類似する.xmlファイルここでmarkdown-jsプロジェクト依存を追加する必要があります
app.js
プロジェクトのエントリファイル
public/ javascript/ stylesheets/ images/
静的リソースファイルを保存するjquery/prettify.jsなどの静的ライブラリの会方はこちら、もちろん自分で書いたフロントエンドコードもこちらに置いてもいいです
views/
テンプレートファイル、expressのデフォルトはjadeです.もちろん、自分の好きなhaml、JES、coffeeKup、jQueryTemplateなどのテンプレートエンジンも使用できます.
node_modules/
npmを格納ローカル依存パケットにインストールし、packageに依存パケットをインストールする.jsonファイルで宣言し、npm installコマンドを使用してインストール
ここではpackageを修正します.jsonファイル、依存関係を追加するには:
元packagejsonファイル
次のように変更します.
name:appの名前を指定します.
dependesies:で依存ライブラリを定義し、markdown-jsへの依存を追加します.
private:npmグローバルウェアハウスにプログラムをパブリッシュするかどうかを設定します.
npmを使用して依存性をインストールするには、次の手順に従います.
$ npm installl
コンソール書き込み
[email protected] ./node_modules/markdown-js
└── [email protected]
ここで./node_modulesディレクトリの下にmardown-jsディレクトリが1つ追加されます
ここで符号化を開始するには、適切なエディタを選択する必要があります.
xVim:
gVim/MacVimは、プラグインを自分で構成する必要があります.以下、個人的にお勧めします. NERDTree:http://www.vim.org/scripts/script.php?script_id=1658、フォルダナビゲーションを提供し、eclipseのプロジェクトview Snippets:http://www.vim.org/scripts/script.php?script_id=2540、VimにTextMateにおけるTab補完機能 をサポートさせる jade:https://github.com/digitaltoad/vim-jade、Vim私はまだこのプラグインをインストールしていません
TextMate:
デフォルトではmarkdown構文のサポート、jade、nodeが提供されます.jsはbundlesをインストールする必要があります jade: https://github.com/miksago/jade-tmbundle Node.js: https://github.com/drnic/javascript-node.tmbundle
2.ExpressにMarkdownをサポートさせる:
appを開きます.jsはnodeの作成を開始する.jsコード、何も書かない前のapp.jsは大体以下の通りです.
最初の行はexpressモジュールをインポートし、javaのimport[packagename]と理解できます.この構文を使用してmarkdown-jsモジュールモジュールをインポートする必要があります.
(node.jsのモジュール管理はCommonJS仕様に基づいており、詳細はCommonJS Wiki参照.)
markdownモジュールのインポート:
ここまではexpressでmarkdown形式の文字をレンダリングすることができます(このように簡単ですか?はい、これは最も簡単な場合です).例を書いてみましょう
まずurlを設計します
URLアドレス
説明
/markdown
ユーザーがブラウザからこのページにアクセスすると、JavaEyeへのハイパーリンクが出力されます.markdown文字列:
http://localhost:3000/
appです.jsは次のコードを追加します.
markdown.markHtml(); markdown形式の文字をHtmlに変換し、
(markdown文法とは何ですか?ここを見てください:
http://qingbo.net/picky/502-markdown-syntax.html )
appを実行するには:
$ node app.js
ブラウザでのアクセス
http://localhost:3000/markdown/
ここまで、expressでmarkdown文字をレンダリングすることは基本的に実装されています.もちろんこれは明らかに私たちの要求を満たすことができません.次は続けます.
3.Expressにmarkdownファイルをレンダーさせる
app.jsでは、expressにmdレンダラーを登録します:(Express 2.x、メソッド、最新版3.xは適用されません-2012-09-08)
Express 3.xにメソッドを追加:(2012-09-08)、関連コードは添付ファイルの取得
「/markdown」urlのハンドラの変更
views/ディレクトリの下にindexを作成します.mdファイル
内容は以下の通り
プログラムの実行
$ node app.js
アクセスhttp://localhost:3000/markdown
OK~ここまで最初のmarkdownページが構築されています.
しかし、今日の私のコードの速度はブログより速く、興味のある人は次のアドレスにアクセスしてこのブログを見ることができます.
http://nodeblog.cloudfoundry.com/
What next??
このブログをインテリジェントにします. *.mdファイルの統一管理 はそれを*に影射する.htmlアドレス 説明の更新:
2012-09-08
1.Express 3を更新する.xにmarkdown解析を登録する方法.この方法は
flovexが提供する.
2.新規
mdnode_for_express3.0.zip添付ファイル、プレゼンテーションExpress 3.xにmarkdown解析器を登録する
Markdown構文のCheatsSheet添付ファイルはダウンロードされています.
http://dl.iteye.com/topics/download/2cca1dea-14a2-35d5-bb05-78e03a87b437
1.プロジェクトにmarkdown-js依存を追加し、markdown解析能力を追加する:
expressはmarkdown構文を直接サポートするものではなく、プロジェクトにmarkdown-jsモジュールの依存を追加する必要がある.
まずexpressプロジェクト構造を振り返ってみましょう.
Expressディレクトリ構造t-1
ディレクトリ/ファイル
説明
./
ルートディレクトリ、私たちのnode.jsコードはすべてこのディレクトリになります
package.json
npm依存プロファイルはrubyのGemfile,java Mavenのpomに類似する.xmlファイルここでmarkdown-jsプロジェクト依存を追加する必要があります
app.js
プロジェクトのエントリファイル
public/ javascript/ stylesheets/ images/
静的リソースファイルを保存するjquery/prettify.jsなどの静的ライブラリの会方はこちら、もちろん自分で書いたフロントエンドコードもこちらに置いてもいいです
views/
テンプレートファイル、expressのデフォルトはjadeです.もちろん、自分の好きなhaml、JES、coffeeKup、jQueryTemplateなどのテンプレートエンジンも使用できます.
node_modules/
npmを格納ローカル依存パケットにインストールし、packageに依存パケットをインストールする.jsonファイルで宣言し、npm installコマンドを使用してインストール
ここではpackageを修正します.jsonファイル、依存関係を追加するには:
元packagejsonファイル
{
"name": "application-name"
, "version": "0.0.1"
, "private": true
, "dependencies": {
"express": "2.4.6"
, "jade": ">= 0.0.1"
}
}
次のように変更します.
{
"name": "nodeblog"
, "version": "0.0.1"
, "private": true
, "dependencies": {
"express": "2.4.6"
, "jade": ">= 0.0.1"
, "markdown-js": ">= 0.0.1"
}
}
name:appの名前を指定します.
dependesies:で依存ライブラリを定義し、markdown-jsへの依存を追加します.
private:npmグローバルウェアハウスにプログラムをパブリッシュするかどうかを設定します.
npmを使用して依存性をインストールするには、次の手順に従います.
$ npm installl
コンソール書き込み
[email protected] ./node_modules/markdown-js
└── [email protected]
ここで./node_modulesディレクトリの下にmardown-jsディレクトリが1つ追加されます
ここで符号化を開始するには、適切なエディタを選択する必要があります.
xVim:
gVim/MacVimは、プラグインを自分で構成する必要があります.以下、個人的にお勧めします.
TextMate:
デフォルトではmarkdown構文のサポート、jade、nodeが提供されます.jsはbundlesをインストールする必要があります
2.ExpressにMarkdownをサポートさせる:
appを開きます.jsはnodeの作成を開始する.jsコード、何も書かない前のapp.jsは大体以下の通りです.
var express = require('express');
var app = module.exports = express.createServer();
app.configure(function(){
// set some config
});
app.get('/', function(req, res){
res.render('index', {
title: 'Express'
});
});
app.listen(3000);
最初の行はexpressモジュールをインポートし、javaのimport[packagename]と理解できます.この構文を使用してmarkdown-jsモジュールモジュールをインポートする必要があります.
(node.jsのモジュール管理はCommonJS仕様に基づいており、詳細はCommonJS Wiki参照.)
markdownモジュールのインポート:
var express = require('express');
var markdown = require('markdown-js');
var app = module.exports = express.createServer();
// ... some code
app.listen(3000);
ここまではexpressでmarkdown形式の文字をレンダリングすることができます(このように簡単ですか?はい、これは最も簡単な場合です).例を書いてみましょう
まずurlを設計します
URLアドレス
説明
/markdown
ユーザーがブラウザからこのページにアクセスすると、JavaEyeへのハイパーリンクが出力されます.markdown文字列:
[Java Eye](http://www.iteye.com/ "Click")
で生成されたhtmlコード:JavaEye http://localhost:3000/
appです.jsは次のコードを追加します.
app.get('/markdown', function(req, res) {
var html = markdown.makeHtml("[Java Eye](http://www.iteye.com/ \"Click\") ");
res.send(html)
res.end();
})
markdown.markHtml(); markdown形式の文字をHtmlに変換し、
(markdown文法とは何ですか?ここを見てください:
http://qingbo.net/picky/502-markdown-syntax.html )
appを実行するには:
$ node app.js
ブラウザでのアクセス
http://localhost:3000/markdown/
ここまで、expressでmarkdown文字をレンダリングすることは基本的に実装されています.もちろんこれは明らかに私たちの要求を満たすことができません.次は続けます.
3.Expressにmarkdownファイルをレンダーさせる
app.jsでは、expressにmdレンダラーを登録します:(Express 2.x、メソッド、最新版3.xは適用されません-2012-09-08)
var express = require('express');
var markdown = require('markdown-js');
var app = module.exports = express.createServer();
// ... ... some configuration code
app.register('.md', {
compile: function(str, options){
var html = markdown.makeHtml(str);
return function(locals){
return html.replace(/\{([^}]+)\}/g, function(_, name){
return locals[name];
});
};
}
});
app.get('/markdown', function(req, res) {
var html = markdown.makeHtml("[Java Eye](http://www.iteye.com/ \"Click\") ");
res.send(html);
});
app.listen(3000);
Express 3.xにメソッドを追加:(2012-09-08)、関連コードは添付ファイルの取得
var fs = require('fs');
// ...
// Express 3.x register , flovex
app.engine('md', function(path, options, fn){
fs.readFile(path, 'utf8', function(err, str){
if (err) return fn(err);
str = markdown.parse(str).toString();
fn(null, str);
});
});
「/markdown」urlのハンドラの変更
app.get('/markdown', function(req, res) {
res.render('index.md', {layout: false});
})
views/ディレクトリの下にindexを作成します.mdファイル
内容は以下の通り
This is a demo page
===================
[Java Eye](http://www.iteye.com/ \"Click\")
プログラムの実行
$ node app.js
アクセスhttp://localhost:3000/markdown
OK~ここまで最初のmarkdownページが構築されています.
しかし、今日の私のコードの速度はブログより速く、興味のある人は次のアドレスにアクセスしてこのブログを見ることができます.
http://nodeblog.cloudfoundry.com/
What next??
このブログをインテリジェントにします.
2012-09-08
1.Express 3を更新する.xにmarkdown解析を登録する方法.この方法は
flovexが提供する.
2.新規
mdnode_for_express3.0.zip添付ファイル、プレゼンテーションExpress 3.xにmarkdown解析器を登録する