Linking Firebase Databse with Signup
This commit is contained in:
parent
1e968638ab
commit
ea64819d91
41
src/App.js
41
src/App.js
|
@ -14,6 +14,7 @@ import { Signup } from "./pages/Signup"
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
const FBapp = initializeApp(FirebaseConfig)
|
const FBapp = initializeApp(FirebaseConfig)
|
||||||
|
const FBauth = getAuth(FBapp)
|
||||||
// navigation array
|
// navigation array
|
||||||
const navItems = [
|
const navItems = [
|
||||||
{ label: "Home", link: "/" },
|
{ label: "Home", link: "/" },
|
||||||
|
@ -22,31 +23,41 @@ function App() {
|
||||||
{ label: "Create Account", link: "/signup" },
|
{ label: "Create Account", link: "/signup" },
|
||||||
{ label: "Log in", link: "/signin" },
|
{ label: "Log in", link: "/signin" },
|
||||||
]
|
]
|
||||||
// navigation for authenticated user
|
// navigation for authenticated user
|
||||||
const AuthnavItems = [
|
const AuthnavItems = [
|
||||||
{ label: "Home", link: "/" },
|
{ label: "Home", link: "/" },
|
||||||
{ label: "About", link: "/about" },
|
{ label: "About", link: "/about" },
|
||||||
{ label: "Contact", link: "/contact" },
|
{ label: "Contact", link: "/contact" },
|
||||||
{ label: "Log out", link: "/signout"}
|
{ label: "Log out", link: "/signout" }
|
||||||
]
|
]
|
||||||
|
|
||||||
/// application states
|
/// application states
|
||||||
const [nav, setNav ] = useState( navItems )
|
const [nav, setNav] = useState(navItems)
|
||||||
|
|
||||||
|
|
||||||
const saySomething = ( word ) => {
|
const saySomething = (word) => {
|
||||||
alert( word )
|
alert(word)
|
||||||
|
}
|
||||||
|
|
||||||
|
// signing up a user
|
||||||
|
const signUp = (email, password) => {
|
||||||
|
createUserWithEmailAndPassword(FBauth, email, password)
|
||||||
|
.then((userCredential) => {
|
||||||
|
// do something
|
||||||
|
})
|
||||||
|
.catch((error) => console.log(error.message))
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<div className="App">
|
<div className="App">
|
||||||
<Header items={nav}/>
|
<Header items={nav} />
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/" element={ <Home greeting="Hey you're at home!" /> } />
|
<Route path="/" element={<Home greeting="Hey you're at home!" />} />
|
||||||
<Route path="/about" element={ <About greeting="Hey you, this is about page!" handler={saySomething} /> } />
|
<Route path="/about" element={<About greeting="Hey you, this is about page!" handler={saySomething} />} />
|
||||||
<Route path="/contact" element={ <Contact greeting="Hey you, this is contact page!" /> } />
|
<Route path="/contact" element={<Contact greeting="Hey you, this is contact page!" />} />
|
||||||
<Route path="/signup" element={ <Signup/> } />
|
<Route path="/signup" element={<Signup />} />
|
||||||
</Routes>
|
</Routes>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
export default App;
|
|
||||||
|
export default App;
|
Loading…
Reference in New Issue