-
-
Labels: JavaScript, ReactNative
React Native で Firebase Realtime Database を試した
森です。今、「Firebase もくもく会(初心者向け)」に参加しています。React や redux のステートを Firebase Realtime Database に保存したら便利なんじゃないかなーと思っていたので、試しました。なおドキュメントはそんなに読み込んでいません。
試した内容
- 「追加」を押下で +1 した結果を表示する
- データは Firebase Realtime Database に保存する
- リロード時には Firebase Realtime Database に保存している値を表示する
- オフライン対応している
成果
▼ 雰囲気
気づいたコツ
- いつもであれば、setState するところで、Firebase Realtime Database にデータを送信する
- Firebase Realtime Database からのデータを変更したよイベントをリスンしておいて、そこで setState する
へー、なるほど。使ってゆきたい、というかんじ。
ランサーズではサービスを成長させてくれるエンジニア、デザイナーを募集しています!
ご興味がある方は、以下URLよりご応募ください。
【中途採用】
フロントエンドエンジニア
サーバーサイドエンジニア
コーポレートエンジニア
SREエンジニア
【新卒採用・その他】
21・22新卒
その他採用情報
関連記事
-
-
Webpack で git 管理してもよいような環境ごとに値の異なる定数を設定する方法
森です。仕事でのちょっとしたコミットをブログ記事化するシリーズです。今日は Webpack の話題です。 課題 環境ごとに値の異なる定数として、git で管理できるものと git で管理すべきではないものがあります。後者は dotenv と Webpack の …
-
-
React コンポーネントで自分の子要素を取得するときのイディオム
森です。 課題 React コンポーネントで自分の子要素を取得するときに、ref=”payjpCheckoutRef” などと指定しておいて、findDOMNode(this.refs.payjpCheckoutRef) していたら、e …
-
-
redux-persist でブラウザストレージに一部のデータを保存しつつ、ストアに復旧するまで render を防ぐには
森です。 課題 redux-persist を使っていて、ブラウザリロード時にブラウザストレージからストアにデータを復旧する前に render されるのを防ぎたい。ストアに値があることが前提のコンポーネントでエラーになるから。公式ドキュメントとしてレシピがあっ …