非IT企業に勤める中年サラリーマンのIT日記

非IT企業でしかもITとは全く関係ない部署にいる中年エンジニア。唯一の趣味がプログラミングという”自称”プログラマー。

FirebaseをJavaScriptから利用する方法(新規データ追加)

   

前回、Firebaseのプロジェクト作成とJavascriptからの接続方法について書きました。

 

今回はデータの新規保存方法について書きます。

[ad#top-1]

 

前回のJavaScriptソースコードの下に以下のコードを加えます。(HTML含めたソース全文は後述)

var db = firebase.firestore();
db.settings({
  timestampsInSnapshots: true
});
var collection = db.collection('bookmarks');

collection.add({
  url: 'http://www.yahoo.co.jp',
  title: 'Yahoo!',
  label: 'ポータル'
})
.then(doc => {
  console.log(`成功!`);
})
.catch(error => {
  console.log(error);
});
 

 

Webブックマークを想定しているので、URLとタイトル、ラベルを保存しました。

「bookmarks」というのがデータベースのテーブルにあたります。「url」「title」「label」はフィールドにあたり、それぞれにデータを追加しています。

解説は以下の通り。

 

ブラウザ上でコンソールを開いて確認すると以下の通り「成功!」という文字が現れてることがわかります。

 

次にFirebaseのコンソールを確認すると、ちゃんとデータ入っていることがわかります。うまく行きました。

 

こちらがソースコード全文です。

[ad#ad-1]

スポンサーリンク

 - Firebase, HTML/JavaScript