Express + ejsで i18n
Node.js ネタ。 Heroku でシンプルなんだけどちょっと動的なサーバサイドを持つwebサイトを作りたいといったときに Node.js は便利。 こういう時 PHP とか Ruby なら Sinatra とか選択肢があると思うけど、Node.js のアクセスを捌く力を知ってからはできるだけシンプルなやつはNode.js を使うようにしてる。 Heroku に上げるのもめちゃめちゃ簡単だしな。
ということで 今回なんで動的にしたかったのかというと、国際化対応のサイトを作りたかったからだ。ユーザーのブラウザの言語に応じて同一URLで内容を書き換えるようにした。
他のブログ漁ってみると、express のバージョンが低いやつで i18n してたり、 jade っていう独自のHamlみたいなHTMLテンプレートエンジン使ってたりと自分に合うのがなくて自分でちょっと頑張った。
Express プロジェクトの作成
もう npm とか Express とか Node.js とか入れてある前提
express -e myapp cd myapp npm install
コード修正
package.json
{
"name": "application-name",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node app.js"
},
"dependencies": {
"express": "3.4.8",
"i18n": "*",
"ejs": "*"
}
}
app.js
var express = require('express');
var routes = require('./routes');
var http = require('http');
var path = require('path');
var i18n = require('i18n');
var app = express();
i18n.configure({
locales: ['en', 'ja', 'fr', 'de', 'ko'] ,
directory: __dirname + '/locales',
cookie: 'mycokie'
});
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.favicon(express.favicon(__dirname + '/public/favicon.ico')));
app.use(express.urlencoded());
app.use(express.methodOverride());
app.use(i18n.init);
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', routes.index);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
そんで locales/ja.js とかを作って、以下のようなjsonを作る。
{
"locale": "ja",
"title": "マイアプリ"
}
views/index.ejs で以下のように使える
<%= __('title') %>
この書き方が割と自分が慣れ親しんでいるので、ejs を選んだ。HTMLテンプレートエンジンといえばこの書き方だよな、って個人的に思っている。w
所感
これだけで 国際化対応のウェブサイトを作れちゃうんだから、何かWebサイトを作るなら世界を見据えていきたいところ。そっちのほうが夢があるじゃない！
てな感じで今回は 以下のページを作りました。 iPhone アプリでたら随時報告します。
このサイトは日本語、英語、韓国語、フランス語、ドイツ語に対応しています。Google 翻訳とかじゃなくて、以下のようなやり方で翻訳しました。
