Angular

Angular で Storybook を使うための手順まとめ

Angular で Storybook を使いたい Angular で作られているプロジェクトに、Storybook を導入する手順をまとめます。 Storybook for Angular 上記ページの手順に従えばOKです。 Storybook とは Storybook とは UIコンポーネントのカタログを作るためのツールです。各コンポーネントの状態に応じた表示が確認できるようになります。 アプ […]

Angular サーバーサイドレンダリング を Firebase Cloud Functions で動かす

Angular でサーバーサイドレンダリング Angular でサーバーサイドレンダリングを行う方法をまとめます。 基本 この記事 を参考にしていますが、うまくいかない個所もあったので、備忘録がてらやり方をまとめておきます。やり方も少しだけかえています。 Firebase を使ってサービスを構築する予定だったので、サーバーサイドには Firebase Cloud Functions を利用します。 […]

Ionic+FirebaseでGoogle認証ログインをする方法

IonicでもFirebaseでSNS認証がしたい IonicはAngularが使われているので、AngularFireを使って普通に認証処理を書くことができます。ionic serve で動かして問題なくよしよし、と思っていたのですが予期せぬ自体が発生しました。 実機でも動かしてみようと思って手持ちの iPhone にインストールして動かしてみると動かない … 。いろいろ調べてみると […]

Angular で Firebase Authentication を使う方法(angularfire2)

Angular と Firebase Angular も Firebase も Google が提供する人気のライブラリ・サービスです。 Angular の開発で Firebase をバックエンドに用いる場合、Firebaseのライブラリをそのまま使うのではなく、Angularから利用するFirebaseに特化した AngularFire というライブラリを使います。 GitHub – […]

Angular で FirebaseUI を使う方法(angularfire2)

Firebase UI とは Firebase で 認証処理を実装する場合、Authentication という機能を使います。自分でライブラリ空手帰郷される各機能と独自に作成するUI(HTML)を用いて実装する方法のほか、Firebase UI という Firebase で用意されているUIを利用する方法があります。 firebase入門 ユーザー認証を行う方法まとめ │ Web備忘録 上記記事 […]

Angular で Firestore を扱う方法(angularfire2)

Angular と Firebase Angular も Firebase も Google が提供する人気のライブラリ・サービスです。 Angular の開発で Firebase をバックエンドに用いる場合、Firebaseのライブラリをそのまま使うのではなく、Angularから利用するFirebaseに特化した AngularFire というライブラリを使います。 GitHub – […]

[Angular] ng-containerでレンダリングされないダミーの空コンテナを作る

複数の要素をラップする空のダミー要素を作りたい Angular では ng-container というコンポーネントを使うことで、HTMLにレンダリングされない要素を書くことができます。これを使うことで、複数の要素をにラップするコンテナを疑似的に作ることができます。 React(JSX)でいうと <React.Fragment> みたいなものです。 例えば、繰り返し ngFor で複数 […]

[Angular] コンポーネントを強制的に再描画する方法

コンポーネントを任意のタイミングで再描画したい AngularでWebアプリを開発中、コンポーネントをある特定のタイミングで再描画したいという状況があったので、その方法を調べたのでメモしておきます。 例えば非同期処理でのバインドデータ更新など、データが変わっても変更検知をしてくれない時があったりします。 ChangeDetectorRef ChangeDetectorRef を使うことで、任意のタ […]

Angular の環境構築方法入門

Angular5 の環境構築 Angular – クイックスタート Angular5 の開発環境を構築します。手順は上記公式サイトの手順に倣います。 Node.js と npm Download | Node.js Angular を使うには、Node.js と npm がインストールされている必要があります。 上記URLからNode.jsのLTS版をインストールしてください。npm […]