https://github.com/geekyants/geekymodel
GeekyModel - Opinionated State Container for Remote and Local Storage with a Database-like API powered by MobX
https://github.com/geekyants/geekymodel
front-end mobx orm-framework react state-management
Last synced: 8 months ago
JSON representation
GeekyModel - Opinionated State Container for Remote and Local Storage with a Database-like API powered by MobX
- Host: GitHub
- URL: https://github.com/geekyants/geekymodel
- Owner: GeekyAnts
- Created: 2019-07-18T10:17:33.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T05:11:12.000Z (over 3 years ago)
- Last Synced: 2025-06-16T08:15:02.274Z (about 1 year ago)
- Topics: front-end, mobx, orm-framework, react, state-management
- Language: TypeScript
- Homepage:
- Size: 1.92 MB
- Stars: 6
- Watchers: 2
- Forks: 3
- Open Issues: 24
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🗄 GeekyModel
> ## ⚠️️️️️ ⚠️️️️️ ⚠️️️️️ Not for production use ⚠️️️️️ ⚠️️️️️ ⚠️️️️️
## What is 🗄 GeekyModel?
GeekyModel is an opinionated State Container with a Database-like API powered by MobX.
The Data Models can later be mapped to a Remote service like Firebase, REST API, GraphQL etc.
## Features ⚡
- Build your front-end models **without worrying about the back-end**. GeekyModel works with LocalStorage by default.
- **Offline First**: Connect to any **back-end at a later stage**, like
- Firebase / Firestore
- GraphQL
- REST APIs
- Write request and response **middlewares to map** the differences in the front-end and the back-end models.
- Built-in standard **validation** and option to add custom validators.
- **Model Relationships**: Relate models with References and Foreign Keys.
- **Built-in Fake Data**: Populate your UI with Fake Data automatically.
## Getting started
```
yarn add geekymodel
```
OR
```
npm install geekymodel --save
```
## Writing your first model
```typescript
import { createModel } from "geekymodel";
const Todo = createModel({
table: "todos",
fields: ["caption", "isCompleted"]
});
```
#### Creating a new Todo
```ts
const newTodo = Todo.create();
newTodo.setField("caption", "Buy milk");
newTodo.setField("isCompleted", "false");
newTodo.save();
// newTodo.saving gets populated which is a MobX ObservableValue
```
#### Fetching all the todos and wiring with React
```tsx
@observable
class TodoApp extends Component {
componentWillMount() {
this.todos = Todo.findAll();
}
render() {
const { data, loading } = this.todos;
if (loading)
return Loading;
return
- {item.getField('caption')} }
{data.map(item) =>
}
}
```
#### Adding query params
```tsx
const allCompleted = Todo.where("isCaption", "=", true).get();
```
## Roadmap
- [x] Model creation with Schema
- [ ] Convert to monorepo
- [x] Injectable Transport Layer
- [ ] Connection
- [ ] FakeConnection
- [x] Improve FakeConnection to request and response on Schema
- [ ] WIP: Implement get(), find(), insert(), update() and delete() with FakeConnection()
- [ ] LocalStorageConnection
- [ ] RuntimeStorageConnection
- [ ] RuntimeMiddlewareConnection
- [ ] FirestoreConnection
- [ ] GraphQLConnection
- [ ] RestConnection
- [ ] Normalization
- [ ] Validation
- [ ] Middlewares:
- [x] Builder: For each method get(), find(), insert(), update() and delete()
- [ ] Connection: Request and Response
- [x] Namespace Global variables in Database
- [ ] Build script
- [ ] Middlewares
- [ ] Relationships
- [ ] Examples:
- [ ] Todo app
- [ ] Hacker news clone
- [ ] Shopping cart
## Decisions
- DatabaseSchema to be forwarded from top level to the connection
## Open Questions
- How would it work with offline first database which syncs later?