36
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

新しい Yeoman と、ついでに MEAN を試してみる

Last updated at Posted at 2014-10-06

どうも、Yeoman 大好きおじさんです。先日 Yeoman のバージョン 1.3.0 がリリースされたみたいなので、試してみます。

スクリーンショット 2014-10-06 13.41.27.png

前提となる環境は Mac です。
参考:Mac で Yeoman の環境を構築する手順

ちなみに npm コマンド(Node.js) は、GUIインストーラではなくて、上記リンクでの手順のように Homebrew でインストールすることをオススメします。理由は、Homebrew だと root権限ではなくユーザ権限で npm および周辺ツールが動かせるので ディレクトリ/ファイル権限系のエラーに悩まされなくてよい からです。だって開発って、ユーザ権限でやりますよね。

あと、ついでに Yeoman で MEAN も試してみようと思います。

MEAN(MongoDB, Express, AngularJS, Node.js)スタックが優れている理由 にも書かれていますが、 MongoDB Express AngularJS Node.js を組み合わせた開発です。
サーバサイドを含めて言語は JavaScript データは JSON に揃えられるというメリットがある、という理解でよいのかな?

MEAN については賛否あるかもしれませんが、プロダクション(本番)で使うかどうかは別として、ツール類やプロトタイプなどライトなもの用途という感じでしょうか。

yo を最新へアップデート

  • 下記コマンドを叩く。

     $ npm udate -g yo
    
  • バージョンを確認。

     $ yo -v
     
     1.3.0
    

新しい yo を試してみる

  • yo を起動。

     $ yo
    
  • インストール済みのジェネレータから選択して、ジェネレータ起動ができるようになったようです。

    スクリーンショット 2014-10-06 14.27.13.png

  • ジェネレータのアップデートや、新しいジェネレータのインストールもここからできるみたい。

    スクリーンショット 2014-10-06 14.28.19.png

MEANを試す

新しい Yeoman で早速、MEAN を試してみます。このジェネレータが人気ぽいので、これを採用します。
https://github.com/DaftMonk/generator-angular-fullstack

ジェネレータのインストール

  • yo を起動して、ジェネレータのインストールを選択。

    スクリーンショット 2014-10-06 14.28.41.png

  • angular-fullstack で検索し、一番上のものを選択。

    スクリーンショット 2014-10-06 14.30.14.png

  • インストールが完了。

    スクリーンショット 2014-10-06 14.31.24.png

ジェネレータの起動

  • yo を起動して、先程インストールしたジェネレータを選択。

    スクリーンショット 2014-10-06 14.31.41.png

  • おじさんからの質問に答えます。ここは好みで選択。

    スクリーンショット 2014-10-06 14.33.56.png

    選択できるオプションは ジェネレータのGitHubページ で確認できまます。
    mongoDB は別途インストールが面倒なので外しました。

  • フロントエンドとサーバサイドの雛型ソースコードが展開されます。

    • ソースコードを見るだけでも、参考になるのではないでしょうか。

      スクリーンショット 2014-10-06 15.27.23.png

  • 雛型そのままで、動作確認してみます。

     $ grunt serve
    

    自動的にでデフォルトブラウザが起動します。

    スクリーンショット 2014-10-06 15.31.02.png

おわりに

試していませんが、上記 MEAN のジェネレータは Heroku へのデプロイもサポートしているようです。
MEAN については、Heroku へデプロイ前提であれば、ちょっとしたサーバサイドを用意しないといけない場合に検討してもいいのではないでしょうか。
(業務でやるなら、Node.js は Heroku がスケールしてくれる?として、DB はやはり RDB が必要になってくるケースが多いとは思う。具体的には RDB + キャッシュ目的の MongoDB かな。)

スクリーンショット 2014-10-06 15.40.46.png

36
39
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
36
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?