Yeoman を使って Webアプリの雛形を作ってみる - akiyoko blog
Yeoman（ヨーマン）は、モダンなWebアプリのためのフロントエンド統合開発ツールです。Webアプリをスクラッチから作る際のややこしいワークフローを楽チンにしてくれる便利なツールと考えればよいでしょう。 Yeoman は、以下の3つのツールで構成されています。単体でも使うことができるのですが、それぞれのツールの親和性が高いので、3つをまとめて使いこなすと非常に効率がよいと思います。 Yo 雛形作成ツール Bower パッケージマネージャ Grunt タスクランナ 利用イメージは、公式ページの↓の図が非常に分かりやすいです。 （http://yeoman.io/learning/index.html より引用） 図でも説明されているように、まずは Yo から使い始めることが多いわけなのですが、Yo を使って雛形アプリを作ることで、Bower（バウワー）を利用するための bower.json
Docker + Yeoman + Hubot + Slack で簡単bot作成
ご存知、Hubotをわりとモダンなやり方で作ってみたのでご紹介します。コピペで作れます。Dockerでいれるので環境が汚れません。 satoshun00です。 ご存知、Hubotを、ちょっとモダンなやり方で作ってみたのでご紹介します。 実際にFennecLabチームで使用しているfennecbotはこの手順で作りました。 Githubにリポジトリを公開しています。 https://github.com/fenneclab/fennecbot pros コピー&ペーストで作れます Dockerでいれるので環境が汚れません cons SlackとHubotがURLで連携するため、リモートの置き場所が必要です 今回はさくらVPSで運用 今回はMac OS X(ローカル)とCentOS6(さくらVPS, 実運用)に入れました。 Installation Docker Docker Document
yeomanを使って簡単なjquery pluginを作ってbowerに登録する - Line 1: Error: Invalid Blog('by Esehara' )
はじめに 前までは、どちらかというとAPIよりの開発をすることが多く、あんまりフロントエンドのことを気にかけることがあまりなかった。とはいえ、それを知らないのもアレだろうと思ったので、yeomanを使ってみることにした。 とはいえ、何かを作るにしても、「何を作りたいか」という題材が必要かな、と思ったので、そういえば昔にjquery-kabukiというのを作ったときに、やたらと文字をピカピカさせる部分だけ流用されていた。 文字列を気軽にピカピカさせることには本当に一部の需要があるらしく、エコシステムの勉強がてら、その辺について調べることにした。ちなみに、最終的に出来たのは、下のものになる。 esehara/jquery-pikapika · GitHub yeomanについて いわゆる「フロントエンドの雛形全般を作るためのツール」といったほうがいいかもしれない。yeomanのgithub p
Yeoman入門(第二部、generatorを作る) - from scratch
さて、Yeoman入門の第二部です。このエントリはシリーズ物なので、第一部を見ていない方は第一部も参考にしてください。 Yeoman入門(第一部、yoを使う) - from scratch 第一部を軽くおさらいすると、yoは雛形作成をしてくれるツールでした。 そのyoの雛形作成機能を使えば、手間を掛けずに基盤が作れるという利点がある、という説明をしました。 今回の話は、そのyoの雛形を作成する方法を紹介します。 ここではその雛形を作成する機能のことを generator と呼びます。 generatorを作る。 既存のgeneratorを参考にして作る方法とgenerator-boilerplateを使う方法、generator-generatorを使う方法の3種類があります。ただ、どれも仕組みは同じなので全ては説明しません、generator-generatorを使う方法を中心に説明しま
Building Apps With the Yeoman Workflow | Envato Tuts+
What Is Yeoman? Trick question. It's not a thing. It's this guy: Basically, he wears a top hat, lives in your computer, and waits for you to tell him what kind of application you wish to create. As an example, scaffolding a web application would look something like this: The first thing that comes to mind is OMG so dreamy. Second, thanks, bro. All we did was tell him what we wanted and he replied
Yeomanを使ってAngularJSアプリのひな形をつくってみる | DevelopersIO
AngularJSが人気上昇中らしいです 少し前にJavaScriptフレームワークの人気を集計した結果が発表されてました。(Githubのwatcher数をみてるらしい） 圧倒的にbackbone.jsが抜けてますが、AngularJSもここ数ヶ月で急上昇しています。 backboneは少しだけ使ったことがありますが、AngularJSはいままであまり使ったことがありませんでした。 ここでもAngularJSの紹介をしていますが、いい機会なので、この記事ではYeomanをつかってAngularJSを動かしてみます。 AngularJSとは AngularJSとは、Googleとユーザーコミュニティによって開発されているオープンソースのJavaScriptフレームワークで、昨年バージョン1.0がリリースされました。 データのバインディングとテンプレートエンジン機能によって、JavaScri
Yeoman入門(第一部、yoを使う) - from scratch
※ 追記： id:TokyoIncidents さん"補足"の誤字修正しました、ありがとうございます!! これからYeomanに関して説明していきます。 Yeoman自体が何者なのかよくわかっていない人も多いと思います。また、ある程度Yeomanの概要は知っているので、generatorの作り方が知りたい、という方もいると思います。今回は三部構成で、yeomanを使う話、yeomanのgeneratorを作る話、最後にyeomanのAPIに関して説明していきます。今回は第一部のyeomanを使う話について説明します。 Yeomanとは Google社が作成した総合開発ツール群です、「ヨーマン」と呼びます。公式サイトには MODERN WORKFLOWS FOR MODERN WEBAPPS (モダンWEBアプリケーションのためのモダンワークフロー) と記述されています。 Yeomanを使う
フロントエンドのツール Yeoman を勘違いしていた
Yeoman を勘違いしてスルーしてたところもあったので、 改めてこんなメリットがあるんだーみたいなところを共有しつつ、 必要性を感じられる人が使い始める機会になれればと思います。 僕もこれからちょいちょい使っていきたいです。Read less
フロントエンドなサイト / アプリケーション・アセンブラまとめ | Pen
はじめに 最近非常に活発に開発されている、サイト/アプリケーション・アセンブラ(スタティック・サイトジェネレータと表現するものもあるようです)、ファイル・ジェネレータなどをまとめました。 これらのツールは、ファイル監視、Liveリロード、ビルドインサーバ、画像軽量化、パッケージマネージメントなど、サイトやアプリケーション開発に必要とするものをパッケージングしたものになります。 各ツール、もっている機能もバラバラであったり、用途も微妙に違うものがあったりしますので、ほんとは同じエントリー内でまとめるのも適切なのか悩ましいところだったのですが、大きなくくりでフロントエンド開発におけるジェネレータ系のツールという解釈のもとに行いました。 また、ほとんどのツールの説明はデフォルト値のもので、設定によって、例えばテンプレートエンジンの種類の変更や、ディレクトリパス、サーバのポート番号などを変更できた
Generators | Yeoman
GeneratorsHow to add your generator » Your generator will automatically show up in the list if it meets the following criteria. The list is populated every hour. Be published on the npmjs.org repository Have the following in the module's package.json file: The name should be generator-your-unique-name. This means it should begin with `generator-` and be followed by a unique (to npm) name. Scoped n
[Grunt]Yeomanで開発ワークフローを楽にしよう[bower] | DevelopersIO
※2013/5/14 Yoemanってスペルミスしまくってたのを修正 Yeoman(ヨーマン)とは LESS、Sass、compass、Coffeescript、TypeScript等々、クライアントサイドのWebアプリケーション技術は多様化しています。 Coffee ScriptやLESS等の拡張言語はコンパイルする必要がありますし、jsファイルはconcat/最適化/ミニファイすることも多いです。 ソースを修正するたびにいちいち手動でコンパイルしたり最適化するのは、本来注力すべき事象ではありません。 Yeomanは開発者がアプリケーション開発に注力できるよう、アプリのひな形生成からテストやコンパイル、ファイル最適化といったワークフローを提供してくれます。 Yeomanについてはここでも少しふれていますが、開発を楽に楽しくするためのツールが満載のようですね。 まずはYoemonについての
[日本語訳]Yeoman App Generatorsの書き方 - Qiita
はじめに Yeoman用の独自のgenerator作りたいなーと思っていたら丁度WRITING CUSTOM YEOMAN APP GENERATORSていうドキュメントがあったので訳します。適当に端折ったり言い換えているので、完全な詳細は原文を読んで下さい。 とりあえず感想だけ言うと「Yeomanはじまったな」です。あとでFirefox OSのアプリ(Open Web Apps)用のgenerator作るで。generatorはNode.jsで動くのでNode.jsで何か作った事ある場合は割と簡単に色々出来ると思う。 目次 このガイドはYeoman generatorシステムを使おうとしてる人を助ける為のものです。説明を飛ばしてもgeneratorの利用は出来ます。 導入 generatorのタイプ ボイラーテンプレートなgeneratorを作る アプリケーションの土台を生成するgene
![[日本語訳]Yeoman App Generatorsの書き方 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/9e3d7239c45bce7222cf1cc4ad650addf79fc86a/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fogp-background-1150d8b18a7c15795b701a55ae908f94.png%3Fixlib%3Drb-1.2.2%26w%3D1200%26mark%3Dhttps%253A%252F%252Fqiita-user-contents.imgix.net%252F~text%253Fixlib%253Drb-1.2.2%2526w%253D840%2526h%253D380%2526txt%253D%25255B%2525E6%252597%2525A5%2525E6%25259C%2525AC%2525E8%2525AA%25259E%2525E8%2525A8%2525B3%25255DYeoman%252520App%252520Generators%2525E3%252581%2525AE%2525E6%25259B%2525B8%2525E3%252581%25258D%2525E6%252596%2525B9%2526txt-color%253D%252523333%2526txt-font%253DAvenir-Black%2526txt-size%253D54%2526txt-clip%253Dellipsis%2526txt-align%253Dcenter%25252Cmiddle%2526s%253D3c5194b6821fb6a3a84b46c89601bcf5%26mark-align%3Dcenter%252Cmiddle%26blend%3Dhttps%253A%252F%252Fqiita-user-contents.imgix.net%252F~text%253Fixlib%253Drb-1.2.2%2526w%253D840%2526h%253D500%2526txt%253D%252540sys1yagi%2526txt-color%253D%252523333%2526txt-font%253DAvenir-Black%2526txt-size%253D45%2526txt-align%253Dright%25252Cbottom%2526s%253D3e60c60354849f31cdcfffaf47999ea2%26blend-align%3Dcenter%252Cmiddle%26blend-mode%3Dnormal%26s%3D6fa664cfa777709d5ca7ca03e466bd62)
Yeomanのあれこれ - Qiita
はじめに 僕はWebフロントエンドはほぼやってないんだけど、Firefox OSとかもアレだって事でソレ系にも手を出すかとあれこれやってたらまぁWebのフロントエンド周りのツールが何か色々あってよくわかんねーしどうしよっかなと思ってた所Yeoman辺りが大分良さそうなんじゃないか程度にはわかって来たので手を出してみた次第。 Yeomanってなに Webフロントエンドでよくある各種構成をコマンド一発で生成してやろうじゃん、というのがYeomanらしい。Yeomanは内部でyo, bower, gruntの3つのツールにわかれていて、Yeoman自身が作ってるのはyo。bowerはTwitter社が、GruntはBocoup社がメインで作っている。 ワークフローとしてはこうらしい yoでプロジェクトを作成し、bowerで依存性管理をし、gruntでビルド&テストをするという事だそうで。volo
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
generator-skyward
Phuse
Release the Kraken! Announcing Yeoman 1.0
つかってみよう！Yeoman 〜riaビルドツール超入門+α〜
つかってみよう！Yeoman 〜HTML5 Webアプリ開発を効率化するツールの紹介〜