create-react-app + firebaseRDB

create-react-app

とりま

create-react-app myapp

Happy hacking!!!

firebaseでプロジェクト作る

firebaseをinstallして初期化

npm install firebase --save
firebase login
firebase init

メタルっぽい炎が出てくる。
適当に使うもの選んでエンター
さっき作ったプロジェクトを選択する

srcの下にfirebaseの設定ファイル置いとく

firebaseのページから設定情報取ってくる

src/firebase/index.js

import firebase from 'firebase';
import { firebaseConfig } from './config.js';

export const firebaseApp = firebase.initializeApp(firebaseConfig);
export const firebaseDb = firebaseApp.database();

src/firebase/config.js

// Initialize Firebase
export const firebaseConfig = {
    apiKey: "xxxxxxxxxxx",
    authDomain: "xxxxxxxxxxx",
    databaseURL: "xxxxxxxxxxx",
    projectId: "xxxxxxxxxxx",
    storageBucket: "xxxxxxxxxxx",
    messagingSenderId: "xxxxxxxxxxx"
};

App.jsでDB情報読み込む

src/App.js

import { firebaseDb } from './firebase/index.js'

ビルドしてデプロイ

npm run build
firebase deploy