Mantra vs. Guide
自己紹介
- TeYmmt (Teruhisa Yamamoto)
- Javascript, nodejs歴1年半ちょい
- Meteor歴4ヶ月ぐらい
- とうとう花粉症になってしまった疑惑
Meteor Guideとは
http://guide.meteor.com/
読んで字のごとく、公式ガイド。
Meteorを使う上で必読。日本語訳にご協力を！
Mantraとは
https://kadirahq.github.io/mantra/
Kadira Inc.が提唱しているMeteor(1.3~?)の為のアプリケーションアーキテクチャ。
目的：
Building High Maintainability Apps
Building Future-Proof Apps
- クライアントサイド寄りに考えられている
- Reactベースのアーキテクチャ
- 開発(デザインもtestも)しやすくを目標
mantra-coreというAPIを使用してMantra Appを構築する
Guide と Mantra
Meteor Guide
- Meteorの基本原理とそれに基づいた設計の指南書
- Meteorで開発する上でベースとなる内容がここにある
Mantra
- Javascript界の将来を考慮に入れて考えられたクライアントサイドのアプリケーションアーキテクチャ"案"
- メンテナンス（Test）重視
- GuideとMantraは対立するものではない
- 基本的にはGuideは必読
- Mantraは良い思想、ただし、ドラフト段階であり、暖かく見守るぐらいの気持ちで接したい？(でもReact推し半端ないし・・・)
Mantraをちょっと覗いてみる
What's Inside Mantra?
- モダンなReact‐based UI component layer
- ビジネスロジックを定義する場所を用意（Actions）
- Mantraそのものに状態管理は無いが、Meteor/Tracker, Redux, Rx.js Observables, Promises 等幅広く使える
- containersによってStateとActionをUIコンポーネントに組み込んでいる
- ユニットテストやAction、Integrations(containers)に役立つ
- ディレクトリー構造、ファイル名などすべての基準となる
Client-Side Focus
Mantraは、特段クライアントサイドに注意をはらっている
クライアントとサーバーのコードは一緒にしない
- Client side is where you put in a lot of effort. It’s the biggest part of your codebase. Server‐side codebase is relatively simpler to manage and organize.
- In the future, client‐side apps will interact with the server using a schema. Client‐side apps will have no idea how the server was implemented.
- Mantra does not believe in Universal Apps. It encourages multiple apps for different platforms with code sharing. Then it’s common to have a single server to interact with a few client apps.
ES2015 Syntax and ES2015 Modules
We rely on different features of ES2015 and its module system. In order to use Mantra, you need to use Meteor 1.3, which comes with an implementation of the ES2015 module system.
React as the UI
When writing your UI components, you can include any other React component. Here are some places you can import React components:
- Other UI components you define in your app.
- UI components from NPM (like material‐ui).
- Any Containers in your app (we’ll talk about this in a moment).
You can also import any library function and use them in the UI components. You can import them directly from NPM modules, but not from any Meteor packages. These functions should be pure.
Actions
アプリ上で書いたビジネスロジック
- バリデーション
- ステートマネージメント
- リモートデータとの相互作用
アクションの第一引数には、 Application Contextを。その他の引数には呼び出したいものを。
Meteor namespace, Meteor Collections, LocalState, FlowRouter, Any other Meteor package, Redux Stores, Rest Clients, DDP Clients
Containers
Containers are the integration layer in Mantra.
Pass states into UI components.
Pass actions into UI components.
Pass items in Application Context into UI components.