2022_03_02_mitosearchの多言語化

作業ディレクトリに移動

cd C:\Users\Mizobata\source\repos\mitosearch_repo\Mitosearch

動作確認

npm start

→ブラウザでlocalhost:3003にアクセスし、ローカル環境でmitosearchが正常に起動することを確認する。

多言語化パッケージのインストール

npm install
npm install i18n
npm install --save express-session

多言語化用ディレクトリの作成

mkdir locales

app.jsの編集。

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

const i18n = require('i18n');
i18n.configure({
    locales: ['ja', 'en'],
    defaultLocale: 'ja',
    directory: __dirname + "/locales",
    objectNotation: true
});

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());

と修正。また、

app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

const fs = require("fs");

app.use('/', routes);
app.use('/users', users);

app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

const session = require("express-session");
app.use(session({
    secret: "secret"
}));

app.use(i18n.init);
app.use(function (req, res, next) {
    if (req.session.locale) {
        i18n.setLocale(req, req.session.locale);
    }
    next();
});

const fs = require("fs");

app.use('/', routes);
app.use('/users', users);

と修正。

今回は、about.ejsの二言語化を進める。

about.ejs内において、二言語化したい文章を囲う。

例
The fish species composition of each eDNA sample is displayed as a pie chart at the sampling point on the map.
↓
<%= __('The fish species composition of each eDNA sample is displayed as a pie chart at the sampling point on the map.') %>

ja.json, en.jsonに各言語の対応表を作成。

ja.json
'The fish species composition of each eDNA sample is displayed as a pie chart at the sampling point on the map.': '世界の魚種組成を把握するため、eDNA(環境DNA)をMiFishプライマーで増幅して得られた12SリボソームRNA遺伝子4355個の配列データを用いて、魚種組成データベース「MitoSearch」を構築しました。'

en.json
'The fish species composition of each eDNA sample is displayed as a pie chart at the sampling point on the map.': 'The fish species composition of each eDNA sample is displayed as a pie chart at the sampling point on the map.'

リスト化がすべて完了したら、visual studioからmitosearch_repoにpushする。

テスト環境および本番環境へのデプロイの際には、

npm install
npm install i18n
npm install --save express-session

を忘れずに行う。

  • 2022_03_02_mitosearchの多言語化.1646210797.txt.gz
  • 最終更新: 2022/03/02 08:46
  • by 133.11.222.89