8000 initial commit · homebaseio/homebase-react@f08a213 · GitHub
[go: up one dir, main page]
Skip to content

Commit f08a213

Browse files
becomingbabymanbecomingbabyman
committed
initial commit
initial commit
0 parents  commit f08a213

22 files changed

+4124
-0
lines changed

‎.github/workflows/main.yml

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
name: Build Examples
2+
3+
on:
4+
push:
5+
branches: [ master ]
6+
pull_request:
7+
branches: [ master ]
8+
9+
jobs:
10+
build:
11+
12+
runs-on: ubuntu-latest
13+
14+
steps:
15+
- name: Checkout 🛎️
16+
uses: actions/checkout@v2 # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly.
17+
with:
18+
persist-credentials: false
19+
20+
- name: Install and Build 🔧
21+
run: |
22+
npm install
23+
npx shadow-cljs compile :dev
24+
25+
- name: Deploy 🚀
26+
uses: JamesIves/github-pages-deploy-action@releases/v3
27+
with:
28+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
29+
BRANCH: gh-pages # The branch the action should deploy to.
30+
FOLDER: public # The folder the action should deploy.

‎.gitignore

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
node_modules/
2+
public/js
3+
4+
/target
5+
/checkouts
6+
/src/gen
7+
8+
pom.xml
9+
pom.xml.asc
10+
*.iml
11+
*.jar
12+
*.log
13+
.shadow-cljs
14+
.idea
15+
.lein-*
16+
.nrepl-*
17+
.DS_Store
18+
.calva
19+
20+
.hgignore
21+
.hg/

‎LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2020 Caboodle Information Inc.
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
# Homebase React
2+
3+
> The graph database for simple React state management
4+
5+
## Installation
6+
7+
```bash
8+
# NPM
9+
npm install homebase-react --save
10+
11+
# Yarn
12+
yarn add homebase-react
13+
```
14+
15+
## Docs
16+
https://www.notion.so/Homebase-Alpha-Docs-0f0e22f3adcd4e9d87a13440ab0c7a0b
17+
18+
## Examples
19+
https://homebaseio.github.io/homebase-react
20+
21+
## Purpose
22+
23+
We want software to be [local-first](https://news.ycombinator.com/item?id=21581444). That means we need to make it more convenient to work with complex data on clients.
24+
25+
Homebase React lets you plug a relational database into your React app.
26+
27+
- Replace Redux with something simpler and more declarative
28+
- Gain all the benefits of relational data like a single source of truth
29+
- Query your database with a convenient JSON query syntax
30+
- Query your database with datalog if you need more power
31+
- Traverse your data graph like it's one big JSON object
32+
33+
It is immediately more intuitive than a denormalized JSON store, and over time it will get better as we add more local-first features to it.
34+
35+
## Roadmap
36+
37+
1. Improve performance
38+
1. Document integration with backends
39+
1. Swap [Datascript](https://github.com/tonsky/datascript) out for [Datahike](https://github.com/replikativ/datahike)
40+
1. Immutability
41+
1. History / Change Tracking
42+
1. Persist to IndexDB
43+
1. Local-first conflict resolution for offline caching and sync between multiple devices
44+
45+
## API Overview
46+
47+
### `HomebaseProvider`
48+
49+
```js
50+
import { HomebaseProvider, useEntity, useTransact, useQuery } from 'homebase-react'
51+
52+
const config = {
53+
// Schema is optional
54+
// ref indicates a relationship
55+
// unique enforces a uniqueness constraint
56+
schema: {
57+
todo: {
58+
project: { type: 'ref' },
59+
name: { unique: 'identity' }
60+
}
61+
},
62+
initialData: [
63+
{ project: { id: -1, name: 'Do it' } }
64+
{ todo: { project: -1, name: 'Make it' }}
65+
]
66+
}
67+
68+
const RootComponent = () => (
69+
<HomebaseProvider config={config}>
70+
<App/>
71+
</HomebaseProvider>
72+
)
73+
```
74+
75+
### `useEntity` and `entity.get`
76+
77+
```js
78+
// Entities with unique attributes can be retrieved by those attributes
79+
const [todo] = useEntity({ todo: { name: 'Make it' } })
80+
81+
// Get attributes off an entity
82+
todo.get('name') // => 'Make it'
83+
todo.get('id') // => 2
84+
85+
// You can also get an entity by its id
86+
const [sameTodo] = useEntity(2)
87+
88+
// And traverse relationships
89+
todo.get('project', 'name') // => 'Do it'
90+
```
91+
92+
### `useTransact`
93+
94+
```js
95+
const transact = useTransact()
96+
97+
// A transaction is an array of nested objects
98+
transact([{ todo: { name: 'New Todo', project: 1 } }])
99+
100+
// Update an entity by including its id
101+
transact([{ project: { id: 1, name: 'Changed Project Title' } }])
102+
103+
// Delete an entity with retractEntity and its id
104+
transact([['retractEntity', 1]])
105+
```
106+
107+
### `useQuery`
108+
109+
```js
110+
// Finds any todo with a name
111+
const [todos] = useQuery({
112+
$find: 'todo',
113+
$where: { todo: { name: '$any' } }
114+
})
115+
116+
// Returns an array of todo entities
117+
todos.map(todo => todo.get('name'))
118+
```
119+
120+
## Development
121+
122+
```bash
123+
npx shadow-cljs watch :dev
124+
```
125+
126+
Open http://localhost:3000
127+
128+
129+
## Authors
130+
131+
- Chris Smothers ([@csmothers](https://twitter.com/csmothers)) – [Homebase](https://www.homebase.io/)
132+
- JB Rubinovitz ([@rubinovitz](https://twitter.com/rubinovitz)) – [Homebase](https://www.homebase.io/)

‎js/.babelrc

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"plugins": [
3+
"@babel/plugin-transform-react-jsx"
4+
]
5+
}

‎js/README.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
# Put JS dialects like JSX here
2+
3+
ShadowCLJS needs dialects like JSX to be pre-processed before use in CLJS https://shadow-cljs.github.io/docs/UsersGuide.html#_javascript_dialects
4+
5+
Run babel after editing a file here and import it from the src/js_gen file when using it in CLJS.
6+
```bash
7+
npx babel js --out-dir src/js_gen
8+
```

‎js/counter-example.jsx

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import React from 'react'
2+
const { HomebaseProvider, useTransact, useEntity } = window.homebase.react
3+
4+
const config = {
5+
initialData: [{
6+
counter: {
7+
identity: 'counter',
8+
count: 0
9+
}
10+
}]
11+
}
12+
13+
export const App = () => (
14+
<HomebaseProvider config={config}>
15+
<Counter/>
16+
</HomebaseProvider>
17+
)
18+
19+
const Counter = () => {
20+
const [counter] = useEntity({ identity: 'counter' })
21+
const [transact] = useTransact()
22+
return (
23+
<div>
24+
Count: {counter.get('count')}
25+
<div>
26+
<button onClick={() => transact([{
27+
counter: {
28+
id: counter.get('id'),
29+
count: counter.get('count') + 1
30+
}
31+
}])}>
32+
Increment
33+
</button>
34+
</div>
35+
</div>
36+
)
37+
}

0 commit comments

Comments
 (0)
0