Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Firestoreを使ってメディアアプリを作ってみた
Search
mahiguch
May 27, 2019
Programming
490
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Firestoreを使ってメディアアプリを作ってみた
「集まれKotlin好き!Kotlin愛好会 vol.11」の講談資料です。
mahiguch
May 27, 2019
More Decks by mahiguch
See All by mahiguch
爆速で成長する おでかけ情報サービスの成長を支えるデザインと開発の取り組みについて
mahiguch
0
87
WebView認証連携
mahiguch
0
95
メディアアプリLIMIAにおけるプッシュ通知配信システム
mahiguch
0
120
公式部活動技術書典部の活動紹介
mahiguch
0
140
エンジニア以外の方が自らSQLを使ってセグメント分析を行うカルチャーをどのように作っていったか
mahiguch
1
1.1k
PHPからgoへの移行で分かったこと
mahiguch
2
4.4k
BigQueryを使った機械学習プロジェクトの分析とオフライン検証
mahiguch
2
1.3k
gRPCを使ったメディアサービス2
mahiguch
0
250
LIMIAでのBigQuery活用事例
mahiguch
0
230
Other Decks in Programming
See All in Programming
SREの越境 / SRE Collaboration
y0hgi
2
300
Starting & Sustaining Code-Based E2E Testing for Non-Coding QA Teams( #jasstniigata )
teyamagu
PRO
1
980
コードで差別化できない時代の ソフトウェアエンジニアリング / Software Engineering in an Era Where Code Doesn’t Differentiate
kishida
2
170
Androidだけじゃない、DroidKaigiで広がった私の技術スタック
akkeylab
0
130
phperだってパンチカードでコーディングしたい
o0h
PRO
0
300
速く作れる。その次は、速く確かめられる開発へ 〜AIネイティブ開発を支える、Shift Down〜 / Can build fast. Next, moving to development where we can verify fast.
rkaga
8
6k
Unity6 URPによる海底をテーマにしたVJシステムの解説 | Unity Shader 完全に理解した 勉強会
gam0022
0
360
ChromeでローカルLLM
ryu1013
0
120
残高管理から台帳サービスへの進化
artoy
1
200
現場と育てるRailsモデリング 〜Spreadsheetから始めたモデル設計〜
siroemk
1
180
Turning Architecture into Unit Tests in the AI Era (NSSpain XIV)
steliosf
PRO
1
140
コーディング自動化の次へ。人の介入をゼロにするファクトリーとサポートAIによる実践
timakin
0
1.4k
Featured
See All Featured
Paper Plane (Part 1)
katiecoart
PRO
2
11k
Building Applications with DynamoDB
mza
96
7.2k
Test your architecture with Archunit
thirion
2
2.4k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
1
620
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
35
2.9k
Typedesign – Prime Four
hannesfritz
42
3.2k
We Are The Robots
honzajavorek
0
400
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
12k
How STYLIGHT went responsive
nonsquared
100
6.3k
The agentic SEO stack - context over prompts
schlessera
0
970
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
260
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
490
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のサーバと通信させて速度比較してみた い。 ご静聴、ありがとうございました!