すべてのカテゴリ

Django で利用するデータベースDjango のフレームワークを利用して Web 開発をする場合は、SQL のデータベースを使うことになります。 SQL のデータベースは Firebase のデータベースとはちょっと違います。正確な言い方をすれば、Firebase のデータベースは広く活用されている、SQL などのリレーショナルデータベース（RDB)とは違うと言うことです。これまで、Firebase を中心にお届けしてきたので、その違いについてまとめて見ました。  Django は SQL データベースが基本Django で利用するデータベースは SQL データベースが基本です。標準では、SQLite を利用する設定になっています。SQLite を利用する場合は、特別な設定は必要ありません。そのまま、データベースの機能が利用可能です。その他にもメジャーな SQL のデータベースを利用可能です。Django の公式ページのドキュメントを見ると、公式にサポートされているデータベースは：＊　PostgreSQL＊　MariaDB＊　MySQL＊　Oracle＊　SQLite　です。この他に身もサードパーティがサポートしているデータベースに＊　CockroachDB＊　FIrebird＊　Microsoft SQL Server　　などがあります。利用するデータベースは、プロジェクトフォルダにある、settings.py で指定すれば利用可能です。標準設定では以下のようになっていますが、これを書き換えます。DATABASES = {    'default': {        '

Firebase のデータベースを使って Firebase ストレージのファイル情報を１０倍速く処理する方法！Firebase ストレージにファイルを保存する場合、ファイルの追加情報をメタデータとして保存できます。 例えば、ファイルのタイトルや簡単な説明、分類などの情報をメタデータとして保存しておくと、ファイルの検索や表示をする際に便利です。この Firebase ストレージのファイル情報（メタデータ）の扱い方で性能が大きく変わることをご存知でしょうか？この記事では、Firebase ストレージに保存されているファイルのファイル情報（メタデータ）の上手な扱い方を紹介しています。Firebase ストレージに保存するファイル情報の基本わかりやすく説明するために、ブログの投稿データを Firebase ストレージに保存する場合を考えます。ブログの投稿なのでファイル情報（メタデータ）として以下の情報をファイルと一緒に保存します。＊　タイトル(title)＊　投稿日時(date)＊　概要(description)＊　分類(type)これを Firebase のメタデータとして保存する場合、Firebase のメタデータの「customMetadata」として保存することができます。 ファイルをアップロードする際にはメタデータを追加して Firebase ストレージにアップロードするだけです。function fileUpload(file:File, folder:string) {    const fileRef:firebase.firestore.Reference = fir

Firebaseアプリのデータベースを管理するには？Firebase のデータベース機能（Cloud Firestore）を利用して作成したアプリの多くは、アプリで利用しているデータベースを管理する必要がある場合が多くなります。作成したアプリの一部として管理する方法もありますが、専用の管理アプリを作成するとセキュリティ上より安全に管理を行う事ができます。この記事では、Firebase のデータベースを管理する専用アプリを Firebase admin SDK を利用して行う方法を紹介します。Firebase データベースのセキュリティールールで管理者を設定できる一番手軽な方法は、作成するアプリの一部として、「管理者モード」を実装してしまう方法です。これは、管理者の Firebase のユーザー ID を特定して、そのユーザーに管理者の権限を設定する方法です。rules_version = '2';service cloud.firestore {  match /databases/{database}/documents {    match /{document=**} {      allow read, write: if request.auth.uid == "uid_for_admin";    }  }}　のようなセキュリティルールを設定すれば、特定のユーザー ID で Firebase のユーザー認証（ログイン）したユーザーは Firebase のデータベース（Cloud Firestore）の全てのコレクション／ドキュメントに対して、読み込みと書き込みができ

FirebaseのセキュリティルールからのデータベースアクセスFirebase のデータベースのセキュリティルールを設定する際に、Firebase のデータベースのデータを利用することが可能です。前回の記事では、グループ毎の Firebase のデータベースのアクセスをシンプルにするために、カスタムでユーザー情報のコレクションを作成して利用する方法を紹介しました。実は、Firebase のデータベースのセキュリティルールの中からデータベースのアクセスをする場合には幾つか注意があります。この記事では、Firebase のセキュリティルールからデータベースを利用する場合に気をつけることをまとめて見ました。Firebase のセキュリティルールからのデータベースアクセスFirebase のセキュリティールールの中で Firebase のデータベースにアクセスできる機能はとても便利です。この場合、見落としやすいのは、セキュリティルールのために作成したデータベースへのアクセスです。例えば、前回紹介した、グループアクセス管理のためのユーザーコレクションを考えてみます。aaa zzz＠xx.com aaa 1 ZZZ YYYY bbb xxx＠xx.com bbb 1 XXX WWWW ccc vvv＠yz.net ccc 2 VVV UUUU 　例なのでシンプルに３人のユーザ「ZZZ」「XXX」「VVV」を考えます。 コレクションには各ユーザーに対応したドキュメントを保存します。{  "docId": "ドキュメントID",  "email": "E-Mailアドレス",  "uid":

Firebaseのデータベースのセキュリティルールの書き方　グループ編Firebase のデータベースのセキュリティルールの具体的な書き方を紹介していきます。 今回はグループ単位でセキュリティルールを管理する場合の例について紹介します。基本のルールFirebase のプロジェクトを作成して、Cloud Firestore のデータベースを作成すると、最初にルールを設定するように言われます。 基本的な選択肢は２つです＊　プロダクションモード（production mode）＊　テストモード（test mode）通常はこのどちらかを選択して開発を始めます。プロダクションモードプロダクションモードは基本的に全てのアクセスが禁止になっています。 必要に応じて、アクセスの権限を設定する必要があります。以下のルールが標準設定のプロダクションモードになります。 この状態では、データベースのアクセスはできません。rules_version = '2';service cloud.firestore {  match /databases/{database}/documents {    match /{document=**} {      allow read, write: if false;    }  }}テストモードテストモードの場合は、基本的に全てのアクセスが許可されています。 インターネットに公開しないで、開発する場合は、このモードを使うとまずは開発の基本的な機能の開発に集中できます。期限をつけて許可をしているので設定した日時（通常はデータベースを作成してから 30 日間）を過

２つのFirebaseのアクセス方法　フロントエンドとバックエンドFirebase のデータベースを利用する場合、フロントエンドからアクセスする方法とバックエンドからアクセスする方法があります。手軽なのは、フロントエンドからアクセスする方法です。バックエンドサービスを作る必要がないので簡単に実装できるのは魅力です。一方で、アクセスの権限の細かい設定は、セキュリティルールで設定する必要があるので、複雑な権限やデータを扱う場合には面倒な点もあります。手軽に利用できるフロントエンドからのアクセス一番一般的でポピュラーな方法は Firebase のクライアント機能を利用する方法です。一番簡単な方法は、CDN（Contents Delivary Network）を利用する方法で、HTML で CDN のリンクを指定すれば、簡単に Firebase のデータベースにアクセスすることが可能です。テストモードならば簡単Firebase のデータベースは、Firebase のプロジェクトを作成して、データベースを作成する時に設定するようになっています。この時聞かれるのが、「プロダクションモード」と「テストモード」です。プロダクションモードは基本的にアクセスが禁止になっているので、必要に応じてセキュリティールールを設定してアクセスを許可していく必要があります。テストモードは基本的に全てのアクセスを許可しています。従って、誰でも全てのデータにアクセスできるのでインターネット上にサービスを公開する際には、セキュリティルールを設定して必要最低限のアクセスを許可するように変更する事は必須です。通常は、設定

Firebaseのデータベースで何ができるか？Firebase は色々な機能を提供しています。その中でもよく使われる機能はログイン（ユーザー認証）とデータベースです。 データベースと言うと何か難しそうな気がしますが、基本はデータを置く場所です。データをどのように整理しておくかは工夫が必要ですが、インターネット上のデータを置く場所と考えるとわかりやすくなります。基本のデータの形は Javascript でよく利用されるデータ形式の JSON なので、Javascript のプログラムとは相性が良いので便利です。SQL との違いは？Web アプリや Web サービスと連携してよく利用されるデータベースに SQL があります。よく比較されますが、一般的なアプリやサービスでは SQL より扱いやすいデータベースです。SQL のデータの基本は「テーブル」です。イメージとしては誰もが利用したことがある表計算の表のイメージです。Microsoft の Excel が代表的なアプリですが、色々なデータをまとめるのに利用したことがある方は多いと思います。SQL のデータベースを利用する場合に必要なことは以下の通りです＊　表（テーブル）のフォーマットを決める＊　表（テーブル）をデータベース上に作成＊　表のデータを出し入れする記述（SQL）を書くSQL 自体はデータベース上のテーブルにデータを入れたり、読み出し、更新、削除をするための記述で厳密にはプログラムではありませんが、通常はプログラムからデータベースとデータのやりとりをする際に利用されます。テーブルに保存されるデータの各項目は予め決める必要が

FirebaseとSendGridを上手く利用するには？FirebaseとSendGridを使ってメルマガ（ニュースレター）サービスを実装する場合、SendGridのサーバーからデータを取得する場合の処理は： ＊　バックエンドにリクエストを送信 ＊　バックエンドはリクエストをSendGridに転送 ＊　バックエンドがSendGridからデータを受け取る ＊　バックエンドがデータをフロントエンドに転送 というステップで処理が実行されます。 SendGridとのやり取りにAPI Key（SendGridの秘密鍵）を利用する必要があるのでどうしても、バックエンドと通す必要があるため、意外に時間がかかります。 今日の記事は、FirebaseとSendGridでメルマガ（ニュースレター）のサービスを実装する際に、こうした待ち時間を改善する方法について解説します。 Firebaseのデータベースアクセスは高速アクセス可能！ バックエンドのサービス（functions）とそのホスティングにFirebaseを使う場合、もう一つ工夫するとメルマガ（ニュースレター）を配信する際のサービスをより快適にすることができます。 Firebaseのデータベース（Cloud Firestore）は、チャットなどのサービスでもよく利用されますが、リアルタイムでの更新も可能で、高速でアクセス可能です。これを上手く使うとSendGridのデータの取得も高速かつ便利に行う事が可能です。 少なくても、Firebase Cloud Firestoreのデータベースにはバックエンドを介さずに直接アクセスすること

Firebaseデータベースでドキュメントごとにセキュリティルールを設定するFirebaseでデータベース（Cloud Firestore）を利用する場合、セキュリティルールの設定はとても大切です。 Firebaseコンソールでデータベース（Cloud Firestore）を作成した際に標準で設定されるルールはとてもシンプルなものです。実際の運用では、さらに細かいセキュリティルールが必要になる場合が殆どです。 コレクション毎のセキュリティルールの設定は比較的シンプルで分かりやすいので余り問題にならないと思いますが、ドキュメントごとにセキュリティルールを設定する場合は少し複雑になるのでなれないとルールの設定に時間を取られてしまう場合もあります。 この記事では、Firebaseの登録ユーザの拡張を考えた場合のセキュリティルールを例にセキュリティルールの設定の仕方を解説しています。 Firebaseが管理するユーザー情報 Firebaseでは、ユーザーの認証機能が用意されていてユーザーの管理や認証を簡単に実装することを可能にしています。 Firebaseから入手可能なユーザーの情報はE-Mailアドレスとパスワードの認証を理容師ている場合は次の様になります。 ＊　E-Mailアドレス(email) ＊　ユーザーＩＤ（uid） が基本的な情報です。これ以外の情報が必要な場合は、別にカスタムでテーブルを作って管理する必要があります。 グループごとにユーザーを管理することを考える 例えば、グループごとに管理者を置いてユーザーを管理することを考えます。 この場合は、Firebas

Firebaseのデータベースのアクセスは非同期Firebaseの多くのアクセスはネットワークを介する物が多いので非同期の処理になるものが多くなります。 非同期の処理は慣れないと分かりにくい所もあって最初は苦労する部分です。この記事では、Firebaseのデータベースの非同期処理について少し詳しく解説しています。 Firebase Cloud Firestoreデータベースのアクセスの基本 FirebaseのCloud Firestoreのデータベースの基本は コレクション ドキュメント この２つです。コレクションはドキュメントを入れておく入れ物のようなもので、例えば「address(住所録)」のコレクションを作って、その中に各個人の住所などの情報を入れたドキュメントを格納して行くように使います。 一つ一つのドキュメントのデータはJSON形式のデータになります。 const refAddress =firebase.firestore().collection がコレクションへのリファレンスになります。要はコレクション「address」の場所を示しています。この中にドキュメントが格納されます。 新たにドキュメントを加える場合 const personA = {     address: "XXX県YYY市３丁目3番地",     name:"山田太郎" } firebase.firestore().collection("address").add(personA).then((doc) => {     // 追加に成功     console.log("

Firebaseの料金を意識したデータベースの使用Firebaseを利用してWebサイトを運営している場合気になるのは利用料金です。 実際に運用した経験から言うと、相当アクセス数が増えない限り無料の範囲でサイトを運営する事はそれほど難しくありません。 Firebaseの料金システムの基本 Firebaseの利用料金を決める基本的な要因は ＊　使用容量（幾つかの容量の規定があります） ＊　アクセス数（これも沢山のアクセス数の規定があります） 使用容量に関しては基本的に ＊　データベースの使用容量（１GiB） ＊　ホスティングで使用している容量（１０GBまで無料） ＊　ストレージの使用容量（５GBまで無料） で通常の規模のWebサービス、Webアプリであればこの制限以内で十分運用が可能かと思います。 アクセス数も料金に影響します！ アクセス数もFirebaseの利用料金に効いてきます。 気になるのが、データベースのアクセス数です。 無料の範囲がCloud Firestoreの場合 ＊　書き込みが、1日当たり20万回まで無料 ＊　読み込みが、1日当たり50万回まで無料 ＊　消去が、1日当たり20万回まで無料 となっています。この数字はとても大きく感じますが、これはデータベースの照会回数ではなく、Cloud Firestoreのドキュメントの読み込み回数なので注意が必要です。 例えば、一つのコレクションに１００個のドキュメントがある場合、アクセスの度に全てのドキュメントを取得する場合1度のアクセスで100回の読み込みをすることになります。100人の人がアクセスすれば、1万

FirebaseとReactで作るお問合せ管理Vueでの事例を紹介しましたが同じアプリをReactで！ 前回はフロントエンドのフレームワークとしてVueを使ってFirebaseの機能を取り込んだWebサービス・Webアプリの事例を紹介させて頂きました。 今回は、Vueとならんで広く利用されているフレームワークReactを使った事例を同じお問合せフォームの管理アプリで紹介します。FirebaseとReactを組み合わせて使う場合、Vueの場合と同様に「npm」の活用が便利です。Firebaseのモジュールもインストールしてしまえば、簡単にReactのプロジェクトのコードから呼び出す事ができます。Reactを使うための準備「create-react-app」のインストール Vueの場合Vue CLIを使いましたがReactの場合は、「create-react-app」を使います。このパッケージを使うとReactのサンプルプロジェクトを作成してくれます。VueのようなUIはサポートされていませんが実用上は全く問題ありません。 「create-react-app」のインストールは以下のコマンドで行います。 $ npm install -g create-react-appReactのプロジェクトの作成create-react-app」のインストールが済んだら、まずReactのプロジェクトを作ります。VueのようなUIはありませんがコマンドを一つ実行するだけです。 $ npx create-react-app [プロジェクトの名前] --template typescript 今

FirebaseとVueで作るお問い合わせ管理以前Webサービス制作で同じような記事を投稿しています。しかし、今回はFirebaseを使ってという点でお改めて記事を書き直していますのでご覧ください。（以前は「Webサービス」を主体に紹介しています） FirebaseとVueを組み合わせて使う場合、「npm」の活用が便利です。Firebaseのモジュールもインストールしてしまえば、簡単にVueのプロジェクトのコードから呼び出す事ができます。Vueを使うための準備Vue CLIのインストール FirebaseもVueも「npm」を活用した方が便利です。CDNのリンクをHTMLに張り付けても使えますが、WebサービスやWebアプリを開発する上で、利用価値の高い、既存のモジュールを手軽に取り込めるのは大きな魅力です。 まずは、Vueを使うための仕組みVue CLIをインストールします。[npm install -g ＠vue/cli]便利なUIを活用 コマンドラインからもVueは使えますが、UIが便利です。npmのコマンドで、「vue ui」と入力して、見やすいUI上でVueのプロジェクトの管理をするのが便利です。 Vueのプロジェクトを作ります。 Vueの場合標準ではJavaScriptを使う設定になっているので、Typescriptを使って開発をする場合には、マニュアルで必要なオプションを選択する必要があります。難しい設定はないので、一度マニュアルで設定して、設定内容を保存しておけば次回以降はその設定を読み込めば自動的に設定されます。予め設定されているプロジェクトの不要なファ