react-firebase-observable

    1.0.5 • Public • Published

    React Firebase Observable

    Reactjs firebase data observable using mobx.

    import { observer, useFirebaseObservable } from "react-firebase-observable";
     
    export const App = observer(() => {
      const initialState = {
        scores: [ { name: "User 0", score: 0 } ],
        question: "..."
      };
      const firebaseConfig = {...};
      const data = useFirebaseObservable(firebaseConfig, initialState);
     
      return (
        <div className="App">
          <h2>Firebase Observable!</h2>
          <div>{data.question}</div>
          <UserList scores={scores} />
          <button onClick={() => { data.question = "question A" }}>
            Change A
          </button>
          <button onClick={() => { data.question = "question B" }}>
            Change B
          </button>
        </div>
      );
    });

    How to Use

    Wrap your component with observer function, and config your observable firebase inside the observer function

    Read Data

    Use the keyname of the data directly: data.question it will be binded automatically with the update

    Write Data

    Do mutation directly on the data: data.question = 'new value'.

    Keywords

    none

    Install

    npm i react-firebase-observable

    DownloadsWeekly Downloads

    7

    Version

    1.0.5

    License

    none

    Unpacked Size

    6.17 kB

    Total Files

    4

    Last publish

    Collaborators

    • webrangeriit