Hyde を使用して軽量の静的 Web サイトを迅速に作成する

プレーン・ファイル・システム・ベースの Web サイト開発ツールキットで、コンテンツ管理の不可解な部分を排除する

Web パブリッシング・フレームワークは素晴らしいものの、必要なのは一貫して優れたパフォーマンスを実現するために利用できるシンプルな静的サイトであることから、Web パブリッシング・フレームワークを使うまでのことはない場合もあります。そのような場合に、Web パブリッシング・フレームワークが持つ便利な部分は利用したい一方で、それによるオーバーヘッドがないようにしたいとしたら、静的サイト・ジェネレーターがその両方を適えてくれます。よく使用されているサイト・ジェネレーターには、Django をベースとした強力なテンプレート機能とメタデータ管理機能を提供する Hyde があります。Hyde は Python で実装されていますが、Python の知識が必須というわけではありません。この記事を読んで、Hyde を使用して静的 Web サイトの開発期間を短縮する方法を学んでください。

Uche Ogbuji, Principal Consultant, Fourthought Inc.

Uche Ogbuji は、Zepheira 社で高度な Web カタログやその他のリッチなコンテキスト依存データベースの作成を監督する、同社のパートナーです。XML、セマンティック Web と Web サービス、Akara などのオープンソース・プロジェクト、そして Web データ・アプリケーション用のオープンソース・プラットフォームなど、先進的な Web テクノロジーの先駆者として長い歴史を積んでいます。コンピューター・エンジニア、ライターとしても活躍する彼は、ナイジェリア出身で、現在はアメリカ・コロラド州ボールダー近くに住んでいます。彼に関して詳しくは、彼のブログである「Copia」を見てください。



2013年 8月 08日

概要

Web の歴史における初期の頃のページは、そのほとんどが、どこかのサーバー上のファイルシステムに置かれたページに過ぎませんでした。Web が、動的サイト、e-コマース、大規模パブリッシング、そして Web 上のアプリケーションといった具合に、より高度なものになるにつれ、単純なファイルから高度な Web コンテンツ管理システム (CMS) とパブリッシング・ツールに切り替えることが次第に一般的になってきました。最近では、何万ものサイトが以下のものの上で実行されています。

  • IBM WebSphere
  • 他の Java フレームワークまたは .NET
  • Ruby on Rails や Django などの、よく使用されている代替 Web パブリッシング・フレームワーク
  • WordPress などのコミュニティー指向の CMS

今ではほとんどの場合に、最も単純なサイトを除くすべてのサイトに、最新の機能とワークフローを備えた CMS が必要であると見込まれるようになっています。

けれども、私をはじめとする多くの Web の古顔は、もっと単純であった、かつての Web が備えていた利点のいくつかを覚えています。その 1 つとして、静的ファイルを提供するのに必要なサーバーの処理能力は低くて済むという利点がありました。さらには、バックアップとコンテンツの移植が容易であるという利点もありました。CMS や Web パブリッシング・フレームワークを利用することにした場合、コンテンツについて理解するには、CMS や Web パブリッシング・フレームワークに頼らざるを得ません。コンテンツがデータベース・テーブルとしっかり結び付いているとしたら、共有するファイルにアクセスして取得するのは簡単ではありません。別のインフラストラクチャーに移行するのは、困難な作業になる可能性があります。さらに、バックアップとリストアを行うには、特化したツールに頼らざるを得なくなります。

これらの問題に内在する特性は、透過性です。Web パブリッシング・フレームワークと CMS は概して透過的ではありません。つまり、コンテンツが保管、管理、アップロードされる方法を理解するには、特殊な知識が大量に必要になるということです。これは、極めて単純な Web サイト以外のあらゆるサイトである程度必要になることですが、最近登場したプロジェクトでは、サーバー上の単純なファイルを処理してパブリッシュするという中心的な要素を失うことなく、フレームワークに備わったいくつかの利点を提供しています。そのようなフレームワークとしてよく使われているものの 1 つが、Jekyll です。この Jekyll のコアとなる概念をベースに、何人かの開発者が異なるビルディング・ブロック一式を使用して、オープンソースの Hyde プロジェクトを作成しました。現在、Hyde は私のお気に入りの Web パブリッシング・システムです。Hyde は単純ながらもかなりの能力を備えており、その目的を単純なファイルを処理して静的サイトを生成することに絞っているため、極めて優れた効率性と柔軟性を備えています。

Hyde の導入

Hyde は、Web 開発マシン上のファイルシステムのディレクトリー内でコンテンツとテンプレートを管理することができるシステムで、Python で作成されています。コンテンツを作成または更新するには、通常のテキスト・エディターとコマンドライン・ツールを使用することも、必要に応じて IDE (統合開発環境) を使用することもできます。サイトがどのように表示されるかを確認する段階にきたら、Hyde でそのサイトを生成し、テスト Web サーバーを使用してローカルでアップロードすることができます。テスト・モードでのサイトの表示に満足したら、生成された静的ファイルを Apache、Lighttpd、Nginx、あるいは瞬時にファイルをアップロードできる任意の Web サーバー・ソフトウェアで構築された、本番 Web サーバーに配置することができます。


インストールとセットアップ

Mac または Linux システムで Web 開発を行っている場合、Hyde に必要となる主なもの、つまり Python はすでに用意されています。Python は、Microsoft Windows や他のほとんどのプラットフォームにも簡単にインストールすることができます。Python ライブラリーに Hyde をインストールするには、セットアップに応じて sudo easy_install hyde または pip install hyde を実行します。これにより、hyde コマンドを使用できるようになります。まずは以下のコマンドを使用して、標準的な Web サイトの骨格となるファイル一式を格納するディレクトリー内に Hyde をセットアップします。

hyde -s $PATH_TO_DIRECTORY create

$PATH_TO_DIRECTORY は、コンテンツおよびテンプレート・ファイルの処理を行うディレクトリーに置き換えてください。

上記のコマンドは、サイトに対してデフォルトのレイアウトを使用しますが、Hyde では、他のサイト・レイアウトを選択することもできます。このオプションは、例えば Twitter Bootstrap フレームワークを使用する場合や、ターゲット・サイトがブログであることがわかっている場合など、よく知られたツールキットやセットアップをサイトに使用する場合に重宝します。

デフォルトのレイアウトを使用して、新しく作成したサイト・ディレクトリーに切り替えた場合、以下のサブディレクトリーが表示されます。

README.markdown content info.yaml layout site.yaml

これらのエントリーのそれぞれが、Hyde の異なる側面を提供します。

Markdown

HTML の作成を楽しんでいる人は多くありません。Hyde では、扱う HTML の量を最小限に減らすことができます。ほとんどのコンテンツ管理システムには、HTML をハンド・コーディングしなくても済むような手段が用意されています。それには通常、ワード・プロセッサー感覚で HTML を生成できる特殊な WYSIWYG (What-You-See-Is-What-You-Get) ウィジェットが使用されます。また、Wiki でお馴染みの手段もあります。それは、各種の HTML マークアップ構成体を表す特殊文字を使用してプレーン・テキストを編集するというものです。これらの手段は軽量マークアップ言語と呼ばれます。軽量マークアップ言語のうち、最もよく使われている例には、Markdown があります。

Hyde に組み込まれているプロセッサーを使用すると、Web ページを HTML ではなく Markdown で作成することができます。この記事では Markdown の詳細を説明することはしませんが、リスト 1 に一例として、Markdown フォーマットでの簡潔なリッチ・コンテンツを記載します。

リスト 1. Markdown フォーマットで記述したリッチ・コンテンツの例
      For immediate release. **Boulder, Colorado, 1 January 2012** The new year began 
      with a bang.... At city hall a local first nation elder was invited to offer 
      residents a greeting of *Heebee*, or "Hello" in Arapaho, and recorded for the 
      [city Web page](http://www.bouldercolorado.gov/). One resident said his New Year 
      resolutions were to: 
      * Lose weight 
      * Go camping for at least one week in the summer 
      * Pay off one credit card

Markdown プロセッサー (例えば、Hyde にバンドルされている Markdown プロセッサーなど) は、上記のコンテンツをリスト 2 に記載する HTML に変換することができます。

リスト 2. リスト 1 の Markdown コンテンツからの HTML 出力
      <p>For immediate release. 
      <strong>Boulder, Colorado, 1 January 2012</strong> 
      The new year began with a bang....</p>
      <p>At city hall a local first nation elder was invited to offer residents 
          a greeting of <em>Heebee</em>, or "Hello" in Arapaho, and recorded 
          for the <a href="http://www.bouldercolorado.gov/">city Web page</a>.</p>
      <p>One resident said his New Year resolutions were to:</p>
      <ul>
          <li>Lose weight</li>
          <li>Go camping for at least one week in the summer</li>
          <li>Pay off one credit card</li>
      </ul>

サイトの構成と YAML

YAML (YAML Ain't Markup Language) は、一部のプログラマーが構成ファイルに好んで使用している言語です。Hyde で作成されたサイトには、構成 (例えば、テンプレートの適用方法などを制御するための構成) が必要になります。Hyde が生成するデフォルトの site.yaml ファイルは、少数のプラグインを指定し、いくつかのローカル・ファイル・ディレクトリーを Web サーバーのパスに変換する方法を指定し、一部の主要なページの基本メタデータを提供します。

テンプレートと Jinja2

最近の Web サイトのほとんどは、ある程度のテンプレート機能を利用することができます。テンプレート・システムは、サイトの構造とページの共通要素を各ページの個々のコンテンツから切り離すのに役立ちます。例えば、ブログを見てみると、各ページの HTML の半分以上が、すべてのエントリーで繰り返される定型表現であることは珍しくありません。テンプレートを使用することで、コンテンツの 50 パーセントを一度表現すれば、あとはすべてのページにその表現を自動的に適用させることができます。テンプレート・システムは、ブログのアーカイブ・カレンダーを自動的に生成するなどの賢い機能をサポートすることもできます。

Hyde は、よく利用されている Django フレームワークと同様のテンプレート言語を使用しますが、Hyde のテンプレート言語は Jinja2 プロジェクトによって実装されます。各テンプレートは、テンプレート・コマンド用の特殊な構文 (以下で詳しく探ります) が追加された HTML のように見えます。テンプレートが格納される場所は、layout ディレクトリーです。テンプレートの追加および更新をこのディレクトリーで行って、サイト全体でのコンテンツの基本構造を操作します。

使用するコンテンツ

最も重要なのは、それぞれのサイトで使用するコンテンツです。コンテンツは、そのコンテンツの名前を付けたディレクトリーで保守します。一般に、固有の Web ページごとに 1 つのファイルを用意することになります。各コンテンツ・ファイルはページのメタデータで始まり、その後にそのページの HTML とテンプレート・コードが続きます。各コンテンツのディレクトリーは、サイトをサポートする画像、スタイルシート、スクリプト・ファイルなどの静的ファイルが置かれる場所でもあります。


簡単なサンプル

見栄えの良い Web サイトを手っ取り早く作成する方法は、HTML、CSS、そしてサイトの体裁に必要なスクリプトまで含まれた、無料で利用できる多くの Web デザインのいずれかをダウンロードすることです。その後、その Web デザインの定型部分を独自のコンテンツに置き換えて、ルック・アンド・フィールを微調整することができます。Hyde を使用すると、このプロセスは簡単になります。その特定のソフトウェアの Web デザインだけに縛られる必要もありません。このセクションでは、私が選択した無料の一般的な HTML5/CSS3 テンプレートを Hyde に適応させます。選択したテンプレートは Marija Zaric 氏が作成した「Minimalism」というテンプレート (「参考文献」を参照) で、クリエイティブ・コモンズ 3.0 表示 (BY) ライセンスの下で利用できるため、テンプレートを使用する際にクレジットを表示する限り、商用プロジェクトでも無料で使用することができます。このテンプレートを使用する Web サイトは、このテンプレートの派生物になります。

テンプレート・パッケージをダウンロードして解凍すると、そこには index.html ファイルが含まれています。Hyde フォルダーの content ディレクトリーにも同じ名前のファイルが格納されていますが、これは実際には HTML ではなく、base.j2 をベースとした Jinja2 テンプレートです。Minimalism ファイルを新しいテンプレートに変換するために、これをコピーして minimalism.j2 という名前に変更しました。それと同時に、テンプレートの他のサポート・ファイルを以下のように適切な場所にコピーしました。

      cp minimalism/index.html 
      $PATH_TO_DIRECTORY/layout/minimalism.j2 cp minimalism/css/styles.css 
      $PATH_TO_DIRECTORY/content/media/css/ cp minimalism/images/* 
      $PATH_TO_DIRECTORY/content/media/images/

デザイン・テンプレートを Jinja2 テンプレートに変換する

Web サイトでは、多数のページで同じ基本レイアウトとデザインを使用し、コンテンツとメタデータをページごとに変えるという方法をよく使用します。Minimalism デザイン・テンプレートを複数の実際のページで使用できる Jinja2 テンプレートに変換するには、すべてのページに共通する部分と、各ページに固有の部分を調べる必要があります。まずは、Minimalism の head 要素を見てください。

      <head> 
          <meta charset="UTF-8"> 
              <title>Minimalism - Home</title> 
              <link rel="icon" href="images/favicon.gif" type="image/x-icon"/> 
              <!--[if lt IE 9]> 
                  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
                  </script> 
                  <![endif]-->
              <link rel="shortcut icon" href="images/favicon.gif" type="image/x-icon"/>
              <link rel="stylesheet" type="text/css" href="css/styles.css"/>
      </head>

この例の場合、タイトル以外のほとんどすべてがページ間で共有されます。したがって、以下のように、タイトル・コンテンツだけをメタデータが挿入されるテンプレート・フィールドに変えます。

<title>{{ resource.meta.title }}</title>

head 要素ではまた、アイコン、スタイル、そしてその他のリソースにリンクしています。Hyde は、そのようなリソース用のフォルダーと、生成されるページでのリソースの URL との対応付けを管理するため、これらのリンクが特殊な Hyde 関数を使用するように更新しなければなりません。

      <link rel="icon" href="{{ media_url('images/favicon.gif') }}" type="image/x-icon"/>
      ... 
      <link rel="shortcut icon" href="{{ media_url('images/favicon.gif') }}" 
          type="image/x-icon"/> <link rel="stylesheet" 
              href="{{ media_url('css/styles.css') }}" type="text/css"/>

favicon.gif ファイルは、開発時にインラインで配置することができます。サイトを本番環境で立ち上げるには、アイコン画像をドメインのルートに配置して、明示的なリンクが不要になるようにするのが最善です。

さらに、前の例と同じパターンに従って、すべての画像を更新したり、JavaScript ファイルやその他のリソースへのリンクを更新したりする必要もあります。例えば、テンプレートを披露するために使用されている 1 つのフィーチャー画像のリンクは、更新後には以下のようなコードになります。

      <a class="photo_hover3" href="#"> 
          <img src="{{ media_url('images/picture1.jpg') }}" width="240" 
              height="214" alt="picture1"/></a>

これで、Hyde はテンプレートをダウンロード元のデモ・サイトで表示されていたのと同じように表示することができます。ただし、これで作業が終わったわけではありません。次は、「Lorem Ipsum」というダミー・テキストを有用なコンテンツに置き換えるためのセットアップが必要です。

コンテンツを取り込む

テンプレートには、ページ固有のマークアップを挿入する場所を簡単にマークすることができます。そのために必要なのは、Jinja ブロック・マーカーを追加することだけです。リスト 3 に記載する minimalism.j2 から抜粋したセクションに、このブロック・マーカーが示されています。

リスト 3. Jinja ブロック・マーカーを示す「Minimalism」テンプレートのセクション
      <!--start intro--> 
      {% block intro %} 
      <section id="intro"> 
          <hgroup> 
              <h1>"Simplicity is the ultimate sophistication"
                  <span>- Leonardo da Vinci</span>
              </h1> 
              <h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
                  Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin.
                  Vestibulum condimentum facilisis nulla. In hac habitasse platea 
                  dictumst. Nulla nonummy. Cras quis libero.</h2> 
          </hgroup> 
      </section> 
      {% endblock intro %}

{% block intro %}{% endblock intro %} をテンプレート HTML に追加しました。ご覧のように、ダミー・テキストはそのまま残してあります。ダミー・テキストはページごとに上書きするので、これで問題ありません。リスト 4 に、index.html という名前で保存したサンプル・ページを記載します。このページは minimalism.j2 テンプレートをベースにしていますが、2 つのテンプレート・ブロックを上書きしています。

リスト 4. リスト 3 をベースに、HTML を使用して 2 つの Jinja テンプレート・ブロックを上書きするサンプル・ページ
      --- extends: minimalism.j2 
      title: Strange Case of Dr Jekyll and Mr Hyde 
      description: Tribute to a Victorian classic -- 
      {% block intro %} 
      <section id="intro"> 
      <hgroup>
      <h1><i>Strange Case of Dr Jekyll and Mr Hyde</i>
          <span>—R.L. Stevenson</span></h1>
          <h2>"I knew myself, at the first breath of this new life, 
          to be more wicked, tenfold more wicked, sold a slave to my original evil; 
          and the thought, in that moment, braced and delighted me like wine."</h2>
      </hgroup>
      </section>
      {% endblock intro %}
      {% block group1 %}
      <section class="group1">
          <h3>The author</h3>
          <p><b>Robert Louis Balfour Stevenson</b> (13 November 1850 – 3 December 1894) 
              was a Scottish novelist, poet, essayist and travel writer. His best known 
              books include <i>Treasure Island</i>, <i>Kidnapped</i>, and 
              <i>Strange Case of Dr Jekyll and Mr Hyde</i>.</p> 
          <a class="photo_hover3" href="#">
              <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/  
                  Robert_Louis_Stevenson_Knox_Series.jpg/ 
                  220px-Robert_Louis_Stevenson_Knox_Series.jpg" 
                  width="220" height="329" alt="R.L. Stevenson"/></a> 
          <a href="#"><span class="button">Read more</span></a>
      </section>
      {% endblock group1 %}

リスト 5 に、Markdown を使用してページのコンテンツの一部を表現する方法を示します。ここでは、{% filter markdown -%} 命令を使用して、Hyde の組み込み Markdown コンバーターを呼び出しています。

リスト 5. リスト 3 をベースに、Markdown を使用して 2 つの Jinja テンプレート・ブロックを上書きするサンプル・ページ
      --- extends: minimalism.j2 title: Strange Case of Dr Jekyll and Mr Hyde 
      description: Tribute to a Victorian classic --- 
      {% block intro %} 
      <section id="intro">
          <hgroup>
             {% filter markdown -%} 
      # *Strange Case of Dr Jekyll and Mr Hyde* 
      ## "I knew myself, at the first breath of this new life, to be more wicked..." 
             {%- endfilter %} 
          </hgroup> 
      </section> 
      {% endblock intro %} 
      {% block group1 %} 
      <section class="group1"> 
          {% filter markdown -%} 
      ### The author 
      **Robert Louis Balfour Stevenson** (13 November 1850 – 3 December 1894) was a 
      Scottish novelist, poet, essayist and travel writer. His best-known books include 
      *Treasure Island*, *Kidnapped*, and *Strange Case of Dr Jekyll and Mr Hyde* 
          {%- endfilter %} 
          <a class="photo_hover3" href="#">
              <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/ 
                  Robert_Louis_Stevenson_Knox_Series.jpg/ 
                  220px-Robert_Louis_Stevenson_Knox_Series.jpg" 
                  width="220" height="329" alt="R.L. Stevenson"/>
          </a> 
          <a href="#"><span class="button">Read more</span></a> 
      </section> 
      {% endblock group1 %}

フィルター命令に含まれるコンテンツだけが、Markdown として解釈されます。その部分は、HTML 部分とは異なり、ブロック要素に応じたインデントで左寄せされることに注意してください。これは、インデントは HTML では重要ではありませんが、Markdown では重要な意味を持つからです。


まとめ

この記事では、Jinja テンプレートと Hyde のその他のコンポーネントに用意された機能のほんの一部を説明したに過ぎませんが、Hyde は自動化やワークフローの機能を強化する必要が出てきた場合はいつでも、単純な機能から始めて徐々に高度な機能に取り組めるような設計になっているため、これで問題ありません。Hyde を使用すれば、(ネスト可能な) 単純なブロックで構成される単純な Web ページを数多く開発することができます。自動的にコンパイルされるブログやそれと同様のものが必要な場合には、Hyde のデフォルト・レイアウトが良い見本となります。

Hyde 全体では、コンテンツ管理システムと下位レベルの Web パブリッシング・フレームワークの機能のほとんどを提供します。ファイルシステムをバッキング・ストアとして使用することから、システムの中で曖昧になったり不可解になったりする部分はほとんどありません。これは素晴らしい利点だと思います。今や皆さんには、Hype を導入して単純な Web ページを作成するための十分な基礎知識も、任意に選べる Web デザイン・テンプレートもあります。

参考文献

学ぶために

  • よく使われているテキスト・ベースの軽量マークアップ言語、Markdown について学んでください。
  • Hyde で使用されている YAML Ain't Markup Language (YAML) について学んでください。YAML は構成ファイルによく使用されているようになっています。
  • この著者による他の記事 (Uche Ogbuji 著、developerWorks、2000年11月から現在まで): Web 開発、Python、XML、XSLT、その他の技術に関する記事を読んでください。
  • New to Web Development: HTML、CSS、または JavaScript ファイルのコンテンツをリレーショナル・データベースとサーバー・サイドのプログラミングに提供する、Web アプリケーション開発に使用されているさまざまなテクノロジーを学んでください。
  • developerWorks Web development ゾーン: さまざまな Web ベースのソリューションを話題にした記事を調べてください。広範な技術に関する記事とヒント、チュートリアル、標準、そして IBM Redbooks については、Web development の技術文書一覧を参照してください。
  • developerWorks XML ゾーンで、Uche Ogbuji の連載「XML 的思索」をはじめ、XML に関するその他のリソースを調べてください。
  • さまざまな IBM 製品や IT 業界のトピックに焦点を絞った developerWorks テクニカル・イベントで最新の技術情報を入手してください。
  • developerWorks 最新イベント情報のページで、IBM の製品およびツールについての情報や IT 業界の動向についての情報を迅速に把握してください。
  • Twitter で developerWorks をフォローしてください。
  • developerWorks のオンデマンド・デモで、初心者向けの製品のインストールとセットアップから、熟練開発者向けの高度な機能に至るまで、さまざまに揃ったデモを見てください。

製品や技術を入手するために

  • 多くの一般的な CMS 機能をモデル化している静的 Web サイト・ジェネレーター、Hyd を使い始めてください。
  • Django と同様の Jinja2 テンプレート言語およびツールキットを調べてください。
  • この記事の例に使用した Marija Zaric 氏の「Minimalism」テンプレートを入手してください。
  • IBM 製品の評価をご自分に最適な方法で行ってください。評価の方法としては、製品の評価版をダウンロードすることも、オンラインで製品を試してみることも、クラウド環境で製品を使用することもできます。また、SOA Sandbox では、数時間でサービス指向アーキテクチャーの実装方法を効率的に学ぶことができます。

議論するために

  • developerWorks コミュニティーに参加してください。ここでは他の developerWorks ユーザーとのつながりを持てる他、開発者によるブログ、フォーラム、グループ、Wiki を調べることができます。

コメント

developerWorks: サイン・イン

必須フィールドは(*)で示されます。


IBM ID が必要ですか?
IBM IDをお忘れですか?


パスワードをお忘れですか?
パスワードの変更

「送信する」をクリックすることにより、お客様は developerWorks のご使用条件に同意したことになります。 ご使用条件を読む

 


お客様が developerWorks に初めてサインインすると、お客様のプロフィールが作成されます。会社名を非表示とする選択を行わない限り、プロフィール内の情報(名前、国/地域や会社名)は公開され、投稿するコンテンツと一緒に表示されますが、いつでもこれらの情報を更新できます。

送信されたすべての情報は安全です。

ディスプレイ・ネームを選択してください



developerWorks に初めてサインインするとプロフィールが作成されますので、その際にディスプレイ・ネームを選択する必要があります。ディスプレイ・ネームは、お客様が developerWorks に投稿するコンテンツと一緒に表示されます。

ディスプレイ・ネームは、3文字から31文字の範囲で指定し、かつ developerWorks コミュニティーでユニークである必要があります。また、プライバシー上の理由でお客様の電子メール・アドレスは使用しないでください。

必須フィールドは(*)で示されます。

3文字から31文字の範囲で指定し

「送信する」をクリックすることにより、お客様は developerWorks のご使用条件に同意したことになります。 ご使用条件を読む

 


送信されたすべての情報は安全です。


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=Web development, Open source
ArticleID=939711
ArticleTitle=Hyde を使用して軽量の静的 Web サイトを迅速に作成する
publish-date=08082013