すべてのカテゴリ

みなさんこんにちは。イプシロンです。Firebaseに関するお話をさせていただきます。どれだけかんたんか、どれだけハードルが低いかを知っていただけると嬉しいです。それではいってみましょう！！用意するものFirebase とは、Google が提供している、モバイルや Web アプリケーションを構築するプラットフォームです。そのため、Googleアカウントが必須になります。・Googleアカウント手順1.Firebaseにアクセスしてログインします。。(ココナラブログの特性上、外部リンクを貼り付けられないのがつらい。。。)2.画面右上の「コンソールへ移動」をクリックします。3.「プロジェクトの追加」をクリックします。4.プロジェクトのタイトルを入力し、「続行」ボタンをクリックします。5.アナリティクスは必要ないので、無効を選択して、『プロジェクトを作成』をクリックします。6.「日本」を選択して、「プロジェクトを作成」をクリックします。7.少し待ちます。8.「続行」をクリックします。9.完成！！！プロジェクト一覧画面にも、先ほど作成したプロジェクトが追加されています。う～ん。。。かんたん！！！Hello World！！これだけですw最後にFirebaseを使用したサービスを出品しております。webアプリのスモールスケール開発サービスです。 販促、集客目的でwebアプリを作ってみたいけど、 まずは、小さな一歩から踏み出したいというお客様に向けたサービスです。 もちろんそうでないお客様も大歓迎！！！最後まで読んでいただきありがとうございます。では ﾉｼ

Markdown のメタデータを Firestore に置く利点投稿の原稿を Markdown で書いて、メタデータを Firestore に置くと幾つかの利点があります。この記事では、ブログの実装に Firestore が有利な理由を紹介します。Firebase のストレージのみで実装する場合最初に、Firebase のストレージを中心に実装する場合を考えてみます。 この方法は、シンプルでプログラムも簡単です。ファイルの一覧の表示には、Firebase のストレージのホルダにあるファイルの情報を取得して表示します。単純にファイルの「名前」だけをリストする場合には、この方法はシンプルで優れた方法です。一方で、Markdown に埋め込まれたメタデータを使ってファイルの詳細（タイトルや概要）などを一覧に表示する場合は少し話が違ってきます。理由は、メタデータを取り出すためにには、ファイルの中身のデータにアクセスする必要があるからです。 そのためにには、Firebase のストレージから取得したファイルの情報から、ファイルにアクセスするための URL を取得した後で、さらに、ファイルの中身にアクセスしてメタデータを取り出すという処理を一覧を表示するために行う必要があります。ファイルのサイズや処理するファイルの数にもよりますが、処理するファイルの数が増えると時間のかかる処理になってしまうことは明らかです。Firestore を利用するメリットそこで、前回紹介した方法は、ファイルをアップロードする際に Markdown に埋め込まれているメタデータを取り出して、予め Firestore

Firebase のセキュリティルールは「人・場所・できる事」Firebase のセキュリティルールは一見複雑そうに見えますが、基本は「人」、「場所」、「出来る事」をまとめる事です。この記事では、Firebase のセキュリティルールの基本を紹介します！Firebase のセキュリティールールとは何か？Firebase を Web ブラウザ（フロントエンド）から利用する際には、Firebase のセキュリティルールを設定する事が必須になります。ところで、このセキュリティルールとは何かご存知ですか？まずは、そこから紹介します。 セキュリティルールは一言で言えば、「誰がどこで何をしていいかを決める」事です。従って、セキュリティルールを設定する上でのポイントは：＊　誰（人）＊　どこ（場所）＊　出来ること（何をするか）この三つを決めれば良い事になります。人を特定する誰がどこですか何をして良いかを決めるためには、最初に必要な事は「人を特定」する必要があります。 Web のアプリやサービスで人を特定する方法は、基本的には「ユーザ名」で区別しています。特定のユーザー名のパスワードを知っていればその人と見做すという仕組みです。これを、ユーザー認証機能とかログイン（サインイン）機能と呼んでいます。Firebase の場合は、大きく三つの方法があります。Firebase コンソールにアクセスできる人（管理者）とそれ以外の人ログインしている人としていない人ユーザー認証をして個別のユーザーとして区別Firebase のコンソールで必要な操作が間に合うのであれば、特にユーザー認証（ログイン）の機能を作る

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とReactでブログを実装！FirebaseでWebホスティングをすれば、無料でWebサイトの運営をスタートできます。 Firebaseの利用事例としてブログサイトの運用を取り上げてみました。 この記事ではシンプルなブログの運用例としてフロントエンドのフレームワークのReactを使った事例を何回かに分けて紹介していきます。 利用するFirebaseの機能は？ この事例で利用するFirebaseの機能は * Firebase ストレージ * Firebase Cloud Firestore （データベース） * Firebase ホスティング の３つの機能です。 Firebaseストレージで記事を保存 ブログの記事はFirebaseのストレージに保存します。こうすることで、Fireabaseのホスティングに毎回デプロイすることを避けることができます。 一番シンプルな方法は、毎回記事のHTMLのファイルを作成して、その都度その記事をWebサイトに追加していく方法ですが、毎回Webサイトのデプロイを行わなければならず、運用上はちょっと面倒な仕組みです。そこで記事自体はFirebaseのストレージに保存しておいて、プログラムでFirebaseストレージのファイルを読み込んで表示するという仕組みを作れば、サイトの運営がシンプルになります。 Firebase Cloud Filrestore(データベース)に記事情報を保存 Firebaseのストレージだけでも、ブログサイトの仕組みは作れますが、将来的なサイトの拡張を考えると、各記事の情報をデータベースで保存して