ロジックを画面から分離できる「Angular 2」のサービスと依存性注入
はじめに Angular 2はGoogleとオープンソースコミュニティで開発されているJavaScriptフレームワークで、従来のAngularJS（AngularJS 1）の次期バージョンです。2016年9月に正式版がリリースされ、本格的に利用できる環境が整いました。Angular 2はAngularJS 1に対して多くの変更点があり、コードの記述法も基本的に異なります。 前回記事では、Angular 2のWebページを構成する要素である、コンポーネントやモジュールについて説明しました。これらを利用すると、実装を分割して互いの影響範囲を限定することができます。 しかし、ログ出力のようにさまざまな箇所で使われる処理や、ビジネスロジックのような画面から独立した処理は、独立して実装した処理を、後から追加できれば便利です。Angular 2ではこのような機能として、独立した処理を実装する「サービ
ReactとAngular2の選択で迷ったときに考えたいこと - Qiita
まえがき 最近社内でLT大会がありまして、Angular2について発表したのですが（正式リリース直前でしたが）、結構内容的には、React vs Angular2みたいな内容になってたので、『（私が）ReactとAngular2の選択で迷ったときに考えたいこと』としてちょっと記事にしてみました。 ※1 この記事はあくまで両者を触ってみた『個人的な感想』になりますのであしからず。 ※2 そして、この記事は2016-09-18の時点での内容になります。 Reactはライブラリ、Angularはフレームワーク Reactが出始めた頃にはよく比較されることの多かったAngularですが、それは両者が似たような時期に盛り上がってきており、それでいてDOM周りの問題解決で謳っている機能がそれぞれちょっとずつちがっていたからかなと思っています。（それぞれDOMの構築とデータバインディングについての機能を
TypeScript + SystemJS + lite-serverでさくっとHello, World!する - Qiita
Angular2のチュートリアルをやり、tscとSystemJSの組み合わせは、TypeScriptで実験的なコードを書くには良いと感じた。 なるだけ最小構成で動かすために試したらこうなったので、メモとして残しておきます。 環境構築 とりま npm init
NgModule導入について · Angular Info
どうも、らこです。RC.5のリリースがおそらく来週と迫っていますが、多くのバグ修正と共に新しい機能が追加されます。 NgModuleはこれまでのAngular2で不便だったこと、複雑だったことを一気に解決してくれる新機能です。 RCも大詰めとなったこのタイミングで導入されることに困惑するかもしれませんが、 ぜひとも対応してもらいたいと思います。 はじめに NgModuleは完全に新しく導入されたAPIであり、既存のAPIへの破壊的変更ではありません。 ただし、従来の方法は非推奨となり、stableリリースの段階では廃止される予定です。 RC.5からは移行期間に入るものと思っていてください。 NgModule NgModuleの概要についてスライドを作ってあるので、これをベースに解説します。 NgModuleの概要 NgModuleは、ディレクティブやパイプ、サービスなどをひとまとめにしたモ
tscとlite-serverで作るシンプルなTypeScript開発環境 - HIDARI日記（右）
最近MacでカジュアルにTypeScriptを書いてブラウザで確認したいなってときに使っている環境です。 ぶっちゃけAngular2の 5 Min Quickstart で使われている方法ですが。 （なお、前提としてnode.jsをインストールしてnpmを使えるようにしておく必要があります。） 使用するツールはTypeScript(tsc)の他には lite-serverという開発用のhttpサーバだけです。 上記二つを使って、[TypeScript書く] > [自動ビルド] > [ブラウザの自動リロード]を実現していきます。 まず、実験用のディレクトリを作ってTypeScriptをインストールしておきましょう。 mkdir my-proj cd my-proj npm install typescript これでTypeScriptをコンパイルするコマンドtscが使えるようになります。
Angular 2をさわってみたので、参考になったサイトをまとめる。 - redwarrior’s diary
とあるシステムを作り変えることになって、現在のシステムの解析や、システムの使われ方の聞き取りなどタスクが割り振られる中で、アーキテクチャの検証タスクになり、Webアプリによる実装の検証担当になり、Anugular2をさわってみたので、参考になったサイトなどをまとめる。 本 JavaScriptoon2 最初に読んだのがこれ。概要がわかりました。残念ながら、ソースはそのままでは動作しなくなっていました。いくつかのサイトを読んでみましたが、まだSystemJSを使用してローカルでの確認はできていません。 サイト qiita.com このサイトを見ながらやることで「Hello World」を動作させることができました。 hono-design.seesaa.net わからないながらも、Angular2カテゴリを一通り読みました。 qiita.com 一通り目を通した後、ほかのサイトを読んでいて気
Angular入門！ゼロから始めたぼくの勉強方法
[aside type=”boader”] この記事は内容が古くなっています。 2018/01/16現在（v5時点）のAngular入門の最適な方法は、ぼくが熟考を重ねて作成したはじめてのAngular入門コースを受講することです。 このページ以上に効率的に入門できるので、ぜひ受講を検討してみてください！ そして朗報です！ 数量限定のスペシャルクーポンを用意しました。 動画コンテンツで効率的に学習してみてはいかがでしょうか。 次のリンクからのみ有効ですので、お早めにどうぞ。 【クーポン適用】【最新v5対応】はじめてのAngular入門 実践シングルページアプリケーション（SPA）構築 [/aside] ぼくは今までAngularJSを使ったことがなかったんです。 でも最近Angular2を使い始めて、なんとなく理解できるようになってきました。 巷では、Angular2が採用している技術は、
ui bootstrap for angular 2 - AngularJS Advent Calendar 2015 - albatrosary's blog
AngularはCSSなコンポーネントは用意していません。なのでBootstrapやUIkitなどのCSSフレームワークを利用するとさくっとそれなりのUIが作れます。ただこうしたCSSフレームワークで定義されているイベント(JavaScriptで書かれた部分)との連携には一工夫必要です。カスタムディレクティブを作ればいいのですがAngular用のBootstrapもあるので利用すると良い。それがUI Bootstrapです。このエントリーは「AngularJS Advent Calendar 2015」12月9日の記事です。 angular-ui.github.io Bootstrap Bootstrapは今のバージョンではv3ですが、アルファ版でv4の開発も行われています。 v4-alpha.getbootstrap.com UI Bootstrap for Angular1 提供されて
Angular2で簡単なSPAを作ってみた感想 - Qiita
angular2 の RC もリリースされたことですし、とりあえずどんなワークフローになるか知りたかったので簡単な SPA を作ってみることにしました。せっかくなので Material Design for Angular2 も使ってみました（執筆時点でまだ 2.0.0-alpha.5 granite-gouda ですが）。作ってみて現時点で思ったことを記しておきます。 申し訳ないですがあまりまとまりのない文章です！ 誤った記載などありましたらご指摘いただければすごくうれしいです ↓こんなの作りました(ソース) 概要 画面としては ログイン画面 ユーザー登録画面 ダッシュボード（投稿一覧） 新規投稿/編集画面 を作りました。サーバーサイドはMockの json-server を、特にカスタマイズせずに使ったので、ユーザー登録周りとかはただのハリボテです。 Material Design の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Code School: Accelerating Through Angular
Dave Ceddia
Angular
Angular powered Bootstrap