Angular
環境 Alert/Modal同士でz-indexを交換する Alert/Modalのz-indexを参照できるのはなぜか？ おわりに 参考サイト 環境 TypeScriptベースのフレームワークであるAngularと、iOS/AndroidのハイブリッドモバイルアプリケーションのフレームワークであるIonicを使…
はじめに 環境 アラート表示の実装 ObservableではなくSubjectが必要になるタイミング メンテナンスよりも強制バージョンアップのアラートを優先して表示する 動作確認 おまけ: どうしてSubjectにasObservableが必要なのか 参考 はじめに 今回は、前回の記事…
はじめに Firebaseが提供しているデータベースについて 環境 環境構築 補足 Realtime Databaseのデータ構造を構築する メンテナンスと強制バージョンアップのポップアップを表示する 動作確認 メンテナンスメッセージの表示 強制バージョンアップメッセージ…
はじめに ダークカナリアリリースとは ダークカナリアリリースのイメージ HTTPヘッダーの追加方針 モバイルアプリの環境 ビルドスクリプトの作成 インターセプターの作成 動作確認 参考サイト はじめに 最近、仕事でダークカナリアリリース対応を少しだけお…
はじめに 環境 キャッシュファイルの確認方法 そもそもキャッシュを作らないという手もある キャッシュファイルの削除 カスタムプラグインの作成 動作確認 苦労した点 参考サイト はじめに ハイブリッドアプリフレームワークである、Ionic(Cordova)を使用し…
はじめに 環境 大文字に変換するディレクティブ 参考サイト はじめに 小文字で入力したアルファベットを大文字に変換するDirectiveを作成します。 環境 TypeScriptベースのフレームワークであるAngularを使用しています。 ng versionの実行結果 Angular CLI:…
はじめに 環境 Cordova フックスクリプトを作成する 参考記事 はじめに Ionic(Cordova/Angular)アプリのAndroidビルドに時間がかかりすぎているせいで、Jenkinsのビルドが不安定になるという問題が発生しました。 そのため、mavenリポジトリの参照先をMaven …
はじめに サロゲートペアについて 環境 絵文字を正確にカウントできるライブラリ Validatorの作成 Directiveの作成 参考サイト はじめに 絵文字を使ってもバグらずに動くValidatorとDirectiveを作成します。 サロゲートペアについて サロゲートペアとは、2つ…
はじめに 環境 ログイン画面にリンクをつける 利用規約画面を作成する プライバシーポリシー画面を作成する 参考サイト はじめに Ionicで作成中の体重計アプリ「SpeedWeight」に利用規約とプライバシー画面を追加します。 環境 ハイブリットモバイルアプリ用…
![はてなブックマーク - 【Ionic v5】[個人開発]利用規約とプライバシーポリシー画面を作る](https://b.hatena.ne.jp/entry/image/https://www.l08084.com/entry/2020/10/31/191911)
はじめに 関連記事 環境 Step1: FirebaseコンソールでGitHub認証を有効にする Step2: GitHubからクライアントIDとクライアントシークレットを取得する Step3: GitHubログインボタンのテンプレートを作成する Step4: リダイレクトモードでFirebase認証(GitHub…
はじめに 環境 ダークテーマを無効にする 参考サイト はじめに ダークモード対応が面倒なので、Ionicがデフォルトで対応してくれているダークモードを解除したい。 外観モードをライトにした場合 外観モードをダークにした場合 環境 ハイブリットモバイルア…
はじめに 環境 TODOアプリ作成 Model EntityStore Query Service Component 実際にTODOアプリを動作させる 参考サイト はじめに 前回の記事に引き続き、状態管理ライブラリのAkitaについて学習していきます。今回は、AkitaのEntityStoreを使用して、TODOアプ…
はじめに Akitaって？ 環境 Akitaインストール カウンターアプリ作成 Store Query Service Component 次回の記事 参考サイト はじめに 仕事で状態管理ライブラリのAkitaを使うことになったので勉強のためにAngularとAkitaを使ってカウンターアプリを作ること…
はじめに 関連記事 環境 FirebaseコンソールでGoogle認証を有効にする Googleのログインボタン作成 Step1: Googleのロゴアイコンを取得 Step2: GoogleカラーをIonicに追加 Step3: ログインボタンのテンプレートを作成 Step4: リダイレクトモードでFirebase認…
はじめに Shadow DOMって？ ボタンのレイアウトを変更する 参考サイト はじめに 本記事では、Ionic v5のボタンのレイアウトを変更します。Ionic v5のボタン(ion-button)ではShadow DOMが適用されているため、Shadow DOMでないコンポーネントと同様のやり方で…
![はてなブックマーク - 【Ionic v5】[Shadow DOM]ボタンのレイアウトを変更する](https://b.hatena.ne.jp/entry/image/https://www.l08084.com/entry/2020/10/04/200216)
はじめに 環境 リダイレクトモードでFirebase認証 ポップアップモードのFirebase認証 参考サイト はじめに FirebaseのSNS認証には、ポップアップウィンドウを表示するポップアップモードとログインページにリダイレクトするリダイレクトモードの2種類の形式…
はじめに 環境 配色の追加 Step1: レイヤードスタイルの作成 Step2: SCSSファイルにレイヤードスタイルを追加 Step3: ボタン作成 参考サイト はじめに Ionicには9つのデフォルトカラーがある Ionicにはprimary, secondary...といったように9つのデフォルトカ…
テーブル内でラジオボタンを使用する はじめに 環境 通常のIonicのラジオボタン テーブルのセル内でion-radioを使用する 参考サイト はじめに テーブルのセル内でIonicのラジオボタンを使用する方法がわからず、手間取ってしまったため、メモとして残した。 …
はじめに 環境 実装 参考サイト はじめに AngularのngClass(テンプレート内でclass属性を動的に変更する機能)で三項演算子を使う方法を説明します。 <div class="block" [ngClass]="isRed ? 'red' : 'blue'"></div> 環境 Angular: 8.2.14 実装 isRed が true の時は赤色になる ngClassで三項演算子を使う方法について説明…
はじめに 前提条件 環境 デプロイ準備 アプリケーションを本番ビルドする デプロイ実施 参考サイト はじめに AngularとFirebaseを使って作成したアプリをFirebaseのHostingという機能を使ってデプロイします。 前提条件 Angularプロジェクトは作成ずみ Fires…
作ったメモアプリ。名前はスリーメモ はじめに スリーメモの機能 SNS認証 フォルダ スリーメモで使われている技術 はじめに Firebaseの勉強のためにスリーメモというアプリを作りました。Evernoteみたいなメモアプリです。モバイル対応はまだできていないの…
はじめに 環境 ログイン中のアカウントの情報を表示する 認証のサービスクラスを作成する ヘッダーにアカウントの情報を表示する HTMLテンプレート コンポーネントクラス 参考サイト ログイン中のアカウントの情報を表示している はじめに ログインしている…
はじめに 環境 やりたいこと バリデーションの実装 HTMLテンプレート コンポーネントクラス カスタムバリデーター 参考サイト はじめに Angularでクロスフィールドバリデーション（複数項目にまたがるバリデーション ）を使った時に、フォーム全体をエラーに…
はじめに 環境 今回作るもの 分数入力コンポーネントの実装 参考サイト はじめに 自作コンポーネントで双方向バインディング機能(ngModel)を使えるようにしたい。 環境 CSSフレームワークとしてAngular Materialを使用しています Angular: 8.2.14 Node: 12.1…
はじめに 環境 今回やりたいこと ウィンドウにデータを渡す二つの方法 1. ローカルストレージを用いる方法 2. window.postMessage()を用いる方法 ウィンドウにデータを渡す実装 ローカルストレージを採用した場合 親ウィンドウの実装 子ウィンドウの実装 win…
はじめに 環境 作ったもの 実装 ルーティング設定 親ウィンドウの実装 子ウィンドウの実装 データの受け渡しについて 参考サイト はじめに 仕事でAngularを使ってアプリケーションを作成している時に、window.open()で別ウィンドウを表示する要件があったの…
はじめに 環境 マトリクス図の作成 CSSリセット マトリクス図の全コード 参考サイト 作成したマトリクス図 はじめに 仕事でCSSフレームワークを使わずにテーブルを作成する機会があったので、備忘録としてプライベートでもマトリクス図を作ってみました。 環…
はじめに 環境 Facebook for Developersアカウントを作成 アプリの登録 FirebaseコンソールでFacebook認証を有効にする 「Facebookでログイン」ボタンを作成する Facebook認証機能の実装 補足: Facebook認証を利用したアカウント登録機能の実装 参考サイト …
はじめに 環境 TwitterのAPIキーとAPIシークレットを取得する Twitter Developer アカウントの作成 アプリの登録 FirebaseコンソールでTwitter認証を有効にする 「Twitterでログイン」ボタンを作成する Twitter認証機能の実装 補足: Twitter認証を利用したア…
はじめに 環境 msSaveBlobからmsSaveOrOpenBlobに変更 参考サイト はじめに SPAアプリ上でIE11ブラウザを使ってPDFファイルを参照する場合に、PDFファイルをダウンロードせずにそのまま開いて参照したいとの要望をクライアントからいただいたため、ソースコ…
