@slvi/data
v1.0.2
Published
SLVI/Data is an abstraction over the Store, Effects, and Entity that radically reduces the amount of code you'll write. As with any abstraction, while you gain simplicity, you lose the explicitness of direct interaction with the supporting NgRx libraries.
Downloads
2
Maintainers
Readme
SLVI-DM
SLVI Data Management
Many applications have substantial domain models with 10s or 100s of entity types.
Such applications typically create, retrieve, update, and delete entity data that are "persisted" in a database of some sort, hosted on a remote server.
Developers who build these apps with the NgRx Store, Effects, and Entity libraries alone tend to write a large number of actions, action-creators, reducers, effects, dispatchers, and selectors as well as the HTTP GET, PUT, POST, and DELETE methods for each entity type. There will be a lot of repetitive code to create, maintain, and test. The more entities in your model, the bigger the challenge.
With SLVI/Data you can develop large entity models quickly with very little code and without knowing much NgRx at all. Yet all of NgRx remains accessible to you, when and if you want it.
SLVI/Data is an abstraction over the Store, Effects, and Entity that radically reduces the amount of code you'll write. As with any abstraction, while you gain simplicity, you lose the explicitness of direct interaction with the supporting NgRx libraries.
This library was made with Love, generated with Nx.
Default Level (Component Level)
- Inject
DataSandBoxFactory
in your componentconstructor()
. - Ask your factory to create your sandBox immediately then follow this code example.
once you finished, you already got your sandBox and you can call any function as much as you need.
import { DataSandBoxFactory, DataSandBoxService } from '@slvi/data'; ... export class Component { ... sandBox: DataSandBoxService; // Define sandBox Variable in Component ... constructor( ... private factory: DataSandBoxFactory, // Factory Injection ... ) {} ngOnInit(): void { // Or Here this.sandBox = this.factory.create('ENTITY_ID', 'ENDPOINT_ID'); } }
Advanced Level (SandBox Level - For More control)
- Create your own
@Injectable() CustomSandBox
extendsDataSandBoxService
to inherit everything. - Inject your
CustomSandBox
in your componentconstructor()
.
Start using it normally same as default or implement your custom methods.
import { DataSandBoxService } from '@slvi/data'; ... export class CustomSandBox extends DataSandBoxService { constructor() { super('ENTITY_ID', 'ENDPOINT_ID'); } }
export class Component { constructor( ... private sandBox: CustomSandBox, ... ) {} }
Usage
One-Entity / single-Item
For manipulating operations for (one-entity) use:
// Body is Optional this.sandBox.create(BODY); this.sandBox.read(ITEM_ID); this.sandBox.update(ITEM_ID, BODY); this.sandBox.delete(ITEM_ID); ... // For forcing calling API ignoring cache. this.sandBox.readForced(ITEM_ID);
Subscribe
item$
property insandBox
to get current item in store or simply useitem$ | async
in your HTML.this.sandBox.item$.subscribe((item) { // Implement your own code })
List-of-Entities / Many-of-Items
For manipulating operations for (bulk/list-entities) use:
// Body is Optional this.sandBox.createBulk(BODY); this.sandBox.listRead(QUERY_PARAMS); this.sandBox.bulkUpdate(ITEMS_IDS, BODY); this.sandBox.bulkDelete(ITEMS_IDS, BODY); ... // Special Case :: For Infinity scroll or follow pagination to fetch all data with max response limit this.sandBox.listReadInfinity(QUERY_PARAMS); ... // For forcing calling API ignoring cache this.sandBox.readForced(QUERY_PARAMS);
You can Subscribe
items$
property insandBox
to get current items in store.this.sandBox.items$.subscribe((items) { // Implement your own code })