https://firebase.google.com/docs/database/web/start?authuser=0
https://youtu.be/azdwN_4IDKA
https://create-react-app.dev/docs/adding-bootstrap/#using-a-custom-theme
terminal
npx create-react-app xxx-app-name
cd xxx-app-name
code .
vscode
npm i firebase
npm i uid
firebase
new web app
SDK setup and configuration
vscode
firebase.js
import { initializeApp } from "firebase/app";
import { getDatabase } from "firebase/database";
const firebaseConfig{
apiKey: "your api key";
authDomain: "your authDomain";
databaseURL: "your dbURL";
projectId: "your projectId";
storageBucket: "your storageBucket";
messagingSenderId: "your messagingSenderId";
appId: "your appId";
};
const app = initializeApp(firebaseConfig);
export const db = getDatabase(app);
firebase > realtime database
rules
{
"rules": {
".read": true,
".write": true
}
}
vscode
App.js
text input
import { db } from "./firebase"
//firebase.js
import { uid } from "uid"
function App(){
return(
<div>
<input type="text" />
<button>submit</button>
</div>)
}
write
const writeToDatabase = () => {
const uuid = uid();
set(ref(db, `/${uuid)`}, {
todo,
uuid,
});
};
Top comments (0)