Angular 2 の特徴を美味しいところだけ凝縮してお届けします
Angular 2 の特徴を美味しいところだけ凝縮してお届けします
こんにちは、@armorik83です。 明後日2015年3月21日はng-japanですね。私も出席します。500名の参加枠はすでにキャンセル待ちとなっています。ng-japanは日本初となるAngularのカンファレンスで、これに先駆けて先日3月5-6日にng-conf 2015が開催されAngular 2の様子が更に明らかになったことから、期待のカンファレンスと言えます。(TypeScriptの@vvakame先生もスピーカとして登壇されます! これは楽しみだ!) 今回は、2日後に控えたng-japanのための予習として、angular/angularリポジトリに公開されているDocsをゆるく翻訳していきます。時間的制約のため、忠実な翻訳ではないことをご了承ください。誤りがあれば指摘してください。 2015年3月19日現在、参照したcommitはe0710c4613#です。 READM
今はやりのMEANスタックについてまとめてみる(Mongo, Express, Angular, Nodeで作るWEBアプリケーション) 海外でじわじわ人気を獲得し始めている うわさの「MEANスタック」とはなにか? まとめてみました。 MEANとは 合わせて読みたい M = MongoDB 従来のRDBMSとは異なる、NoSQLというデータベースシステムによる ドキュメント指向型データベース。 MongoDBについてまとめてみた E = Express Node.jsの軽量Webアプリケーションフレームワーク Expressについてまとめてみた Expressを学ぶチュートリアル形式の記事・コンテンツまとめ A = Angular オープンソース(MITライセンス)のJavaScript用 MVCフレームワーク。 Angularについてまとめてみた Angular JSの良質チュートリア
ちょっと面白そうだったので、勉強も兼ねてごにょごにょやってみました。 #参考サイト [mean.io] Mac OSX Yosemite に mean.io 環境を構築 - Qiita その中でハマったというか、躓いた部分を書き出していきます。 エラーのキャプチャとか取るの忘れていたので、覚えてる部分だけ。。 ※ちなみに環境はMac OS X MEANとは? MEANスタックとか言ったりしますが、 M→MongoDB(NoSQLの1種) E→Express(Node.jsのフレームワーク) A→Angular.js(JavaScriptのフレームワーク) N→Node.js(サーバーサイドで動くJavaScript) の頭文字を取ってMEANと呼びます。 LAMPとかXAMPPとかと同じような感じです。 NoSQLとは? リレーショナル・データベースと違って、問い合わせ言語のSQLが使えな
最近とある案件で Angular.js を使い始めたのですが。 どうにもRailsと相性がそこまで良くないというか、2つの世界をCoCで繋ぐ決定的なgemなどが出てきていないからか、不便さを感じます。 そんな中で、特に不便に感じたのが、form_for がロクに使えないことでした。 $ rails g model post title:stringみたいなモデルを想定してください。 愚直にやると、Angualr.jsで非同期にPOSTする時のformは、こんな感じになってしまいます。 # slim記法の例 div 'ng-controller'=>'PostCtrl' = form_for(@post, html:{ 'ng-submit'=>'submit()' }) do |f| = text_field :title, 'ng-model' => 'post.title' = but
前回: Angular.js入門 (3)フィルタ 次回: Angular.js入門 (5)ディレクティブ その2 今回はいよいよangular.jsの肝とも言えるdirectiveについてです。ディレクティブという単語自体が日本語として馴染みが無いのもありますし, 実際になかなか複雑な機能なので理解が進まないところもあります(^ω^;) filterと同様自分でカスタムのdirectiveを作ることもできるのですが, Angular自身も標準directiveを持っています。まずはこちらを使って何ができるのかから見て行きましょう。 はじめてのDirective var app = angular.module("myApp", []); app.directive("test", function () { return { restrict: "E", template: "<div>こ
<!doctype html> <html lang="en" ng-app> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h1>{{hello}}</h1> <input type="text" ng-model="hello"/> </body> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.6/angular.js"></script> </html> scriptタグでAngular.jsを指定しています。今回は1.3.0のベータ版を入れていますが, 好きなバージョンを公式サイトのDownloadからCDNのリンクから入手可能です。 https://angula
AngularJSを利用したのなら、絶対にKarmaとか Protractorを活用すべきです。ちゅうか、活用しなさい。と言いたいです。システムを保守フェーズに安定的にメンテナンスするならそう考えるのがふつうになるべき。 (※Protractorについては、こちらの記事がとても参考になります) 例によって「Mastering web application development with AngularJS」を読んで書かれていたポイントを読んだ感想をこちらにまとめてますが、 2章のテスト解説部分に下記の文章があります。 There is a quote saying that writing code without a Version Control system (VCS) is like skydiving without a parachute. Today one would
会社でAngularJSをわっしわっし使ってみて、そろそろ某かの意見を言えるようになったのではないか?と思ったので、推薦記事を書いてみます。AngularJSマンセー! 一般のAngularJS解説記事はまぁ巷にそれなりに出回っていると思うので、僕の周りに蔓延る混沌Androidクラスタ向けの説明記事を書いてみようと思います。 というわけで、AngularJSをAndroid用語を駆使して説明します。正確さはあまり気にしません。 読者に要求されるもの Androidについての基本的な知識 JavaScriptやHTMLなどに対する基本的な知識 参考 わかめのAngularJSはてブ AngularJSってなに? AngularJSはGoogleが作成しているWebアプリのクライアント側用フレームワークです。 遠い仲間としてBackbone.jsが、近い仲間としてKnockout.jsやFl
長文注意。 angularjsについて今更ながらに触り始めて色々と感動したので纏めておく。 angularjsがどういったフレームワークかは公式のチュートリアルを眺めてたらぼんやりと把握できると思うので今回その辺の話はあまり触れない。 http://angularjs.org/ angularjsのAPIについては公式のドキュメント含めて様々なメディアやブログに取り上げられているが、導入から体系的に語られてるものはあまり無い印象だったので、僕のブログでは導入から具体的な目的に沿った実装方法を紹介していこうと思う。 ちなみに自分のangularjsへの理解も触り始めて一週間程度なのでだいぶ甘い。 angularjsを一週間やってみた感想 最初の2日くらいがだいぶつらい。 飲み込みが早い人ならすぐに使いこなすのかもしれないが、angularjsはdirective, controller, f
Angular.jsを何度か仕事で使ってみて、Angular.jsを使う場合のアーキテクチャはMVCじゃなくてMVVMにしたほうが良いなと思った話を書く。 Angular.jsをMVCフレームワークだと勘違いしていた 少しAngular.jsについて今まで勘違いしていたことがあって、Angular.jsではコントローラを定義できるのでてっきりMVCアーキテクチャで作るものとばかり思っていた。 公式ウェブサイトのタイトルをよくよく見てみると、「Superheroic JavaScript MVW Framework」と書いてある。MVWのWってなんだよとか思ってたらWhateverの略で、要するにMVCでもMVVMでもなんでも良いということらしい。 MVCで組んで困ったこと 勘違いが解ける前は、普通にMVCフレームワークとしてAngular.jsを使っていたけどもそれで何が困ったかというと、
AngularJS has been instrumental in changing the way I develop web applications. From building imperative views where both business logic and user interaction live, to separate controllers and directives that handle both requirements respectively. From sharing components through jQuery plugins, the usual common denominator, to sharing components through declarative HTML. From reacting to model chan
An AngularJS Style Guide for Closure Users at Google This is the external version of a document that was primarily written for Google engineers. It describes a recommended style for AngularJS apps that use Closure, as used internally at Google. Members of the broader AngularJS community should feel free to apply (or not apply) these recommendations, as relevant to their own use cases. This documen
dangle.jsって何物? dangle.jsは、↓なJavaScriptライブラリ. - d3.jsによるグラフ描画をangular.jsのディレクティブとして提供している. - elasticSearchのブラウザ向け可視化用として開発されたらしい. 準備 必要な.jsは下記. <script src="bower_components/angular/angular.js"></script> <script src="bower_components/d3/d3.min.js"></script> <script src="bower_components/dangle/dist/dangle.min.js"></script>
現在開発担当している AbemaTV で、昨年末にパナソニックさんのスマートテレビ VIERA 向けにアプリケーションをリリースしました。AbemaTV リモコンボタンで AbemaTV にアクセスできます。今回このアプリケーションの UI を開発するにあたって、新しいデザインワークフローを導入しました。 本記事では、 Story-Assured Design というデザインワークフローを、現在プロダクト開発で直面しているデザインの課題とともに紹介します。 Story-Assured Design とは? Story-Assured Design はその名前が示しているように、ユーザーストーリーを保証することを目的とした UI デザインのワークフローです。UI デザインを3つのステップに分けて行います。 ストーリーデザイン デザインの構造化 視覚情報デザイン 一番重要なユーザーストーリーの
Publish Early, Publish Often Path There are many paths, but the one you're on right now on Leanpub is: Recipes-with-angular-js › Read READERS Newsletters Weekly Sale Monthly Sale Store Home Redeem a Token Search Support Leanpub FAQ Leanpub Author FAQ Search our Help Center How to Contact Us FRONTMATTER PODCAST Featured Episode Episode List MEMBERSHIPS Reader Memberships Department Reader Membershi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く