ユーザ用ツール

サイト用ツール


ionic4とfirestoreでcrud

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン
前のリビジョン
ionic4とfirestoreでcrud [2018/09/30] – [Ionic4とFirestoreでCRUD] adash333ionic4とfirestoreでcrud [2018/10/10] (現在) – [Angular6とFirestoreで画像の追加と削除] adash333
行 2: 行 2:
  
 FirebaseとFirestoreの違いは、「料金体系の違い」と、<wrap hi>「Firestoreの方が検索しやすい」</wrap>ことにあるようです。 FirebaseとFirestoreの違いは、「料金体系の違い」と、<wrap hi>「Firestoreの方が検索しやすい」</wrap>ことにあるようです。
 +
 +
 +===== Ionic4とFirestoreでCRUD =====
 +以下のサイトは、Angular6とFirestoreでチャットアプリを作成しながら、AngularFire2を用いてCRUDを実装する方法を解説しています。日本語です!
 +
 +https://qiita.com/Yamamoto0525/items/437a2884c0c51f5a3af8\\
 +{{:pasted:20181008-070016.png}}
 +
 +上記サイトをIonic4で写経する場合
 +
 +<code>
 +ionic start ionic4-firestore-crud blank --type=angular
 +npm install -g firebase-tools@4.2.1
 +npm install firebase @angular/fire --save
 +// src/environments/environment.ts にfirebaseのAPI KEYなどを入力
 +// src/app/app.module.ts にenvironmentとangular/fireをimport
 +</code>
 +
 +{{:pasted:20181008-125102.png}}
 +===== Firestoreについて =====
 +https://qiita.com/subaru44k/items/a88e638333b8d5cc29f2\\
 +@subaru44k
 +2018年06月09日に更新
 +Firebase Cloud Firestoreの使い方
 +
 +
 +
 +===== AngularFire2公式サイト =====
 +FirebaseやFireStoreを利用するためのツールとして、AngularFire2というものがありますが、必ずしも利用する必要はありません。
 +
 +AngularFire2を利用するかどうかは好みの問題だと思われます。
 +
 +英語です。
 +
 +https://github.com/angular/angularfire2/tree/master/docs
 +
 +===== AngularFirestoreのCollectionの利用例(リスト表示) =====
 +
 +https://github.com/angular/angularfire2/blob/master/docs/firestore/collections.md
 +
 +
 +FireStoreでのデータ入力
 +
 +{{:pasted:20181008-093858.png}}
 +
 +
 +Ionic4でのtodo.page.htmlと、todo.page.ts (FirebaseのAPIキーなどは入力済みとする)
 +
 +{{:pasted:20181008-094122.png}}
 +
 +{{:pasted:20181008-094205.png}}
  
  
 ===== Ionic4とFirestoreとCapacitorで写真アップロードつきCRUDアプリ ===== ===== Ionic4とFirestoreとCapacitorで写真アップロードつきCRUDアプリ =====
-以下のサイトからメールアドレスを登録すると、capacitorを用いたカメラ画像を保存できるIonic4アプリ作成方法についての、無料のPDFファイルをダウンロードすることができます。+以下のサイトからメールアドレスを登録すると、capacitorを用いたカメラ画像を保存できるIonic4アプリ作成方法についての、無料のPDFファイルをダウンロードすることができます。ソースコードもhttps://github.com/javebratt/master-firestore-event-managerにアップロードしてくださっています。
  
 https://javebratt.com/firebase-free-course/ https://javebratt.com/firebase-free-course/
 {{:pasted:20180930-132234.png}} {{:pasted:20180930-132234.png}}
 +
 +こちらの本を写経してみたいと思います。
 +
 +http://twosquirrel.mints.ne.jp/?p=28337
 +
 +http://i-doctor.sakura.ne.jp/dokuwiki/doku.php/z_blog/2018/181008_ionic4_firestore_capacitor_camera#ionic4_firestore_capacitor_camera
 +
 +
 +===== Angular6とFirestoreで画像の追加と削除 =====
 +
 +
 +https://grokonez.com/frontend/angular/how-to-integrate-angular-6-firebase-tutorial-angularfire2-v5
 +
 +
 +https://grokonez.com/frontend/angular/angular-6-firebase-tutorial-upload-display-delete-files-from-firebase-storage
 +
 +
 +
 +
 +===== Ionic4とFirestoreでCRUD =====
 +英語ですが、以下のサイトが分かりやすいです。(ソースコードあり)
 +
 +https://javebratt.com/crud-ionic-firestore/
 +{{:pasted:20180930-131233.png}}
 +
 +ソースコード
 +
 +https://github.com/javebratt/crud-firestore-ionic-v4
 +
 +写経してみました。上記とほとんど同じですが、ソースコードを置いておきます。
 +
 +https://github.com/adash333/ionic4-firestore-sample2
  

ionic4とfirestoreでcrud.1538289446.txt.gz · 最終更新: 2018/10/07 (外部編集)

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki