サーバーサイドエンジニアこそAngular2をやるべきかもしれない – Heroデータを AWS Lambda+DynamoDB で取得する | DevelopersIO
サーバーサイドエンジニアこそAngular2をやるべきかもしれない – Heroデータを AWS Lambda+DynamoDB で取得する はじめに 私自身は普段サーバサイド（主にWeb API）の開発を行っているのですが、業務外でAngular2を触ってみたところかなり好感触だったのでブログにしました。この記事では、Angular2のTutorialを終えた状況から、データ取得部分をモックではなく外部サーバに置き換える例を示し、Angular2の考え方、サーバサイドとの連携方法について記録したいと思います。 Angular2をはじめたときの筆者の状況 フロントエンドスキルセット jQuery、CSSを利用したウェブページの開発経験あり とはいえ、アニメーションや色彩に明るいわけではなく、ほとんどWebアプリケーションフレームワーク任せ JavaScriptはDOM操作用の言語という考え
Angular2 RC4からRC5へのアップデート方法 - Qiita
Angular2 RC5が 2016/08/09 にリリースされました。 RC5の Changelogはこちら です。 今回のアップデートでは、Bootstrap部分に大きなBreaking Changeが入っています。 NgModule という概念が導入され、複数のコンポーネントやディレクティブをモジュールとしてまとめられるようになりました。 以下の様なシンプルなAngular2アプリを Angular2 RC4 から RC5 にアップデートしましたので、手順を残しておきます。 サンプルアプリ ページを3つ持つアプリ (Home, Products, ProductDetail) 画面上部に表示されたボタン押下でページ遷移する 画面構成は以下のとおり なお、RC4からRC5へのアップデート手順は、以下Angularの公式ページでも紹介されています。 npm packageのアップデート
Angular2のRouting, Formsの簡単なサンプル。ついでにFlux。(2.0) - Qiita
(追記)2.0に対応しました。(2016/09/15) Angular2の開発環境、俺ならこうやる 2016年7月25日版(2.0)のリポジトリを基本にしつつ、RoutingとFormsを簡単に理解できるようなサンプルを作りました。 今回のGitHubリポジトリ→ovrmrw/ng2-heroes-editor https://ovrmrw-ng2-heroes-editor-e87d0.firebaseapp.com/は実際にこのリポジトリをデプロイしたものです。 Routingの設定 ネーミングがわかりにくいのですが、今回のサンプルはPage1はHero List、Page2はAdd Hero/Edit Heroの構成です。 Page2に入るとき、idが渡されればEditing、渡されなければAddingと判断します。 公式チュートリアルのRoutingの章を読むと理解が深まります。
Angular Router : そのAPIとメンタルモデル、設計理念について | POSTD
(訳注：2017/02/16、画像、元記事がリンク切れしていたため修正いたしました。) 状態遷移の管理はアプリケーション構築の上でもっとも難しいとされる部分の1つです。URLに状態が確実に反映されなければならないという意味ではWeb上では特に難しいと言えます。さらに、アプリケーションを複数のバンドルに分けて要求に応じてロードする処理をする場合がよくありますが、これを透過的に実行するのは大変です。 Angular Routerはこのような問題を解消してくれます。Routerを使えば、アプリケーションの状態を宣言的に特定でき、URLに気を付けながら状態遷移を管理することができ、必要に応じてにコンポーネントをロードできます。この記事では、RouterのAPIについてだけでなく、背後にあるメンタルモデルと設計理念についても考察したいと思います。 では、始めましょう。 概略 Routerは何をするの
angular-cli + UIフレームワーク Angular2-Material で Angular2 アプリを構築するチュートリアル - Qiita
はじめに 本稿では Angular2-Material というUIフレームワークを導入し、Angular2 のアプリの枠組みを作るまでの手順を説明しています。 前提としてこの手順を進める前に node.js と angular-cli を入れておく必要があります。 node.js、angular-cli を導入するまでの手順は僕が先日書いた以下の記事 http://qiita.com/kent_ocean/items/f1a1d21fd9997cc5d6f8 をご参照ください。 Angular2-Material とは https://material.angular.io/ https://github.com/angular/material2 Angular2-Material で具体的にどのような UI が作れるのかは、下記ページの各リンクに図入りの解説が掲載されているので読んでみ
Angular2 + RxJS + Redux - Qiita
Angular2 + Redux でngrx/storeに注目していましたが、その周辺も充実してきています。 ng-confでも紹介されています。⇒こちら Angular2 + RxJS は本当にパワフルです。今後が楽しみです。 ngrx RxJSを使った、Angular2の拡張 すべて使ったサンプル example-app はなかなかキレイです。 store RxJSを使ったRedux風の実装 async pipeがあるので相性がいいですね。 最近v2になりmiddleware回りが変わりました。 ドキュメントやサンプルが充実しています。 Comprehensive Introduction to @ngrx/store 仕組みから簡単なサンプルまで解説してくれています。 https://github.com/btroncone/ngrx-examples Rudux公式のサンプルを作っ
NG-CONF 2016の雑な覚え書き - Qiita
Angular界隈における年に1度のお祭りイベント、ng-conf。今年(2016年)は5/4~5/6にSalt Lake Cityで開催されました。 現地には行っていませんが、ng-conf extend Tokyoというイベントに参加し、1日目と3日目のSessionをpublic viewing的に眺めてきたので、その覚え書きです。 1日目(5/4) Keynote 動画 Angular2の性能の話や周辺エコシステムの話など。聴きながら触ってみたい！と思ったのは下記： Augury AngularJS 1.xでいうところのBatarangle的なツール. 後述. Angular CLI Angular2の雛形プロジェクトや、componentのscaffoldingをしてくれたりするツール。後述. NativeScript 2.0 Mobile向けのプラットフォームであるNative
Angular2で簡単なSPAを作ってみた感想 - Qiita
angular2 の RC もリリースされたことですし、とりあえずどんなワークフローになるか知りたかったので簡単な SPA を作ってみることにしました。せっかくなので Material Design for Angular2 も使ってみました（執筆時点でまだ 2.0.0-alpha.5 granite-gouda ですが）。作ってみて現時点で思ったことを記しておきます。 申し訳ないですがあまりまとまりのない文章です！ 誤った記載などありましたらご指摘いただければすごくうれしいです ↓こんなの作りました(ソース) 概要 画面としては ログイン画面 ユーザー登録画面 ダッシュボード（投稿一覧） 新規投稿/編集画面 を作りました。サーバーサイドはMockの json-server を、特にカスタマイズせずに使ったので、ユーザー登録周りとかはただのハリボテです。 Material Design の
Angular2のDIを知る - Qiita
Injectする側 これをComponentでDIします。DIするにはComponentのprovidersプロパティにDIしたいクラスを指定し、コンストラクタでそのクラスの引数を取ります。 import {Component} from 'angular2/core' import FooService from "./fooService"; @Component({ selector: 'my-app', providers: [FooService], template: ` <div> <h2>Hello {{name}}</h2> </div> `, directives: [] }) export class App { constructor(private fooService: FooService) { this.name = fooService.say(); }
Angular2 Observables, Http, and separating services and components
Angular2 Observables, Http, and separating services and components February 16, 2022October 26, 2015 by Ken Rimple Tags: angular2, http, observables, RxJs, services Category: tutorial Ok, so you’re ready to roll up your sleeves and get something practical done with Angular2. Let’s take a look at how to get some data via the new Http service – it’s quite a bit different than the Angular 1 $http ser
Angular2の失敗しない始め方〜「ng-japan 2016」セッションレポート〜
Angular2の失敗しない始め方〜「ng-japan 2016」セッションレポート〜 仲 裕介（HTML5 Experts.jp副編集長） この記事は、「ng-japan 2016」のセッションレポートです。講演内容を再現していますが、ニュアンス等伝えきれない場合があるので、気になるところは、記事末尾に掲載の講演資料やYoutube動画でご確認ください。 Angular2の失敗しない始め方 / 稲富駿氏 株式会社トップゲートの稲富 駿氏によるセッションです。セッション資料や配信動画は記事末尾でご確認ください。このセッションでは、大きく3つの点について触れられました。それぞれのポイントを書き起こします。 Angular2に関するよくある質問や誤解について Angular2を構成する基礎技術について Angular2を学ぶために必要なこと 1. Angular2に関するよくある質問や誤解につ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Raible Designs | Testing Angular 2.0 RC1 Applications
Raible Designs | Getting Started with Angular 2.0 RC1
Raible Designs | Testing Angular 2 Applications
Raible Designs | Getting Started with Angular 2