今回はAngular CDK(Component Dev Kit)の Portal 機能を使って、ローディングラッパーコンポーネントを実装する例の紹介です。 Angularの基本的な書き方はわかっている前提の内容になります。 ローディングラッパーとは次のようなテンプレートで、ローディン…

Patreonという、個人を金銭的に支援できるサービスに登録して、投げ銭を受けられるようにしました。 www.patreon.com 簡単に$1〜の少額を毎月支援できます。いつでもキャンセルできるしクレカで払えるし気軽。 きっかけはこの記事 jp.techcrunch.com Patreon…

AngularコアチームのStephen Fluin氏が、こんなブログ記事をあげている。 https://fluin.io/blog/property-has-no-initializer-and-is-not-definitely-assigned TypeScript 2.7から導入された、クラスプロパティの初期化をチェックするstrictPropertyInitial…

js-primerというJavaScriptの本を書く上でES2015のimport/export構文の仕様について気になったところがあって調べたメモ github.com import - JavaScript | MDN https://t.co/qF0RdE0PfXデフォルトエクスポートをdefaultって名前付きエクスポートのように参…

こんにちは、lacoです。 Angularの次のマイナーアップデートで、久しぶりに新機能らしい新機能が増えます。 その名もRouter Scrollerです。 長くAngularを使っている人には涙が出るほど嬉しい待望の機能です。 この記事ではRouter Scrollerの紹介と、来週のb…

最近落合陽一氏の本を数冊読み、あっさりとファンになってしまった。 おそらく彼の思想や野望に触発されたんだろうと思うが、その理由を自己分析してみるメモ書き。 落合氏は一貫して「日本」という国をベースにしている。 彼のスキルがあれば日本にこだわら…

この記事ではAngularDart/Flutterの文脈で新しいコンポーネント設計パターンとして広まりつつあるBLoCパターンを、Angularの語彙で理解し、実装する方法を紹介する。 BLoCパターンとは BLoCとは、Business Logic Componentの略である。 BLoCを使ったアプリケ…

ここ数年で一番好きな映画は「マネーショート」（原題 "The Big Short") だ。 マネー・ショート華麗なる大逆転 (字幕版)発売日: 2016/06/22メディア: Amazonビデオこの商品を含むブログ (7件) を見る 映画館でも2回観たし、Netflixにあったから頻繁に見てた…

常に危機感がある。これは自分が博士号も修士号も持っておらず、第三者から観測可能な価値を持っていないどころか、コンピューターサイエンスの教育を受けたことがないくせにソフトウェアエンジニアとして専門職に就いて生計を立てているのが根底にあるかも…

Webにかぎらず、アプリケーションというのは作って終わりではなく、その後も継続して改修・改善されていくケースが多い。受託で開発して納品して終わりというケースでも、納品した先にメンテナンスする人がいる。 この記事では、Angularアプリケーションの開…

Angular 2から6までの主要な進化をまとめた記事を読みたい。— Masahiko Sakakibara (@rdlabo) 2018年4月20日 逆にIonicの変遷が知りたいですね 最近Stencilも出てきたしその辺の絡みとか俯瞰的に見てみたいです— lacolaco (@laco2net) 2018年4月20日 rdlabo…

私事で大変恐縮ではございますが、 結婚しましたことを ここにご報告いたします。 結婚したからといって ソフトウェアエンジニア・lacoの活動やスタンスには特別な変化はございません。 歳を重ねても、環境が変わっても、結婚しても、 私は私！ ですので、こ…

Shadow DOMのHayato Itoさんと、Custom ElementsとEventTargetについてちょっと議論できた話。（ありがとうございました！） 先日、Web Components Cafeで登壇しました。 slides.com 最近自分の中でCustom Elementsの盛り上がりが強くて、 単純なPresentatio…

lacolaco.hatenablog.com 「レールに乗っておいたほうがいいんじゃないの？」という声もあるとおもうので、 そもそもなぜAngularはHTTPクライアント機能をスタックとして提供しているのか、というところについて。 AngularJSには$httpが必要だった 遡ってAng…

題して「頼りすぎないAngular」ということで、Angularの層をなるべく薄くアプリケーションを作るにはどうすればいいかというのを考えるシリーズです。 Angular良さそうなんだけどロックインされて捨てにくそう、という人々向けに、コードのモジュール性とフ…

lacolaco.hatenablog.com 以前に紹介した「ファスト＆スロー」の上巻に続き、勢いで下巻まで読み終わったので、下巻の方の感想を書く。 タイトルは下巻の中で最も強く心に残ったフレーズ。 ファスト&スロー(下) あなたの意思はどのように決まるか? (ハヤカワ…

Double O というサービスがWeb ComponentsやPWAなどアグレッシブにWeb技術を取り入れていて応援したい気持ちなので、まずはユーザーとして使っていこうと思います。 ooapp.co 「よくある質問」がDouble Oの公式アカウントとして運用されてるの面白いですね h…

僕がAngularアプリケーションを書くときに頻出する実装パターンを紹介する記事です。続くかどうかは未定です。 onDestroy$ ngOnDestroyメソッドが呼び出されたタイミングでemitされるEventEmitterを作っておき、RxJSのtakeUntilパイプなどで使う実装パターン…

Angularフレームワークのv6.0.0リリースにあわせ、Angular CLIもv1.7系からv6.0へメジャーアップデートをおこなう予定です。 この記事ではAngular CLI v1.7系で作成した開発環境からv6.0系の開発環境へマイグレーションする方法を解説します。 この記事は安…

今日はGraphQLのクエリのスキーマを考えてた いろんなデータが関連していて、原理的にはどんな入れ子の順番でも解決はできるんだけど、基本的にはデータの寿命が短い順に入れ子になっていくのが良さそうな気がする。 user { organizations {} } はユーザーの…

ファスト&スロー(上) あなたの意思はどのように決まるか? (ハヤカワ・ノンフィクション文庫)作者: ダニエル・カーネマン,村井章子出版社/メーカー: 早川書房発売日: 2014/06/20メディア: 文庫この商品を含むブログ (30件) を見る これは読書感想文です。ダニ…

3/24に、MANABIYAというカンファレンスイベントで登壇してきました。 manabiya.tech 当日のスライドはこちら。発表タイトルは「The Angular World」で、Angularの現在と未来、あとWebの世界との関わりについて話そうと思ってました。 内容はだいたいスライド…

「えーマジ現金！？キモーイ」 「現金が許されるのは諭吉までだよねー」 「キャハハハハハ」 ―2020年、マックの女子高生 話 昨日開催した ng-sake #11 にて、実験的にKyashを使って参加費を集めてみました。 ng-sake.connpass.com 結果 自分を除いた参加者18…

lacolaco.hatenablog.com ngIvyのSeparate Compilationについてのプロポーザルを読み、実装中のRenderer3のコードを読み、ベータ版のcompilerが生成するコードを読み、毎晩毎晩考えを巡らせた結果、ngIvyについてある程度体系的な理解が得られたという錯覚が…

まずご存じない人のために紹介しますが、Angular CLIの使い方について解説する「Angular CLIがわかる本」という電子書籍を、Leanpubというプラットフォーム上で販売しています。 leanpub.com 経緯やモチベーションなどについては過去記事を読んで下さい。 la…

angular/separate_compilation.md at master · angular/angular · GitHub 日本語訳しながらngIvyの設計を理解する。 読んだ。要点だけまとめると以下。 Angular 6.0ではIvyという新しいコンパイラが導入される IvyはAngular 5.0 (Renderer2) における分離コ…

追記: 最新では scope が providedIn に変わってます。 github.com Angular v6では、これまでのDependency Injectionの仕組みをTree-Shaking可能にするためのオプション機能を追加します。 概要を説明するために簡単なスライドを作りました。 現状の問題 現…

github.com Angular CLIが依存するwebpackのバージョンを4系にアップデート。 github.com @angular/common が提供するパイプで使われている関数を公開APIとしてエクスポートする変更。 NumberPipeやDatePipeの変換処理をテンプレート外で使えるようになる。v…

lacolaco.hatenablog.com ^の続きです。 前回はglobとfsを使ってschema/**/*.gqlファイルを結合し、graphdocを使ってドキュメンテーションページを生成する記事を投稿しました。 まったく同じ目的のために merge-graphql-schemas というnpmパッケージがあっ…

GraphQLのSchemaから静的なドキュメンテーションページを生成するツールとして、graphdocというものがあります。 github.com GraphQL Schemaを渡すと、こんな感じのHTMLを生成してくれます。 これはGraphQL公式のサンプルにもあるStar Wars APIの例。 https:…