Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Firestoreを使ってメディアアプリを作ってみた
Search
gree_tech
PRO
July 08, 2019
Technology
0
240
Firestoreを使ってメディアアプリを作ってみた
「集まれKotlin好き!Kotlin愛好会 vol.11 」で発表された資料です。
https://love-kotlin.connpass.com/event/130013/
gree_tech
PRO
July 08, 2019
Tweet
Share
More Decks by gree_tech
See All by gree_tech
コミュニケーションに鍵を見いだす、エンジニア1年目の経験談
gree_tech
PRO
0
120
REALITY株式会社における開発生産性向上の取り組み: 失敗と成功から学んだこと
gree_tech
PRO
2
1.7k
『ヘブンバーンズレッド』におけるフィールドギミックの裏側
gree_tech
PRO
2
560
セキュリティインシデント対応の体制・運用の試行錯誤 / greetechcon2024-session-a1
gree_tech
PRO
1
560
『アナザーエデン 時空を超える猫』国内海外同時運営実現への道のり ~別々で開発されたアプリを安定して同時リリースするまでの取り組み~
gree_tech
PRO
1
530
『アサルトリリィ Last Bullet』におけるクラウドストリーミング技術を用いたブラウザゲーム化の紹介
gree_tech
PRO
1
620
UnityによるPCアプリの新しい選択肢。「PC版 Google Play Games」への対応について
gree_tech
PRO
1
980
実機ビルドのエラーによる検証ブロッカーを0に!『ヘブンバーンズレッド』のスモークテスト自動化の取り組み
gree_tech
PRO
1
640
"ゲームQA業界の技術向上を目指す! 会社を超えた研究会の取り組み"
gree_tech
PRO
1
760
Other Decks in Technology
See All in Technology
Core Audio tapを使ったリアルタイム音声処理のお話
yuta0306
0
160
How Community Opened Global Doors
hiroramos4
PRO
1
130
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
kkuv
1
370
AWS Summit Japan 2025 Community Stage - App workflow automation by AWS Step Functions
matsuihidetoshi
1
310
250627 関西Ruby会議08 前夜祭 RejectKaigi「DJ on Ruby Ver.0.1」
msykd
PRO
2
370
AIとともに進化するエンジニアリング / Engineering-Evolving-with-AI_final.pdf
lycorptech_jp
PRO
0
140
生まれ変わった AWS Security Hub (Preview) を紹介 #reInforce_osaka / reInforce New Security Hub
masahirokawahara
0
380
「良さそう」と「とても良い」の間には 「良さそうだがホンマか」がたくさんある / 2025.07.01 LLM品質Night
smiyawaki0820
1
440
Node-REDのFunctionノードでMCPサーバーの実装を試してみた / Node-RED × MCP 勉強会 vol.1
you
PRO
0
130
自律的なスケーリング手法FASTにおけるVPoEとしてのアカウンタビリティ / dev-productivity-con-2025
yoshikiiida
1
2.2k
WordPressから ヘッドレスCMSへ! Storyblokへの移行プロセス
nyata
0
350
ビズリーチが挑む メトリクスを活用した技術的負債の解消 / dev-productivity-con2025
visional_engineering_and_design
1
920
Featured
See All Featured
A Tale of Four Properties
chriscoyier
160
23k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
5
230
Optimizing for Happiness
mojombo
379
70k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Adopting Sorbet at Scale
ufuk
77
9.4k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Agile that works and the tools we love
rasmusluckow
329
21k
Code Review Best Practice
trishagee
69
18k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
680
Faster Mobile Websites
deanohume
307
31k
Transcript
Firestoreを使ってメディアアプリを 作ってみた
Masahiro Higuchi / 樋口雅拓 • グリーグループのリミア株式会社で、LIMIA という住まい領域のメディアを 作っています。ゲーム会社ですが、最近はメディアに力を入れています。 • 機械学習のエンジニアですが、iOS,
Android,JSなどもやっている何でも屋 です。4歳の娘のパパ。twitter: @mahiguch1 • https://limia.jp/ • https://arine.jp/ • https://aumo.jp/ • https://www.mine-3m.com/mine/
LIMIAとは? • メディアサービス • 記事一覧を表示し、タップすると 記事詳細を閲覧できる。 • 記事詳細の最下部に別の記事 への回遊導線が付いている
興味があること LIMIAに最も適したシステムは、何だろう? • インフラ: Kubernetes/ECS/Lambda/CF/Firebase • Backend FW: gin/Laravel/Django/Rails/protobuf/使わない •
アプリ: MVC/MVVM/VIPER/クリーンアーキテクチャ 選択肢が多すぎて、よくわからない! → とりあえず色々試してみよう。
今回試したこと • インフラ: Kubernetes/ECS/Lambda/CF/Firebase • Backend FW: gin/Laravel/Django/Rails/protobuf/使わない • アプリ:
MVC/MVVM/VIPER/クリーンアーキテクチャ Firebase/Firestoreを使って、メディアアプリを作ってみました。 インフラ構築面倒なので、まずはアプリだけでできるものを。w
Firestoreの説明
Firestoreとは? • FirestoreはFirebaseの機能の一つ。Document Databaseと呼ばれるも の。2019年1月31日にGAになった。 • SDKがあり、iOS/Androidから直接アクセス可能。 • データの入力はFirebase管理画面から可能。 —>
つまり、アプリ実装のみで、ClientServer型のシステムを構築できる!
Firestoreのモデル • Document DatabaseとはNoSQLの一種。 • OracleやMySQLといったRDBでは事前にSchemaを定義しておくが、Document Databaseで は後から自由に変更できる。 jsonをそのまま格納できるイメージ。 •
データはDocumentという場所に格納され、それが Collectionでまとめられている。 • 分かりやすくMySQLで例えると、Collectionがテーブル、Documentがレコード。 —> 正直分かりづらいと思うので、画面とコードを見ながら説明していきます!
Firestoreへのデータ入力方法 • 左: コレクション • 中: ドキュメント • 右: ドキュメントの中身
管理画面があるので、ここから 入力できる。
Firestoreからのデータ取得方法 Collectionと Documentを指 定することで取得 可能。
Firestoreから複数データ取得方法 SQLのように whereで絞り込み が可能
では本題
今回作った検証アプリについて 記事の一覧を表示したい。画面には、記事画像、記事タイトル、ユーザ名が表示され ている。Modelとしては、Firestoreで次のように持つ。 • Article: id, title, image_url, user_id •
User: id, name つまり、ArticleとUserの両方のデータを使って一覧表示を作る。 普通はRDBでjoinするかBFF APIを作るが、Firestoreで実装するとどうなるか試して みた。
None
まとめ • 体感速度は思ったより早い。 • データ取得処理がかなり複雑になる。 • 次は同じモデルをgolang+grpcのサーバと通信させて速度比較してみた い。 ご静聴、ありがとうございました!