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
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
mahiguch
May 27, 2019
Programming
470
0
Share
Firestoreを使ってメディアアプリを作ってみた
「集まれKotlin好き!Kotlin愛好会 vol.11」の講談資料です。
mahiguch
May 27, 2019
More Decks by mahiguch
See All by mahiguch
爆速で成長する おでかけ情報サービスの成長を支えるデザインと開発の取り組みについて
mahiguch
0
67
WebView認証連携
mahiguch
0
84
メディアアプリLIMIAにおけるプッシュ通知配信システム
mahiguch
0
110
公式部活動技術書典部の活動紹介
mahiguch
0
130
エンジニア以外の方が自らSQLを使ってセグメント分析を行うカルチャーをどのように作っていったか
mahiguch
1
1.1k
PHPからgoへの移行で分かったこと
mahiguch
2
4.3k
BigQueryを使った機械学習プロジェクトの分析とオフライン検証
mahiguch
2
1.2k
gRPCを使ったメディアサービス2
mahiguch
0
240
LIMIAでのBigQuery活用事例
mahiguch
0
220
Other Decks in Programming
See All in Programming
Fundamentals of Software Engineering In the Age of AI
therealdanvega
2
310
OTP を自動で入力する裏技
megabitsenmzq
0
130
AWS×クラウドネイティブソフトウェア設計 / AWS x Cloud-Native Software Design
nrslib
16
3.5k
夢の無限スパゲッティ製造機 -実装篇- #phpstudy
o0h
PRO
0
180
条件判定に名前、つけてますか? #phperkaigi #c
77web
2
900
AI時代のシステム設計:ドメインモデルで変更しやすさを守る設計戦略
masuda220
PRO
6
1.1k
モックわからないマン卒業記 ~振る舞いを起点に見直した、フロントエンドテストにおけるモックの使いどころ~
tasukuwatanabe
3
440
[PHPerKaigi 2026]PHPerKaigi2025の企画CodeGolfが最高すぎて社内で内製して半年運営して得た内製と運営の知見
ikezoemakoto
0
310
AI 開発合宿を通して得た学び
niftycorp
PRO
0
180
車輪の再発明をしよう!PHP で実装して学ぶ、Web サーバーの仕組みと HTTP の正体
h1r0
2
470
今こそ押さえておきたい アマゾンウェブサービス(AWS)の データベースの基礎 おもクラ #6版
satoshi256kbyte
1
220
仕様漏れ実装漏れをなくすトレーサビリティAI基盤のご紹介
orgachem
PRO
8
3.8k
Featured
See All Featured
AI: The stuff that nobody shows you
jnunemaker
PRO
4
500
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
300
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.8k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
92
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
1
3.5k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.2k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
Abbi's Birthday
coloredviolet
2
6.1k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
150
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
320
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のサーバと通信させて速度比較してみた い。 ご静聴、ありがとうございました!