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
740
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
710
未経験者がAndroidアプリをリリースするまで
scubism
0
140
scubism_LT_20180223_細田謙二_イベントソーシング
scubism
0
160
REVEAL.JSをちょっとだけ使ってみた
scubism
0
270
忙しい人のための仮想通貨
scubism
0
120
サーバ作業の注意コマンド
scubism
0
140
最近勉強してること、次にやりたいこと
scubism
0
110
FOOD TECH
scubism
0
70
Firebase(Realtime Database)について
scubism
0
130
Other Decks in Technology
See All in Technology
Agentic AIが変革するAWSの開発・運用・セキュリティ ~Frontier Agentsを試してみた~ / Agentic AI transforms AWS development, operations, and security I tried Frontier Agents
yuj1osm
0
160
[PR] はじめてのデジタルアイデンティティという本を書きました
ritou
0
370
re:Invent2025 セッションレポ ~Spec-driven development with Kiro~
nrinetcom
PRO
2
160
意外と知らない状態遷移テストの世界
nihonbuson
PRO
1
360
Oracle Database@Azure:サービス概要のご紹介
oracle4engineer
PRO
3
220
「もしもデータ基盤開発で『強くてニューゲーム』ができたなら今の僕はどんなデータ基盤を作っただろう」
aeonpeople
0
270
The State of AI Agent Security:2025年の総括と2026年の宿題
pict3
0
110
アラフォーおじさん、はじめてre:Inventに行く / A 40-Something Guy’s First re:Invent Adventure
kaminashi
0
190
20251203_AIxIoTビジネス共創ラボ_第4回勉強会_BP山崎.pdf
iotcomjpadmin
0
160
[Neurogica] 採用ポジション/ Recruitment Position
neurogica
1
140
AI との良い付き合い方を僕らは誰も知らない
asei
1
310
2025年のデザインシステムとAI 活用を振り返る
leveragestech
0
560
Featured
See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
1k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.1k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
0
26
Google's AI Overviews - The New Search
badams
0
880
The Curious Case for Waylosing
cassininazir
0
200
[SF Ruby Conf 2025] Rails X
palkan
0
660
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Code Review Best Practice
trishagee
74
19k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
180
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.5k
Building Flexible Design Systems
yeseniaperezcruz
330
39k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
286
14k
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 に移行することも容易