先日、MeteorというJavaScriptベースのウェブプラットフォームが発表されました。(meteorは流星)
そのコンセプトを見て、ビビッと来ましたので、ドキュメンテーションのコンセプト部分の訳をしてみました。
コンセプト
今まで私たちは単ページのJavaScriptアプリケーションのかなりの部分を手で書いてきました。アプリケーション全体を一つのデータフォーマット(JSON)を使って一つの言語(JavaScript)で書くことは本当に幸せです。そんなアプリを書く時欲しかったもの、それがMeteorです。
We've written our fair share of single-page JavaScript applications by hand. Writing an entire application in one language (JavaScript) with one data format (JSON) is a real joy. Meteor is everything we wanted when writing those apps.
アプリケーションを構造化する
Meteorアプリケーションは、クライアントウェブブラウザ内で走るJavaScriptと、Meteorサーバー上のNode.jsコンテナ内で走るJavaScriptと、それらを支えるHTML断片、CSSルール、静的アセットすべてをミックスしたものです。Meteorはこれらの異なる構成要素のパッケージ化と送信を自動化します。そして、非常に高い自由度でこれらの構成要素をファイルツリーの中で構造化することができます。
A Meteor application is a mix of JavaScript that runs inside a client web browser, JavaScript that runs on the Meteor server inside a Node.js container, and all the supporting HTML fragments, CSS rules, and static assets. Meteor automates the packaging and transmission of these different components. And, it is quite flexible about how you choose to structure those components in your file tree.
サーバの唯一のアセットはJavaScriptです。Meteorは、クライアントとパブリックのサブディレクトリ以下を除いたJavaScriptファイルすべてを集めて、それらをファイバの中のNode.jsサーバーインスタンスにロードします。Meteorでは、サーバーコードはリクエスト毎に単一スレッド内で走ります。Nodeで典型的な非同期コールバックスタイルではありません。Meteorアプリケーションでは線形実行モデルが典型的なサーバーコードにより適していることを私たちは知りました。
The only server asset is JavaScript. Meteor gathers all your JavaScript files, excluding anything under the client and public subdirectories, and loads them into a Node.js server instance inside a fiber. In Meteor, your server code runs in a single thread per request, not in the asynchronous callback style typical of Node. We find the linear execution model a better fit for the typical server code in a Meteor application.
クライアントサイド上では考えられるアセットがもっとあります。Meteorはクライアントのために、サーバーサブディレクトリとクライアント用パブリックサブディレクトリを除いたファイルツリーのJavaScriptファイルをすべてを集めます。この束を最小化して新しいクライアントそれぞれに配ります。アプリケーション全体用に１つのJavaScriptファイルを使ってもいいですし、分割ファイルの入れ子のツリーを作ってもいいですし、好きにできます。
There are more assets to consider on the client side. Meteor gathers all JavaScript files in your tree with the exception of the server and public subdirectories for the client. It minifies this bundle and serves it to each new client. You're free to use a single JavaScript file for your entire application, or create a nested tree of separate files, or anything in between.
クライアントサブディレクトリとサーバーサブディレクトリの外にあるファイルはクライアントとサーバー両方上にロードされます! そこがモデル定義や他の関数用の置き場所です。また、異なるディレクトリ内にクライアントとサーバーの関数を置く代わりに、is_clientとis_server変数を使ってJavaScriptを一方もしくは他方に分離することができます。
Files outside the client and server subdirectories are loaded on both the client and the server! That's the place for model definitions and other functions. Also, instead of putting client and server functions in different directories, you can use the is_client and is_server variables to isolate JavaScript to one or the other side.
CSSファイルもちょうど同じように扱われます: クライアントは(サーバーとパブリックのサブディレクトリを除いた)ツリー内のCSSすべてを集めた束を受け取ります。
CSS files work just the same: the client will get a bundle with all the CSS in your tree (excluding the server and public subdirectories).
開発モードではJavaScriptファイルとCSSファイルを束にせずに送ることでデバッグを容易にします。
In development mode, JavaScript and CSS files are sent individually to make debugging easier.
MeteorアプリケーションのHTMLファイルはサーバーサイドフレームワークとは相当違う方法で扱われます。Meteorは、
HTML files in a Meteor application are treated quite a bit differently from a server-side framework. Meteor scans all the HTML files in your directory for three top-level elements:
, , and . The head and body sections are seperately concatenated into a single head and body, which are transmitted to the client on initial page load.
一方で、templateセクションはJavaScript関数に変換されます。それらはTemplate名前空間の下で利用可能です。クライアントにHTMLテンプレートを送るのは本当に便利な方法です。もっと知るにはテンプレートセクションを見てください。
Template sections, on the other hand, are converted into JavaScript functions, available under the Template namespace. It's a really convenient way to ship HTML templates to the client. See the templates section for more.
最後になりますが、ちょうどRailsやDjangoプロジェクトでと同じようにMeteorサーバーはパブリックディレクトリ下のどんなファイルも応答します。これは画像やfavicon.ico, robots.txtその他用の置き場所です。
Lastly, the Meteor server will serve any files under the public directory, just like in a Rails or Django project. This is the place for images, favicon.ico, robots.txt, and anything else.
データ
Meteorは分散クライアントコードを書くことをローカルデータベースに向かって話すぐらい簡単にします。それはクリーンで簡単なアプローチであり、個々のRPCエンドポイントやサーバー通信の遅延考慮、無効メッセージの調整を構築するより遥かに容易です。
Meteor makes writing distributed client code as simple as talking to a local database. It's a clean and simple approach, much easier than building individual RPC endpoints, slow roundtrips to the server, and orchestrating invalidation messages.
すべてのMeteorクライアントはメモリ内データベースキャッシュを持ちます。それぞれのクライアントのキャッシュは、サーバーのマスタデータベースに保存されたドキュメントの一式の有効なコピーを保持します。データベース内の対応するドキュメントが変更されると、Meteorは自動的にその変更についてすべての購読クライアントを同期します。
Every Meteor client includes an in-memory database cache. Each client's cache holds valid copies of some set of documents that are stored in a server's master database. When a matching document in that database changes, Meteor automatically synchronizes that change to every subscribed client.
クライアントキャッシュを管理するために、サーバーコードはドキュメントの複数の集合を出版し、クライアントコードはそれらの集合を購読します。例えば、もしチャットシステムを作っているのなら、サーバーは、すべてのルームの集合と与えられたルームのすべてのメッセージの集合、２つの集合を出版するかもしれません。それぞれのクライアントは利用可能なルームのマスター集合と現在選択されているルームのメッセージの集合を購読するでしょう。一度購読すると、クライアントはキャッシュを高速ローカルデータベースとして使います。これはクライアントモデルコードを劇的に単純にします。
To manage the client caches, your server code publishes sets of documents, and your client code subscribes to those sets. For example, if you are building a chat system, the server might publish two sets: the set of all rooms, and the set of all messages in a given room. Each client would subscribe to the master set of available rooms and the set of messages in the currently-selected room. Once subscribed, the client uses its cache as a fast local database, dramatically simplifying your client model code.
Meteorの分散ドキュメント更新用プロトコルはデータベース不可知です。デフォルトでは、MeteorアプリケーションはおなじみのMongoDB APIを使います: サーバーはMongoDBコレクション内にドキュメントを保存し、クライアントは、クエリと更新用に同じMongo APIを実装したクライアントサイドキャッシュ内にそれらのドキュメントをキャッシュします。
Meteor's protocol for distributing document updates is database agnostic. By default, Meteor applications use the familiar MongoDB API: servers store documents in MongoDB collections, and clients cache those documents in a client-side cache that implements the same Mongo API for queries and updates.
// server: publish all room documents, and per-room messages Meteor.publish("chatrooms"); Meteor.publish("messages", function (room_id) { return Messages.find({room: room_id}); }); // client: subscribe to all rooms, and messages in the first room Meteor.subscribe("chatrooms"); Meteor.subscribe("messages", Chatrooms.find()[0]._id);
ドキュメント修正も自動的に伝搬します。挿入、削除、更新のような修正命令はクライアントのキャッシュされたデータ上にすぐに実行されます。同時にクライアントはその命令をサーバーに送り、サーバーはマスタデータベースに対して同じ変更を実行します。普通はクライアントとサーバーは一致しますが、(例えば許可チェックや他のクライアントとのオーバーラッブとか)もし違ったら、サーバーの結果がクライアントに再出版されます。もちろん同じ購読者である他のクライアントすべてが更新されたドキュメントを自動的に受信します。
Document modifications also propagate automatically. Modification instructions like insert, remove, and update are executed immediately on the client's cached data. At the same time, the client sends that instruction up to the server, which executes the same change against the master database. Usually the client and server agree, but should they differ (permissions checking or overlapping with another client, for example), the server's result will publish back down to the client. And of course, all other clients with a matching subscription automatically receive an updated document.
// create new message, executes on both client and server. Messages.insert({room: 2413, text: "hello!"});
まとめると、これらの技術はレイテンシー補償を達成します。クライアントは必要なデータの新しいコピーを保持し、サーバー往復を待つ必要がありません。クライアントがデータを修正する時、それらの修正は、サーバーにリクエストされた変更上の最終決定権を与えつつ、サーバーからの確認を待たずにローカルに実行できます。
Putting it all together, these techniques accomplish latency compensation. Clients hold a fresh copy of the data they need, and never need to wait for a roundtrip to the server. And when clients modify data, those modifications can run locally without waiting for the confirmation from the server, while still giving the server final say over the requested change.
サーバーサイドデータベースドライバと代替APIを実装したクライアントサイドキャッシュを提供することでMongoDBの代わりに別のデータベースを代用できます。
You can substitute another database for MongoDB by providing a server-side database driver and/or a client-side cache that implements an alternative API. The mongo-livedata is a good starting point for such a project.
応答性
Meteorはリアクティブプログラミングのコンセプトを受け入れています。これは、簡単な命令型スタイルでコードを書くことができて、コードが依存するデータが変化した時はいつでも結果が自動的に再計算されることを意味します。
Meteor embraces the concept of reactive programming. This means that you can write your code in a simple imperative style, and the result will be automatically recalculated whenever data changes that your code depends on.
Meteor.autosubscribe(function () { Meteor.subscribe("messages", Session.get("currentRoomId")); });
(チャットルームクライアントから取ってきた)この例はセッション変数currentRoomIdに基づいてデータ購読を設定します。もしSession.get("currentRoomId")の値が何らかの理由で変化したら、関数が自動的に再実行され、古いものの代わりとなる新しい購読を設定します。
This example (taken from a chat room client) sets up a data subscription based on the session variable currentRoomId. If the value of Session.get("currentRoomId") changes for any reason, the function will be automatically re-run, setting up a new subscription that replaces the old one.
この自動再計算は、SessionとMeteor.autosubscribeの間の協力によって達成されます。Meteor.autosubscribeのようなメソッドは「リアクティブコンテキスト」を確立します。リアクティブコンテキスト内ではデータ依存性が追跡されます。そしてそれらのメソッドは、必要に応じて関数引数を再実行するように準備ができています。他方、Sessionのようなデータ提供者は、それらがなにから呼ばれたのか、どのデータがリクエストされたのかというコンテキストの覚え書きを作り、データが変化した時無効シグナルを送る準備ができています。
This automatic recomputation is achieved by a cooperation between Session and Meteor.autosubscribe. Methods like Meteor.autosubscribe establish a "reactive context" inside of which data dependencies are tracked, and they are prepared to re-run their function argument as necessary. Data providers like Session, on the other hand, make note of the context they are called from and what data was requested, and they are prepared to send an invalidation signal when the data changes.
この簡単なパターンは広い応用性を持っています。更に、プログラマーは、解除/再購読コールを書き、それらが正しい時コールされることを保証することから解放されます。
This simple pattern has wide applicability. Above, the programmer is saved from writing unsubscribe/resubscribe calls and making sure they are called at the right time. In general, Meteor can eliminate whole classes of data propagation code which would otherwise clog up your application with error-prone logic.
これらのMeteor関数はリアクティブコンテキスト内であなたのコードを実行します:
These Meteor functions run your code in a reactive context:
- Meteor.ui.renderとMeteor.ui.chunk
- Meteor.autosubscribe
- Templates
そして変化をトリガーできるリアクティブなデータソースは以下の通りです:
And the reactive data sources that can trigger changes are:
- Session変数
- Collections上のDatabaseキュー
- Meteor.status
Meteorの応答性の実装は短くかわいい、約50行のコードです。Meteor.depsモジュールを使ってこのコードに継ぎ足し、新しいリアクティブコンテキストやデータソースを追加することができます。
Meteor's implementation of reactivity is short and sweet, about 50 lines of code. You can hook into it yourself to add new reactive contexts or data sources, using the Meteor.deps module.
ライブHTML
HTMLテンプレートはウェブアプリケーションの中心です。Meteorのライブページ更新技術を使って、HTMLをリアクティブに描画することができます。すなわち、ページを生成するのに使われたデータに関する変化を追跡して自動的に更新します。
HTML templating is central to web applications. With Meteor's live page update technology, you can render your HTML reactively, meaning that it will update automatically to track changes in the data used to generate it.
このオプションの特長は任意のHTMLテンプレートライブラリと合わせて機能します。JavaScriptから手動で生成したHTMLとも合わせて機能します。以下は例です:
This optional feature works with any HTML templating library, or even with HTML you generate manually from Javascript. Here's an example:
var fragment = Meteor.ui.render( function () { var name = Session.get("name") || "Anonymous"; return "<div>Hello, " + name + "</div>"; }); document.body.appendChild(fragment); Session.set("name", "Bob"); // page updates automatically!
Meteor.ui.renderは描画関数、すなわち、あるHTMLを文字列として返す関数を取ります。そして自動更新されるDocumentFragmentを返します。描画関数が使ったデータに変化があった時、再実行されます。その時、DocumentFragment内のDOMノードは、ページのどこに挿入されたかに関わりなく、その場で自身を更新します。
Meteor.ui.render takes a rendering function, that is, a function that returns some HTML as a string. It returns an auto-updating DocumentFragment. When there is a change to data used by the rendering function, it is re-run. The DOM nodes in the DocumentFragment then update themselves in-place, no matter where they were inserted on the page.
これは完全に自動です。Meteor.ui.renderはリアクティブコンテキストは使って描画関数がどのデータを使ったか発見します。
Meteor.ui.render内から、Meteor.ui.chunkを使うとどれだけのHTMLがデータの変化時に再描画されるかカスタマイズできます。また、Meteor.ui.listChunkを使うと効果的にライブデータベースクエリを追跡するようにカスタマイズできます。
It's completely automatic. Meteor.ui.render uses reactive contexts to discover what data is used by the rendering function. From within Meteor.ui.render, you can use Meteor.ui.chunk to customize how much of the HTML is rerendered on a data change, or Meteor.ui.listChunk to efficiently track a live database query.
しかし、ほとんどの機会では、これらの関数を直接コールすることはないでしょう―HandlebarsやJadeといったお気に入りにテンプレートライブラリをただ使うだけです。描画とチャンク関数は新しいテンプレートシステムを実装している人たちのためを意図されています。
Most of the time, though, you won't call these functions directly ― you'll just use your favorite templating package, such as Handlebars or Jade. The render and chunk functions are intended for people that are implementing new templating systems.
Meteorは通常、必要な更新はなんでも一括して、あなたのコードが走っていない時だけ実行します。なのであなたは、DOMがあなたに隠れて変更されないことを確信することができます。時々、反対の振る舞いを望むかもしれません。例えば、もしデータベースにレコードを挿入しただけならDOMに更新を強制したいかもしれません。jQueryのようなライブラリを使えば新しい要素は検索できます。そんな場合、Meteor.flushをコールしてDOMをすぐに最新にください。
Meteor normally batches up any needed updates and executes them only when your code isn't running. That way, you can be sure that the DOM won't change out from underneath you. Sometimes you want the opposite behavior. For example, if you've just inserted a record in the database, you might want to force the DOM to update so you can find the new elements using a library like jQuery. In that case, call Meteor.flush to bring the DOM up to date immediately.
ライブ更新中のDOM要素がスクリーンから外された時、それらは自動的に一掃されますーコールバックは破棄され、関連づけられたデータベースクエリはすべて中止され、更新を中止します。このため、手で書かれた更新ロジックを悩ますゾンビテンプレートについて心配する必要は全くありません。要素を一掃から保護するには、コードがイベントループに戻る前に、または、Meteor.flushさせるコールの前に、それらがオンスクリーンであることだけ確認してください。
When live-updating DOM elements are taken off the screen, they are automatically cleaned up ― their callbacks are torn down, any associated database queries are stopped, and they stop updating. For this reason, you never have to worry about the zombie templates that plague hand-written update logic. To protect your elements from cleanup, just make sure that they on-screen before your code returns to the event loop, or before any call you make to Meteor.flush.
手で書かれたアプリケーションでの別の厄介な問題は要素維持です。ユーザーが<input>要素にテキストをタイプしていて、その要素を含むページ領域が再描画されたとしましょう。<input>が再生されると、フォーカスやカーソル位置、一部入力されたテキスト、強調文字入力状態が失われ、ユーザーはでこぼこ道を進むような感じになるでしょう。
Another thorny problem in hand-written applications is element preservation. Suppose the user is typing text into an <input> element, and then the area of the page that includes that element is redrawn. The user could be in for a bumpy ride, as the focus, the cursor position, the partially entered text, and the accented character input state will be lost when the <input> is recreated.
これはMeteorが自動的に解決する別の問題です。フォーカス可能な要素のそれぞれが固有のidを持つか、idを持つ直近の親の中で固有のnameをもつかどちらかを確かにしてください。Meteorは、取り囲むテンプレートが再描画されてもこれらの要素を維持します。しかし、それらの子供を更新したり、属性変化を上書きします。
This is another problem that Meteor solves automatically. Just make sure that each of your focusable elements either has a unique id, or has a name that is unique within the closest parent that has an id. Meteor will preserve these elements even when their enclosing template is rerendered, but will still update their children and copy over any attribute changes.
テンプレート
Meteorは、HandlebarsやJadeのようなあなたのお気に入りのHTMLテンプレート言語を、Meteorのライブページ更新技術に沿って使いやすくします。いつものようにただテンプレートを記述してください。Meteorがそのリアルタイム更新をお世話します。
Meteor makes it easy to use your favorite HTML templating language, such as Handlebars or Jade, along with Meteor's live page update technology. Just write your template as you normally would, and Meteor will take care of making it update in realtime.
この特長を使うには、プロジェクトの中に.html拡張子を持つファイルを作ってください。ファイルの中で、タグを作り、それにname属性をつけてください。タグの中にテンプレートコンテンツを入れてください。Meteorはテンプレートを事前コンパイルしクライアントに送り、グローバルTemplateオブジェクト上の関数として利用可能にします。
To use this feature, create a file in your project with the .html extension. In the file, make a tag and give it a name attribute. Put the template contents inside the tag. Meteor will precompile the template, ship it down to the client, and make it available as a function on the global Template object.
今のところ、Meteor用にパッケージされている唯一のテンプレートシステムはHandlebarsです。あなたがMeteorと合わせてどんなテンプレートシステムを使いたいか教えてください。差し当たってはHandlebarsのマニュアル類を参照してください。
Today, the only templating system that has been packaged for Meteor is Handlebars. Let us know what templating systems you'd like to use with Meteor. Meanwhile, see the Handlebars documentation.
helloのnameを持つテンプレートは、テンプレート用の任意のデータを引数に関数Template.helloをコールすることで描画されます:
A template with a name of hello is rendered by calling the function Template.hello, passing any data for the template:
<!-- in myapp.html --> <template name="hello"> <div class="greeting">Hello there, {{first}} {{last}}!</div> </template> // in the JavaScript console > Template.hello({first: "Alyssa", last: "Hacker"}); => "<div class="greeting">Hello there, Alyssa Hacker!</div>"
これは文字列を返します。ライブHTMLシステムに沿ってテンプレートを使ったり、その場で自動的に更新されるDOM要素を受け取るには、Meteor.ui.renderを使ってください:
This returns a string. To use the template along with the Live HTML system, and get DOM elements that update automatically in place, use Meteor.ui.render:
Meteor.ui.render(function () { Template.hello({first: "Alyssa", last: "Hacker"}); }) => automatically updating DOM elements
テンプレートにデータを受け取る最も簡単な方法はJavaScriptでヘルパー関数を定義することです。ただTemplate.[template name]オブジェクト上に直接ヘルパー関数を加えてください。例えば、テンプレートを以下とします:
The easiest way to get data into templates is by defining helper functions in JavaScript. Just add the helper functions directly on the Template.[template name] object. For example, in this template:
<template name="players"> {{#each top_10_scorers}} <div>{{name}}</div> {{/each}} </template>
テンプレート関数をコールした時、データとしてtop_10_scorers内で渡す代わりに、以下のようにTemplate.players上で関数を定義することができます:
instead of passing in top_10_scorers as data when we call the template function, we could define a function on Template.players:
Template.players.top_10_scorers = function () { return Users.find({}, {sort: {score: -1}, limit: 10}); };
この場合、データはデータベースクエリから来ています。データベースカーソルが#eachに渡される時仕掛けのすべてに接続され、ク新たな結果がクエリに入ると効率的にDOMノードを加えたり移動させたりします。
In this case, the data is coming from a database query. When the database cursor is passed to #each, it will wire up all of the machinery to efficiently add and move DOM nodes as new results enter the query.
ヘルパーは引数を取ることができて、以下のように現在のテンプレートデータを受け取ります:
Helpers can take arguments, and they receive the current template data in this:
// in a JavaScript file Template.players.league_is = function (league) { return this.league === league; };
<!-- in a HTML file --> <template name="players"> {{#each top_10_scorers}} {{#if league_is "junior"}} <div>Junior: {{name}}</div> {{/if}} {{#if league_is "senior"}} <div>Senior: {{name}}</div> {{/if}} {{/each}} </template>
Handlebars注: 入れ子のヘルパーコールを許すMeteor拡張のため、{{#if league_is "junior"}}が許されます。(ifとleague_isの両方は技術的にヘルパーであり、標準的なHandlebarsは式毎に１つのヘルパー関数の呼び出しのみ許します。
Handlebars note: {{#if league_is "junior"}} is allowed because of a Meteor extension that allows nested helper calls. (Both if and league_is are technically helpers, and stock Handlebars only allows one helper invocation per expression.)
ヘルパーは定数データを渡すのに使うこともできます。
Helpers can also be used to pass in constant data.
// Works fine with {{#each sections}} Template.report.sections = ["Situation", "Complication", "Resolution"];
最後になりますが、テンプレート関数のイベントプロパティをイベントハンドラのテーブルに設定することができます。フォーマットはEvent Mapsに記載されています。イベントハンドラの引数はテンプレートデータです。
Finally, you can set the events property of a template function to a table of event handlers. The format is documented at Event Maps. The this argument to the event handler will be the template data.
今のところ、イベントハンドラは現在のテンプレートのトップレベルからテンプレートデータを受け取ります。イベントをトリガーした要素のテンプレートコンテキストからのテンプレートデータではありません。これは変更されるでしょう。
For now, the event handler gets the template data from the top level of the current template, not the template data from the template context of the element that triggered the event. This will be changing.
<!-- myapp.html --> <template name="scores"> {{#each player}} {{> player_score}} {{/each}} </template> <template name="player_score"> <div>{{name}}: {{score}} <span class="give_points">Give points</span> </div> </template>
<!-- myapp.js --> Template.player_score.events = { 'click .give_points': function () { Users.update({_id: this._id}, {$inc: {score: 2}}); } };
すべてまとめると、以下は、いかにして任意のデータをテンプレートに注入できるか、データが変化した時いつでも自動的に更新するかを示す例です。詳しい議論はライブHTMLを参照してください。
Putting it all together, here's an example of how you can inject arbitrary data into your templates, and have them update automatically whenever that data changes. See Live HTML for further discussion.
<!-- in myapp.html --> <template name="forecast"> <div>It'll be {{prediction}} tonight</div> </template>
<!-- in myapp.js --> // JavaScript: reactive helper function Template.forecast.prediction = function () { return Session.get("weather"); };
<!-- in the console -->
> Session.set("weather", "cloudy");
> document.body.appendChild(Meteor.ui.render(Template.forecast));
In DOM: <div>It'll be cloudy tonight</div>
> Session.set("weather", "cool and dry");
In DOM: <div>It'll be cool and dry tonight</div>
賢いパッケージ
Meteorは尋常でなく強力なパッケージシステムを持っています。あなたが今までに読んだ機能のすべては標準のMeteorパッケージとして実装されています。
Meteor has an unusually powerful package system. All of the functionality you've read about so far is implemented as standard Meteor packages.
Meteorパッケージはインテリジェントです: パッケージはそれ自身JavaScriptプログラムです。それらはコードをクライアントやサーバーに注入でき、バンドラーに新しい関数をフックすることができます。なのでMeteor環境をどんな風にも拡張できます。以下はパッケージのいくつかの例です:
Meteor packages are intelligent: the packages are themselves JavaScript programs. They can inject code into the client or the server, or hook new functions into the bundler, so they can extend the Meteor environment in arbitrary ways. Some examples of packages are:
coffeescriptパッケージは、ツリーの中の.coffeeを自動的にコンパイルするようにバンドラーを拡張します。一度加えると、JavaScriptの代わりにCoffeeScriptでアプリケーションを書くことができます。
The coffeescript package extends the bundler, automatically compiling any .coffee files in your tree. Once added, you can write your application in CoffeeScript instead of JavaScript.
jQueryとBackboneパッケージはMeteorにクライアントJavaScriptライブラリを事前にパッケージさせる例です。JavaScriptファイルをツリーにコピーすることで同じ結果は得られますが、パッケージを加えることはもっとてっとり早いです。
The jQuery and Backbone packages are examples of using Meteor to prepackage client JavaScript libraries. You could get the same result by copying the JavaScript files into your tree, but it's faster to add a package.
underscoreパッケージはクライアントとサーバー環境両方を拡張します。MinimongoやSessionオブジェクト、リアクティブHandlebarsテンプレートを含むコアMeteorの特長の多くはすべてのMeteorアプリケーションに自動的に含まれる内部パッケージとして実装されています。
The underscore package extends both the client and server environments. Many of the core Meteor features, including Minimongo, the Session object, and reactive Handlebars templates, are implemented as internal packages automatically included with every Meteor application.
meteor listを使って利用可能なパッケージのリストを見ることができ、meteor addを使ってプロジェクトにパッケージを追加でき、meteor removeを使ってそれらを削除することができます。
You can see a list of available packages with meteor list, add packages to your project with meteor add, and remove them with meteor remove.
現存のパッケージの記述に関してはPackage List節を参照してください。
See the Package List section for a description of the existing packages.
パッケージAPIは頻繁に変更され、文書化されていないのであなたはまだ自分のパッケージを作ることはできません。少し待ってください。
The package API is rapidly changing and isn't documented, so you can't make your own packages just yet. Coming soon.
配備
Meteorは完全なアプリケーションサーバーです。アプリケーションをインターネット上に配置するために必要なすべてを含んでいます: あなたはJavaScriptとHTML, CSSを提供するだけです。
Meteor is a full application server. We include everything you need to deploy your application on the internet: you just provide the JavaScript, HTML, and CSS.
Meteorのインフラ上での実行
アプリケーションを配備する最も簡単な方法はmeteor deployを使うことです。個人的にいつも欲しかったものなので提供します: アプリのアイデアを得て、週末に仕上げ、世界が使うようにそこへ配備する。創造性を妨げになるものは何もありません。
The easiest way to deploy your application is to use meteor deploy. We provide it because it's what, personally, we've always wanted: an easy way to take an app idea, flesh it out over a weekend, and put it out there for the world to use, with nothing getting in the way of creativity.
$ meteor deploy myapp.meteor.com
これでアプリケーションがmyapp.meteor.comで利用可能です。もし初めてこのホストネームに配備したなら、Meteorはアプリケーション用の新しい空データベースを生成します。もしアップデートを配備したいなら、Meteorは現存のデータを維持し、コードだけをリフレッシュします。
Your application is now available at myapp.meteor.com. If this is the first time deploying to this hostname, Meteor creates a fresh empty database for your application. If you want to deploy an update, Meteor will preserve the existing data and just refresh the code.
あなたの持つドメインに配備することも可能です。ただorigin.meteor.comにCNAMEとして使いたいホストネームを設定して、その名前に配備してください。
You can also deploy to your own domain. Just set up the hostname you want to use as a CNAME to origin.meteor.com, then deploy to that name.
$ meteor deploy www.myapp.com
無料サービスとしてこれを提供します。だからMeteorを試せます。急いで内部ベータやデモなどを置く時にも役に立ちます。
We provide this as a free service so you can try Meteor. It is also helpful for quickly putting up internal betas, demos, and so on.
自分のインフラ上での動作
アプリケーションを自分のインフラやHerokuのような他のホスティングプロバイダ上で走らせることもできます。
You can run also your application on your own infrastructure, or any other hosting provider like Heroku.
始めるには、以下のコマンドを走らせてください。
To get started, run
$ meteor bundle myapp.tgz
このコマンドは完備されたNode.jsアプリケーションをtarballの形で生成します。このアプリケーションを走らせるには、Node.js 0.6とMongoDBサーバーを用意する必要があります。nodeを呼び出し、アプリケーションがリッスンするHTTPポートとMongDBエンドポイントを指定することでアプリケーションを走らせることができます。もしまだMongoDBサーバーを持っていないなら、MongoHQで友人を推薦できます。
This command will generate a fully-contained Node.js application in the form of a tarball. To run this application, you need to provide Node.js 0.6 and a MongoDB server. You can then run the application by invoking node, specifying the HTTP port for the application to listen on, and the MongoDB endpoint. If you don't already have a MongoDB server, we can recommend our friends at MongoHQ.
$ PORT=3000 MONGO_URL=mongodb://localhost:27017/myapp node bundle/main.js
現在のところ、バンドルはバンドルが生成されたプラットフォーム上でのみ動作します。異なるプラットフォーム上で走らせるには、バンドルに含まれているネイティブパッケージを再構築する必要があります。それをするには、npmが利用可能であることを確かめて、以下を実行してください:
For now, bundles will only run on the platform that the bundle was created on. To run on a different platform, you'll need to rebuild the native packages included in the bundle. To do that, make sure you have npm available, and run the following:
$ cd bundle/server
$ rm -r fibers
$ npm install fibers@0.6.3
