Quick Start
We recommend everyone start by enabling custom chrome formatters for a much better debugging experience.
Ok. Let's get going.
Homebase React creates a local relational database for your React app.
Adding HomebaseProvider automatically creates the database.
1import { HomebaseProvider } from 'homebase-react'
2
3const config = { initialData: [{ counter: { id: 1, count: 0 }}] }
4
5const RootComponent = () => (
6 <HomebaseProvider config={config}>
7 <App/>
8 </HomebaseProvider>
9)Read from and write to that database via hooks.
1import { useCallback } from 'react'
2import { useEntity, useTransact } from 'homebase-react'
3
4const App = () => {
5 const [counter] = useEntity(1)
6 const [transact] = useTransact()
7
8 const handleClick = useCallback(() => {
9 transact([{ counter: {
10 id: 1, count: counter.get('count') + 1
11 } }])
12 }, [counter, transact])
13
14 return (
15 <button onClick={handleClick}>
16 Increment
17 {counter.get('count')}
18 </button>
19 )
20}For a step by step guide take a look at the tutorial.
Check out the API docs to learn about our other hooks like useQuery and useClient.