SlideShare ist ein Scribd-Unternehmen logo
1 von 22
Downloaden Sie, um offline zu lesen
Googleスプレッドシートで
管理している家計簿を
Firebaseを使って
WEBアプリ化してみた件
株式会社diffeasy
エンジニア 井上奈々
世界中のむずかしいを簡単に
井上 奈々(いのうえ なな)
株式会社diffeasy(ディフィージー)
 “difficult to easy”
 世界中の”むずかしい”を簡単に
 スタッフエンジニア
趣味
 漫画・アニメ・声優・開発
@Nunnally_Engr
Googleスプレッドシートで管理している家計簿をFirebaseを使ってWEBアプリ化してみた件
Googleフォーム&スプレットシートで挑戦!
フォーム画面で入力。
Googleスプレットシートに反映。
“ みっ…見にくい((((;゚Д゚))))ガクガクブルブル!!!!!
今回作ってみた環境
Firebaseを使ってできること(機能)
認証(Firebase Authentication)
リアルタイムデータベース
(Firebase Realtime Database)
Cloud Storage
(写真や動画などのコンテンツを保管)
上記以外にも沢山いろんな機能があります!
 ⇒ 詳細はFirebaseのWEBで(๑•̀ㅁ•́๑)✧
Firebaseを使って試した事
認証(Firebase Authentication)
 ⇒ メールアドレス&パスワードでログイン
リアルタイムデータベース
 ⇒ データの登録・更新・削除
Cloud Storage
 ⇒ 画像(レシート)のアップロード
demo・デモ・でも…
認証(ログイン)
認証(ログイン)
リアルタイムデータベース(登録)
リアルタイムデータベース(登録)
リアルタイムデータベース(登録)
リアルタイムデータベース(登録)
リアルタイムデータベース(更新)
KEY ⇒ Firebase が勝手に生成してくれる一意のキー
KEY
リアルタイムデータベース(削除)
KEY ⇒ Firebase が勝手に生成してくれる一意のキー
Cloud Storage(写真アップロード)
Cloud Storage(写真アップロード)
Cloud Storage(写真アップロード)
https://firebasestorage.googleapis.com/~
まとめ
メリット
認証機能やリアルタイムデータベース、アナリティクス、クラウド
メッセージングといった色んな機能が
提供されていて、自由に組み合わせることで柔軟なアプリ開発
ができる気がする…かもしれない!
デメリット
リアルタイムデータベースはNoSQLなので、
サービスの内容によって向き不向きがあるかもしれない…
公式ドキュメントもあるが…海外のサイトにかかれている
プログラムに結構助けられたので学習コストが意外とかかるか
もしれない…(実力不足もあるかもしれないがw)
Googleスプレッドシートで管理している家計簿をFirebaseを使ってWEBアプリ化してみた件

Weitere ähnliche Inhalte

Was ist angesagt?

[DL輪読会]Adversarial Feature Matching for Text Generation
[DL輪読会]Adversarial Feature Matching for Text Generation[DL輪読会]Adversarial Feature Matching for Text Generation
[DL輪読会]Adversarial Feature Matching for Text GenerationDeep Learning JP
 
SVGでつくるインタラクティブWebアプリケーション
SVGでつくるインタラクティブWebアプリケーションSVGでつくるインタラクティブWebアプリケーション
SVGでつくるインタラクティブWebアプリケーションKohei Kadowaki
 
OpenAI の音声認識 AI「Whisper」をテストしてみた
OpenAI の音声認識 AI「Whisper」をテストしてみたOpenAI の音声認識 AI「Whisper」をテストしてみた
OpenAI の音声認識 AI「Whisper」をテストしてみたHide Koba
 
Cesiumを動かしてみよう
Cesiumを動かしてみようCesiumを動かしてみよう
Cesiumを動かしてみようKazutaka ishizaki
 
UnityのクラッシュをBacktraceでデバッグしよう!
UnityのクラッシュをBacktraceでデバッグしよう!UnityのクラッシュをBacktraceでデバッグしよう!
UnityのクラッシュをBacktraceでデバッグしよう!Unity Technologies Japan K.K.
 
Face Quality Assessment 顔画像品質評価について
Face Quality Assessment 顔画像品質評価についてFace Quality Assessment 顔画像品質評価について
Face Quality Assessment 顔画像品質評価についてPlot Hong
 
研究発表を準備する(2022年版)
研究発表を準備する(2022年版)研究発表を準備する(2022年版)
研究発表を準備する(2022年版)Takayuki Itoh
 
全文検索でRedmineをさらに活用!
全文検索でRedmineをさらに活用!全文検索でRedmineをさらに活用!
全文検索でRedmineをさらに活用!Kouhei Sutou
 
-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識
-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識
-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識Hironobu Fujiyoshi
 
知っておきたいFirebase の色んな上限について
知っておきたいFirebase の色んな上限について知っておきたいFirebase の色んな上限について
知っておきたいFirebase の色んな上限について健一 辰濱
 
WebGIS初級編 - OpenLayersで簡単作成
WebGIS初級編 - OpenLayersで簡単作成WebGIS初級編 - OpenLayersで簡単作成
WebGIS初級編 - OpenLayersで簡単作成Hideo Harada
 
カッパ(妖怪)の生息適地マップ作成入門
カッパ(妖怪)の生息適地マップ作成入門カッパ(妖怪)の生息適地マップ作成入門
カッパ(妖怪)の生息適地マップ作成入門Mizutani Takayuki
 
【DL輪読会】Monocular real time volumetric performance capture
【DL輪読会】Monocular real time volumetric performance capture 【DL輪読会】Monocular real time volumetric performance capture
【DL輪読会】Monocular real time volumetric performance capture Deep Learning JP
 
Snowflakeって実際どうなの?数多のDBを使い倒した猛者が語る
Snowflakeって実際どうなの?数多のDBを使い倒した猛者が語るSnowflakeって実際どうなの?数多のDBを使い倒した猛者が語る
Snowflakeって実際どうなの?数多のDBを使い倒した猛者が語るRyota Shibuya
 
UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~
UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~ UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~
UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~ masayahamazaki
 
テスト文字列に「うんこ」と入れるな
テスト文字列に「うんこ」と入れるなテスト文字列に「うんこ」と入れるな
テスト文字列に「うんこ」と入れるなKentaro Matsui
 
【論文紹介】Understanding Back-Translation at Scale
【論文紹介】Understanding Back-Translation at Scale【論文紹介】Understanding Back-Translation at Scale
【論文紹介】Understanding Back-Translation at ScaleTomoyuki Hioki
 
インセプションデッキの紹介
インセプションデッキの紹介インセプションデッキの紹介
インセプションデッキの紹介lita
 

Was ist angesagt? (20)

[DL輪読会]Adversarial Feature Matching for Text Generation
[DL輪読会]Adversarial Feature Matching for Text Generation[DL輪読会]Adversarial Feature Matching for Text Generation
[DL輪読会]Adversarial Feature Matching for Text Generation
 
SVGでつくるインタラクティブWebアプリケーション
SVGでつくるインタラクティブWebアプリケーションSVGでつくるインタラクティブWebアプリケーション
SVGでつくるインタラクティブWebアプリケーション
 
OpenAI の音声認識 AI「Whisper」をテストしてみた
OpenAI の音声認識 AI「Whisper」をテストしてみたOpenAI の音声認識 AI「Whisper」をテストしてみた
OpenAI の音声認識 AI「Whisper」をテストしてみた
 
Cesiumを動かしてみよう
Cesiumを動かしてみようCesiumを動かしてみよう
Cesiumを動かしてみよう
 
UnityのクラッシュをBacktraceでデバッグしよう!
UnityのクラッシュをBacktraceでデバッグしよう!UnityのクラッシュをBacktraceでデバッグしよう!
UnityのクラッシュをBacktraceでデバッグしよう!
 
Face Quality Assessment 顔画像品質評価について
Face Quality Assessment 顔画像品質評価についてFace Quality Assessment 顔画像品質評価について
Face Quality Assessment 顔画像品質評価について
 
研究発表を準備する(2022年版)
研究発表を準備する(2022年版)研究発表を準備する(2022年版)
研究発表を準備する(2022年版)
 
機械学習と主成分分析
機械学習と主成分分析機械学習と主成分分析
機械学習と主成分分析
 
分散表現を用いたリアルタイム学習型セッションベース推薦システム
分散表現を用いたリアルタイム学習型セッションベース推薦システム分散表現を用いたリアルタイム学習型セッションベース推薦システム
分散表現を用いたリアルタイム学習型セッションベース推薦システム
 
全文検索でRedmineをさらに活用!
全文検索でRedmineをさらに活用!全文検索でRedmineをさらに活用!
全文検索でRedmineをさらに活用!
 
-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識
-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識
-SSIIの技術マップ- 過去•現在, そして未来 [領域]認識
 
知っておきたいFirebase の色んな上限について
知っておきたいFirebase の色んな上限について知っておきたいFirebase の色んな上限について
知っておきたいFirebase の色んな上限について
 
WebGIS初級編 - OpenLayersで簡単作成
WebGIS初級編 - OpenLayersで簡単作成WebGIS初級編 - OpenLayersで簡単作成
WebGIS初級編 - OpenLayersで簡単作成
 
カッパ(妖怪)の生息適地マップ作成入門
カッパ(妖怪)の生息適地マップ作成入門カッパ(妖怪)の生息適地マップ作成入門
カッパ(妖怪)の生息適地マップ作成入門
 
【DL輪読会】Monocular real time volumetric performance capture
【DL輪読会】Monocular real time volumetric performance capture 【DL輪読会】Monocular real time volumetric performance capture
【DL輪読会】Monocular real time volumetric performance capture
 
Snowflakeって実際どうなの?数多のDBを使い倒した猛者が語る
Snowflakeって実際どうなの?数多のDBを使い倒した猛者が語るSnowflakeって実際どうなの?数多のDBを使い倒した猛者が語る
Snowflakeって実際どうなの?数多のDBを使い倒した猛者が語る
 
UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~
UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~ UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~
UIと2D/3Dと私 ~2D/3Dを混在させたUIを作ったら、とてもめんどくさかった話~
 
テスト文字列に「うんこ」と入れるな
テスト文字列に「うんこ」と入れるなテスト文字列に「うんこ」と入れるな
テスト文字列に「うんこ」と入れるな
 
【論文紹介】Understanding Back-Translation at Scale
【論文紹介】Understanding Back-Translation at Scale【論文紹介】Understanding Back-Translation at Scale
【論文紹介】Understanding Back-Translation at Scale
 
インセプションデッキの紹介
インセプションデッキの紹介インセプションデッキの紹介
インセプションデッキの紹介
 

Ähnlich wie Googleスプレッドシートで管理している家計簿をFirebaseを使ってWEBアプリ化してみた件

cloud functions@firebase Tree to be worried about
cloud functions@firebase Tree to be worried aboutcloud functions@firebase Tree to be worried about
cloud functions@firebase Tree to be worried aboutIwamoto Nana
 
Firebaseで作られたCMS『Flamelink』を試してみた
Firebaseで作られたCMS『Flamelink』を試してみたFirebaseで作られたCMS『Flamelink』を試してみた
Firebaseで作られたCMS『Flamelink』を試してみたIwamoto Nana
 
はじめてのWord pressプラグイン勉強会
はじめてのWord pressプラグイン勉強会はじめてのWord pressプラグイン勉強会
はじめてのWord pressプラグイン勉強会Takahiro Nakahata
 
xR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティング
xR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティングxR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティング
xR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティングShinya Tachihara
 
Delphi のひみつ!(2015/01/29 CROSS 2015)
Delphi のひみつ!(2015/01/29 CROSS 2015)Delphi のひみつ!(2015/01/29 CROSS 2015)
Delphi のひみつ!(2015/01/29 CROSS 2015)Jun Hosokawa
 
デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」
デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」
デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」Naoji Taniguchi
 
Try to operate cloud firestore with flutter
Try to operate cloud firestore with flutterTry to operate cloud firestore with flutter
Try to operate cloud firestore with flutterIwamoto Nana
 
スマホにおけるWebGL入門
スマホにおけるWebGL入門スマホにおけるWebGL入門
スマホにおけるWebGL入門Yohta Kanke
 
Webアプリのシナリオテスト自動化を運用に乗せるまでの10のステップ
Webアプリのシナリオテスト自動化を運用に乗せるまでの10のステップWebアプリのシナリオテスト自動化を運用に乗せるまでの10のステップ
Webアプリのシナリオテスト自動化を運用に乗せるまでの10のステップNaoki Iwami
 

Ähnlich wie Googleスプレッドシートで管理している家計簿をFirebaseを使ってWEBアプリ化してみた件 (9)

cloud functions@firebase Tree to be worried about
cloud functions@firebase Tree to be worried aboutcloud functions@firebase Tree to be worried about
cloud functions@firebase Tree to be worried about
 
Firebaseで作られたCMS『Flamelink』を試してみた
Firebaseで作られたCMS『Flamelink』を試してみたFirebaseで作られたCMS『Flamelink』を試してみた
Firebaseで作られたCMS『Flamelink』を試してみた
 
はじめてのWord pressプラグイン勉強会
はじめてのWord pressプラグイン勉強会はじめてのWord pressプラグイン勉強会
はじめてのWord pressプラグイン勉強会
 
xR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティング
xR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティングxR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティング
xR Tech Tokyo 登壇資料 Mixed Realityではじまるコラボレーティブ・コンピューティング
 
Delphi のひみつ!(2015/01/29 CROSS 2015)
Delphi のひみつ!(2015/01/29 CROSS 2015)Delphi のひみつ!(2015/01/29 CROSS 2015)
Delphi のひみつ!(2015/01/29 CROSS 2015)
 
デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」
デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」
デブサミ2015版「VRを使った データビジュアライゼーションの 可能性について」
 
Try to operate cloud firestore with flutter
Try to operate cloud firestore with flutterTry to operate cloud firestore with flutter
Try to operate cloud firestore with flutter
 
スマホにおけるWebGL入門
スマホにおけるWebGL入門スマホにおけるWebGL入門
スマホにおけるWebGL入門
 
Webアプリのシナリオテスト自動化を運用に乗せるまでの10のステップ
Webアプリのシナリオテスト自動化を運用に乗せるまでの10のステップWebアプリのシナリオテスト自動化を運用に乗せるまでの10のステップ
Webアプリのシナリオテスト自動化を運用に乗せるまでの10のステップ
 

Googleスプレッドシートで管理している家計簿をFirebaseを使ってWEBアプリ化してみた件