体感!JavaScriptで超速アプリケーション開発 -Meteor完全解説

第3回 Meteorの基本的なAPI

この記事を読むのに必要な時間:およそ 3 分

Meteorの基本的なAPIを紹介

前回は,Meteorプロジェクトのディレクトリ構造と,それらがMeteorによって実行時にどのように取り扱われるかを解説しました。それにより,MeteorはクライアントとサーバをどちらもJavaScriptで記述でき,コードの共有も非常に容易だということを明らかにしました。

今回は,⁠サーバとクライアントのどちらもJavaScriptで書ける」というMeteorの特色を示すような,Meteorの基本的なAPIについて解説します。

MeteorのコアAPI

まずは最も基本的なAPIとして,以下の3つがあります。

Meteor.is_client
現在のコードがクライアント上で実行されている場合はtrue
Meteor.is_server
現在のコードがサーバ上で実行されている場合はtrue
Meteor.startup()
アプリケーションの開始後に呼び出される。

前回学んだように,プロジェクト内のclientserverpublic以外の場所にあるJavaScriptコードは,サーバ上でもクライアント上でも実行されます。そして,Meteor.is_clientMeteor.is_serverといった変数を使用すると,現在のプログラムがサーバ上で実行されているのか,クライアント上で実行されているのかを判定することができるわけです。

また,Meteor.startup()は,クライアント上かサーバ上かにかかわらずアプリケーションの開始後に呼び出されます。クライアント上ではDOMが構築され,Meteorの初期処理が終わったタイミングで,サーバ上ではプロセスが起動して初期処理が完了したタイミングで呼び出されます。

これらを使用したコード例を以下に掲載します。以下のコードは,Meteor.startup()内でMeteor.is_clientMeteor.is_serverを使用して処理の振り分けを行っています(ログに出力するメッセージを変えているだけです)⁠

リスト1 sample3-1/sample3-1.js

Meteor.startup(function() {
  if (Meteor.is_client) {
    console.log("クライアントの初期化完了!");
  } else {
    console.log("サーバの初期化完了!");
  }
});

サーバ上では,meteorコマンドを実行したコンソール上にメッセージが表示されます。

図1 サンプル3-1の実行結果(サーバ)

図1 サンプル3-1の実行結果(サーバ)

クライアント上では,画面が表示された直後にブラウザのコンソールにメッセージが出力されました。サーバとクライアントで全く同じコードが動作しつつ,異なる処理が行われていることがおわかりかと思います。

図2 サンプル3-1の実行結果(クライアント)

図2 サンプル3-1の実行結果(クライアント)

サンプルは以下からダウンロードできます。

著者プロフィール

白石俊平(しらいししゅんぺい)

株式会社オープンウェブ・テクノロジー代表取締役

HTML5開発者コミュニティhtml5j.org管理人

HTML5とか勉強会主催

Web先端技術味見部 部長

読書するエンジニアの会主催

しろうと哲学部 部長

Google API Expert(HTML5)

Microsoft Most Valuable Professional 2010, 2011(Internet Explorer)

コメント

  • 誤記

    本文中のsample3-2.htmlとsample3-2.jsの内容が古い(?)ようです。
    スクリーンショットでは入力欄が姓と名に分かれていますが、本文で引用しているコードは名前にまとまっています

    Commented : #1  ある読者 (2013/01/27, 18:47)

コメントの記入