HTML5+α @福岡 feat. html5jえんぷら部レポート

HTML5+α @福岡 feat. html5jえんぷら部に行ってきた。

福岡でHTML5+α @福岡とhtml5jエンタープライズ部で合同勉強会を開催しました。

f:id:MSakamaki:20140316134507p:plain

今回はハンズオン形式の勉強会を、次の3つのテーマで皆さんにyeomanを触ってもらいました。

  • いろいろなgruntを使ってみよう
  • いろいろなgeneratorを使ってみよう
  • generatorを作ってみよう。

今回私が担当するのは「ggeneratorを作ってみよう。」と言うテーマです。

yeoman-generator

yeomanを使ったことがある方はご存知かもしれませんが、yeoman-generatorは、yoコマンド実行時に動作するモジュールです。 yoコマンドの本体とも言えます。

そんなyeoman-generatorが開発者に提供してくれる機能は、大きく分けて以下の2つです。

  • generatorによる新規プロジェクトの生成
  • subgeneratorによる、定型的なプロジェクトのメンテナンス。

generatorの作り方

今回はそんなyeoman-generatorが呼び出すgeneratorを、generator-generatorを使って作成しました。

最終的には次の3つの内容を持ち帰ってもらうような内容のハンズオンです。

  1. yoコマンドがどのようにgeneratorを認識するのか?
  2. generatorの作り方(質問とその質問内容に応じたテンプレートの作り方。)
  3. subgeneratorの作り方(テンプレートの連携と改変、generator用の環境変数の持ち方)

ハンズオンの資料は次のURLに公開しています。 https://github.com/MSakamaki/GeneratorAPI

今回はそんなテーマで、約4時間のハンズオンを行いました。

ハンズオン中の雰囲気はTogetterまとめを見てもらえれば。

感想

今回はゼロからgeneratorを作成しましたが、やはりゼロから作るのは大変です。

実際に運用する場合は、generatorの構築コストを考えると、既存でangular-generatorbackbone-generatorなどの優秀なgeneratorが多数存在するので、そちらを使うことの方が多く、滅多な事では新規でgeneratorを作成することはないでしょう。

しかし、yeomanチームのblogUse the new .extend() method instead of util.inherit と言う記事があります、 そこでは次のマイルストーンでは複数のgeneratorを連携させ、アプリケーションを構築出来るようにしたいとあります。 そうなれば、既存の優秀なgeneratorに、社内ルールのsubgeneratorを連携し、なるべく少ないコストで社内ルールに則ったプロジェクトの改修が容易にできるようになるのではないでしょうか?

GruntやBowerにスポットがあたりがちなyeomanですが、yoコマンドのsubgeneratorを使った定型的なプロジェクトの改変は、大規模開発や長期運用する上で個人的には凄くマッチすると思っています。

今回は時間の関係上mixinやテスト用ヘルパによるgeneratorの品質保持をテーマに含めることができなかったので、機会があれば、次回はそちらをやってみたいと思います。

リンク