firebase

ReactとFirebaseでRealtime Database にデータを書き込む方法

前提の想定

ReactアプリケーションですでにRealtime Databaseでデータの取得が出来ていること。

つまり、基礎的な設定が済んでアプリとRealtime Database との通信は出来ることは確定できていること。

下記のような感じでrefでデータベースのコレクションが参照できることを確認すること

const database = firebase.database();

const usersRef = database.ref("posts");

ReactとFirebaseでRealtime Database にデータを書き込む方法

では本題に入っていきます。

こんな感じです。

const usersRef = database.ref("posts");
usersRef.push().set({
blogData: {
title: "How to write Blog",
article: "This is Blog article",
},
});

こうすると、Realtime Databaseには、下記のようにデータが追加されます。

image

ちなみに、push()を使うと、自動でランダムなユニークidが付与されます。

参考

データの保存 Firebase Realtime Database
ReactとFirebaseでRealtime Database にデータを書き込む方法 - off.tokyo

Pocket
LinkedIn にシェア

  • この記事を書いた人

藤沢瞭介(Ryosuke Hujisawa)

りょすけと申します。18歳からプログラミングをはじめ、今はフロントエンドでReactを書いたり、AIの勉強を頑張っています。off.tokyoでは、ハイテクやガジェット、それからプログラミングに関する情報まで、エンジニアに役立つ情報を日々発信しています!

-firebase

Copyright© off.tokyo , 2021 All Rights Reserved Powered by AFFINGER5.