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
react-nativeで無理やりsequelize(ORM)を使った話
Search
S-cubism
October 20, 2017
Technology
2
730
react-nativeで無理やりsequelize(ORM)を使った話
S-cubism
October 20, 2017
Tweet
Share
More Decks by S-cubism
See All by S-cubism
WSLでreactの開発環境作った話
scubism
0
700
未経験者がAndroidアプリをリリースするまで
scubism
0
130
scubism_LT_20180223_細田謙二_イベントソーシング
scubism
0
160
REVEAL.JSをちょっとだけ使ってみた
scubism
0
260
忙しい人のための仮想通貨
scubism
0
110
サーバ作業の注意コマンド
scubism
0
130
最近勉強してること、次にやりたいこと
scubism
0
110
FOOD TECH
scubism
0
67
Firebase(Realtime Database)について
scubism
0
130
Other Decks in Technology
See All in Technology
KMP の Swift export
kokihirokawa
0
340
プロポーザルのコツ ~ Kaigi on Rails 2025 初参加で3名の登壇を実現 ~
naro143
1
160
AI時代こそ求められる設計力- AWSクラウドデザインパターン3選で信頼性と拡張性を高める-
kenichirokimura
3
160
10年の共創が示す、これからの開発者と企業の関係 ~ Crossroad
soracom
PRO
1
640
リーダーになったら未来を語れるようになろう/Speak the Future
sanogemaru
0
350
スタートアップにおけるこれからの「データ整備」
shomaekawa
2
310
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
3
20k
空間を設計する力を考える / 20251004 Naoki Takahashi
shift_evolve
PRO
4
440
Shirankedo NOCで見えてきたeduroam/OpenRoaming運用ノウハウと課題 - BAKUCHIKU BANBAN #2
marokiki
0
170
自動テストのコストと向き合ってみた
qa
0
200
Where will it converge?
ibknadedeji
0
200
PLaMo2シリーズのvLLM実装 / PFN LLM セミナー
pfn
PRO
2
1k
Featured
See All Featured
Unsuck your backbone
ammeep
671
58k
Speed Design
sergeychernyshev
32
1.1k
Git: the NoSQL Database
bkeepers
PRO
431
66k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
GitHub's CSS Performance
jonrohan
1032
460k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
9
580
How to Think Like a Performance Engineer
csswizardry
27
2k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.1k
Facilitating Awesome Meetings
lara
56
6.6k
Faster Mobile Websites
deanohume
310
31k
Side Projects
sachag
455
43k
The World Runs on Bad Software
bkeepers
PRO
71
11k
Transcript
react-nativeで 無理やりsequelize(ORM)を使った話 2017/10/20 エスキュービズム社内技術LT 久米 諒
はじめに • ReactNativeを使って新しいプロダクトを開発中 • ターゲットのプラットフォームは以下の2つ – iOS – Windows (UWP)
• そのプロダクトにはDBが必要 – サーバにある情報をローカルにキャッシュ – 作成したデータをサーバに送る前に保存しておく、など • 今日はDBに何を採用したかのお話
採用するDB • 旧プロダクトでは、下記を使っていた – iOS : CoreData (SQLiteバックエンド) – Windows(StoreApp)
: SQLite • ReactNativeでは、以下の点で考慮が必要 – 複数のプラットフォームで動かす必要がある – JavaScriptから利用する – 数万件のレコードを扱うため、パフォーマンスが重要 • 検索処理は必ずDBエンジン側で行う必要がある(全件取得してからjsで 絞り込むのはNG) • DB以外にも永続化の手段はあるが、大体この制約に引っかかる
ReactNativeで採用するDB • ReactNativeでは、nodejs向けのパッケージマネージャーで あるnpmをそのまま利用できる • ファイル読み込みやDBアクセスなど、IOを伴うnodejs用の ライブラリはほとんど使えないが、react-native向けのライ ブラリが多数公開されている • 今回はreact-native-sqlite-2を使うことに
– https://www.npmjs.com/package/react-native-sqlite-2 • (RealmはUWP × ReactNativeの組み合わせで使えないので断念)
ORMの利用検討 • react-native-sqlite-2はSQLiteをJSから使えるようにしただけ のライブラリ • 基本的にSQLを書いて利用する想定のモノ • 生SQLを書きたくない! • 通常npmで提供されているライブラリはnodejs用
• react-native対応を謳った実用レベルのORMはまだ無い • nodejs用のライブラリをreact-nativeで無理やり使えない か?
補足 : ReactNativeでのjsトランスパイル • ReactNativeは書いたjsを直接実行するのではなく、一旦 babelというツールで変換(トランスパイル)する • 最新のEcmaScript(JavaScript)仕様で書いたコードが、既存 の環境で実行できる様に古いjs形式に変換される •
ソースコードは複数のjsファイルに分割され、importや requireで参照しているが、トランスパイル時にはこれは1つ のjsbundleファイルにまとめられる main.jsbundle xxx.js yyy.js zzz.js aaaa.js import import require
ORMの選定 • npmのsqlite3パッケージは当然使えないが、react-native- sqlite-2に差し替えれば良いのでは? • module-resolverというbabelプラグインがあった! – 設定ファイルでrequire/importの参照を置換できる – https://github.com/tleunen/babel-plugin-module-resolver
ORMの選定 • 候補は2つ • Bookshelf – http://bookshelfjs.org/ – 動的なrequireがあったので、Babelが対応できず… •
Sequelize – http://docs.sequelizejs.com/ – mysqlなど他のDBへの参照も大量にあったが、全部ダミーに差し 替えれば動いた!
参考 : module-resolverの設定 • babelrc
Sequelize導入のメリット • クエリがjsonで表現できる • マイグレーションシステムを導入できた • 簡単にDB処理をユニットテストできるようになった
react-nativeでsequelizeを使うリスク • 通常、ライブラリを公開されていない手段で利用するのは 悪手 • 以下の理由から、今回は使っても良いと判断 – 仮にsequelizeの仕様が変更されても、module-resolverの設定を 書き換えれば大体追従できるはず –
module-resolverのコード量が少なく、いざとなれば自分で作れそ う – DBアクセスをリポジトリクラスに限定しているので、最悪他のDB に移行することも容易