Angular入門: Component/ServiceをTestまで含めて試す - Qiita
import { Component } from '@angular/core'; import {CounterService} from './services/counter.service'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'] }) export class AppComponent { point: number; constructor(private counterService: CounterService) { this.point = counterService.point.getValue(); counterService.point.subscribe((v) => this.p
Angular2のFormについて（その１） - Qiita
概要 Angular2とionic2でformを使った際に，バリデーションが少し面倒だったので，Angular2のformについて調べてみました．この記事は The Ultimate Guide to Forms in Angular2 を元にしています．元の記事は少々長いため，以下のように二部に分けて記事にします．うまく訳せていないところもあるので，元の記事はご自身で確認いただければと思います． なおionic2に関しては第２部の最後に，フォームのサンプルを書いてみたいと思います． 第１部 FormControl FormGroup FormBuilder バリデーション 第２部 カスタムバリデーション 変更をWatchする ngModelによる双方向データバインディング ionic2に組み込んでみる 第１部ではAngular2が用意するツールを用いてバリデーションを実装するまでを見てい
Angular-CLIチートシート - Qiita
@armorik83です。今回はangular-cliについてまとめます。 angular-cli https://cli.angular.io/ Prototype of a CLI for Angular 2 applications based on the ember-cli project. angular-cliはAngularの2.x以上（本稿ではAngularと記述する）を用いたアプリケーションの開発を補助するCLIツールである。 インストール インストールは至って簡単だ。 node_modulesのグローバル空間にインストールするため抵抗がある人もいるかもしれないが、その場合適宜工夫してもらいたい。基本的にコマンドラインツールとして使うので、筆者はあまり問題ないと考えているが、バージョン違いによる挙動の差異があり得るため、チームで運用する際はメンバー間でバージョンについて
React、Angularになじめなかった僕に手を差し伸べてくれたVue.js - Qiita
ギークハウス Advent Calendar 2016の12月２２日の記事です。 他の方とは、全然違う雰囲気になってしまいましたが、読んでいただけると幸いです。 なぜVue.js？？ 普段の仕事では、Ruby/Railsなので、フロントエンド周りは、jQueryにCoffeeScriptで片手間感覚... ↓ しかし最近のフロントエンド界隈は、良くも悪くも盛り上がっていて楽しそうだなあと思う日々。 ↓ いろいろ、ググって調べてみると、ES6、Babel、Reactふむふむ...🤔 ん？？ Webpack? JSX?? Flux?? Redux?? 「落ち着け！とりあえず日本語でOK」状態。。正にこの記事で書かれている状態そのものでした。 ↓ Reactとかでイケてるフロントエンド開発をちょっと試したいと思っても、BabelやWebpackの設定など環境構築でつまづき、肝心のアプリケーショ
Angular で template内補完やエラーチェックできるようになったよ - Qiita
どうも @Quramy です。 さて、今日も今日とてAngular + エディタ関連ネタです。そろそろAngular 2というと怒られるらしいのでAngularと書きます。 先に成果を見てもらうのが手っ取り早いですね。コイツを見れ。 見ての通り、Angular Componentのテンプレート中でプロパティ名補完とエラーチェックを行えるようにしてみました。 上図はVimのキャプチャですが、もし、これを読んでる貴方がVisual Studio Codeユーザーであるならば、これ以降は全く読まなくてよいです。https://github.com/angular/vscode-ng-language-service にVSC用のpluginが転がっているので、こいつを入れればいいさ。 今日の想定読者は、Emacs, Vim, Sublime Text あたりを使ってAngularのコードを書いて
安心して2017年を迎えるためのAngular最新動向チェック - Qiita
忙しい人向けのまとめ Angularは破壊的変更を含む可能性のあるメジャーアップデートを 半年に1回 に定めました 次のメジャーアップデートは3月1日予定です 諸事情により来年3月にリリースされるのはAngular 4.0.0です 2.xで書いてるものは基本壊れないから怯えないで あとAngular2 って呼ばないで！ Angular だから！ 時間がある人はここから読んでね どうも、lacoです。ng-japanの代表とかやってます。 さて、2016年はAngularコミュニティにとって、とても重要な激動の1年になりました。去年の今頃からは考えられないほど状況は変化しました。日常的に動向をウォッチしている筆者でさえ突然の大本営発表に驚くことが何度もありました。しかしその結果、無事にAngularは2.0のFinalリリースを迎えることができて、ようやくコミュニティとエコシステムが軌道に乗
Dockerを使ってMacでもWindowsでもコマンド一発で動作するAngular開発環境を作る話 - Qiita
こんにちは、@yusuke_yasuoです。 Angular Advent Calendar 2016の9日目は、Dockerを使ってMacでもWindowsでもコマンド一発で動作するAngular開発環境を作る方法について書きたいと思います。 また今回は範囲外ですが、CI・CD周りも整備していきたいため、Angular CLI (https://github.com/angular/angular-cli) を使って開発してみました。 Docker使う理由 今回のDocker利用には主に2点ほど理由がありました。 社内にMac派とWindows派がいるため、環境が違うことによって起こる問題の吸収 今後メンバーが増えていく予定があるため、環境構築時間の短縮 今回のゴール Angular公式サイトのTUTORIAL (https://angular.io/docs/ts/latest/tut
Angular 2アンチパターン集 - Qiita
@armorik83です。Angularアドベントカレンダーの4日目となる本日は、かつて好評だった拙記事"AngularJSアンチパターン集"にあやかって、Angular 2（以下、単にAngularと表記したときは2.0以上4未満を指す）について気をつけた方がよい点――アンチパターンをまとめたいと思います。 Angular 2.xでアンチパターンは起こりうるか Angular 1系とは大きくAPIが変わったAngular 2系。APIが大きく変わった理由として、Web標準により近い構成を取れるようにする目的がありました。例えば、angular.module()ではなくTypeScriptのimport fromをベースとするソース分割の仕組みであったり、ES2015 classを標準としたComponentやServiceの定義であったり、$qではなく標準のPromiseを使ったりなどで
Reactへの雑感（学習コストが低いという評価と大規模化のメリット） - Qiita
ReactとAngularの比較への評価について ReactはAngularよりも評価が高いという記事を見かけることが多い。実際、それはプログラマ個人の評価もあるだろうし、使い方などにもよると思う。 また、ReactとAngularについての比較に対して以下のような指摘がなされる。 ReactとAngularは実はSPAフレームワークとして名前が挙げられるが、ReactはAngularのようにフルスタックのSPAフレームワークではなく、ビュー（もしくはビューモデル）の機能を提供することに特化している。 つまり、ReactとAngularは持っている機能や役割が異なるので一概に比較することは難しいと言われることがある。両者を触れば確かにそうだと実感すると思う。 そして、このReactの限定的な役割こそ、Reactを習得したり、使ったりする時に大事な点だと思う。 学習コストが低いのか？ 少なか
Angular2でHello world！ - Qiita
この先作る予定のWebサービスはRIAにしたいので、今後作る勉強用サンプルもどうせなら何かRIA向けのJSフレームワーク使いたい。 とゆうわけでAngular2を触ってみます。まずはhello world。 今回の記事は英語版Angular2のクイックスタートページ の内容とほぼ同じです。 そんな記事を載せる価値があるのか？とも思いましたが、世の中にはドキュメントが英語なだけでやる気を無くす人も居るに違いないと思い、ソースの99％を転載した記事を書いていました。 より最小化したコードにしてもよかったのですが、Angular2の知識がロクにない状態で間違った情報を発信してしまうリスクもあるため止めました。 今回やりたいこと Angular2で「hello world」を表示してみる。終わり。 環境 Microsoft Surface Pro4 (i5 2.4GHz, Mem 4GB) OS:
脱Angular初心者 - 次に進むための設計、コーディング - Qiita
Angular 2 入門者の会 Oct 3, 2016 / レバレジーズ株式会社 初めてスライドモード使ってみる armorik83 はちさん ng-kyoto代表 / ng-japanスタッフ Twitter: @armorik83 GitHub: @armorik83 Angular 2.0.0 released! みなさん、安定版なのでもちろんプロダクションに使っていきますよね？ まだHeroとかTodoしか作れない？ 脱初心者してこ💪 ここでの初心者の定義 あらゆる問題に対して、解決方法が分からない 解決できず挫折 抱えきれず破綻 APIを知らない = 初心者ではない いくらでも調べればいい 調べ方が分かっているなら、知らなくてもいい ※ 知っているに越したことはない 中級者へ進む方法 あらゆる問題に対して、一つ一つ適切な解決法を知る 解決法の根拠を理解する 初心者あるある 1.
Facebook製のJavaScriptテストツール「Jest」の逆引き使用例 - Qiita
はじめに みなさん、日頃JavaScriptのテストはどのように行っていますか？ 昨今ではAngularJSやReactJSを始め、JavaScriptのフレームワークやライブラリを使用してのフロントエンドの開発が当たり前のようになってきております。 ではそのフロントエンド、JavaScriptのテストはどんなツールを使っていますか？ mochaやpower-assert、chai、Karma、Jasmine等を組み合わせて使用してテストしているでしょうか。 前置きが少し長くなりましたが、Facebookが開発したオールインワンな「Jest」というツールのReactでのHowto的な使い方から実際のテストでの使用例を交えて紹介したいと思います。 ちなみにこのJest、最近リリースされて話題になったパッケージ管理のYarnでも使われています。 対象バージョン Jest:22.0.4 Reac
Walts - Angular 2向けFluxライブラリを作った - Qiita
この度、Waltsというライブラリを開発した。ウォルツとも読めるが、ここはワルツと呼んでもらいたい。View -> Action -> Store、この三角の動きを三拍子に見立てて名付けたものだ。 crescware/walts 数々の検証や他のライブラリの知見を経て開発に着手したのが、Angular 2用を意識して設計したFluxライブラリ"Walts"である。他のライブラリの知見や昨今のFlux事情については前日の記事にて綴ってある。 これは2016年4月に開発を始めており、それまでに私が経験してきたフロントエンドの難点や当時の案件の問題点、反省点などを数多く活かしたものとなっている。Almin.jsとも開発時期が近いようだが、全くあずかり知らぬところで開発しており、結果的にはAlmin.js側が先出しになったのでそちらも参考にしている。 DDD, CQRS, Redux, RxJS,
Angular CLIによるAngular2入門 / Angular2アプリを爆速開発 - Qiita
ついにリリースされましたね、Angular2! Angular2にはCLI(command line interface)の開発環境が整えられており、雛形の自動生成、更新ファイルを自動ロードするなど、爆速な開発が可能になっていることをご存知でしょうか。 このAngular CLIを導入するだけで、様々な開発環境が一気に整います。そのため、gulpだgruntだ、TypeScriptだと様々な環境を整える必要があった今までの開発スタイルが一気に変わる可能性があります。 以下では、Angular CLIを使って共通ロジック[MessageService]からテキストを取得して、そのテキスト表示する画面部品、[HelloComponent]を持ったアプリを作りたいと思います。サービスやコンポーネントを使うのでAngularでの開発のおよその骨格を感じ取っていただけると思います。 では、Angul
ReactとAngular2の選択で迷ったときに考えたいこと - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? まえがき 最近社内でLT大会がありまして、Angular2について発表したのですが（正式リリース直前でしたが）、結構内容的には、React vs Angular2みたいな内容になってたので、『（私が）ReactとAngular2の選択で迷ったときに考えたいこと』としてちょっと記事にしてみました。 ※1 この記事はあくまで両者を触ってみた『個人的な感想』になりますのであしからず。 ※2 そして、この記事は2016-09-18の時点での内容になります。 Reactはライブラリ、Angularはフレームワーク Reactが出始めた頃にはよく比
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
angular2のtemplate tagも使ってあげてほしいなーという話 - Qiita
ReactユーザーのためのAngular2ファーストステップ - Qiita
TypeScript 2.1のkeyofとかMapped typesがアツい - Qiita
Auth0 + Angularで認証機能をお手軽に実装しよう - Qiita
Angular 2でのHTML要素の属性・プロパティの書き方を使い分けよう - Qiita
