rendr-examplesを眺めてみたメモ。
基本的な構成。npm install
& grunt server
でhttp://localhost:3030
で起動する(以下のexampleも同様)。
00
ではindex.js
に直接書かれていたdataAdapterConfig
を/config
ディレクトリ内のファイルに分離。
NODE_ENV
の値で本番/開発環境の設定ファイル切り替えを行う
middlewareの追加方法のサンプル。
/server/middleware
ディレクトリが追加。index.js内で以下の二つの関数を呼び出している。
- リクエストのlocaleを設定する
addLocaleToRequest
- ダミーのAPIからデータを取得する
fetchDataForApp
fetchDataForApp
はmodel/view/controllerから利用できるようになる
sessionを使ったサンプル。indexにThere have been 4 requests to this app in your session.
と表示され、リロードのたび更新される。
express.cookieParser
とexpress.session
を使う。configにsession.secret
を追記している。
カウンターは/server/middleware/incrementCounter.js
をindex.js
から呼び出して更新している。
/app
以下にmain
とlanding_page
ディレクトリができている。アプリをmainApp
、landingPageApp
の二つ起動している。
landingPageApp
は普通のExpressアプリ(http://localhost:3030/landing_page
)。mainApp
の方はRendrアプリ。
Rendrアプリのconfigは/app/main/index.js
にて設定。
requirejs
を使ったサンプル(標準はCommonJS
)。package.jsonに以下が追記されている。
- requirejs
- grunt-contrib-requirejs
- grunt-rendr-requirejs
00
のサンプルのroutes.js
などを見比べると違いがよくわかる。
app/views/app_view.js
が追加されている。app.jsにgetAppViewClass関数を追記してnode_modules/rendr/shared/app.js
のgetAppViewClassをオーバーライドしている。app/views/app_view.js
ではpostInitialize
の挙動を変えている(ロード中に画面の右上にloading…
の文字を表示している)