npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

provide-crud

v1.0.3

Published

Provider factory for Creating, Reading, Updating, and Deleting resources.

Downloads

16

Readme

provide-crud

build status npm version npm downloads

Provider factory for Creating, Reading, Updating, and Deleting resources.

Table of contents

  1. Installation
  2. Usage
  3. Example
  4. Real world example
  5. Protip

Installation

npm install provide-crud --save

Usage

provideCrud (String name, Optional Object init, Optional Object replication, Optional Array clientStateKeys)

Creates a provider with namespaced actions and reducers specific to CRUD operations.

The init object should contain a map of the unprefixed reducerKeys to their initial states. Each key will be prefixed (namespaced) with the name and become each reducerKey and will have actions which can be used to set each state. The only reserved keys for this object are id (defaults to empty string) and deleted (defaults to false). You can set a different default id or deleted initial state by including your own within this object, if necessary.

Sane defaults are added to the replication object if they're undefined. All reducerKeys are replicated and queryable by default. And the baseQuery ensures that only instances which have not been deleted are queried by default.

The provider key also defaults to:

const key = ({ props }) => props[idKey] ? `${idKey}=${props[idKey]}` : null;

You can override this key by simply setting it on the created provider object afterwards, if necessary.

Example

Let's create a test provider, with testFoo and testBar as states to be created/updated/deleted. The testFoo state will default to "foo", and the testBar state will default to "bar".

// src/providers/test.js

import provideCrud from 'provide-crud';

const test = provideCrud('test', {
  foo: 'foo',
  bar: 'bar'
});

export default test;

You'll then have a provider with the following actions:

  • createTest (Object state, Function genId, Optional Function onSuccess)
  • updateTest (Object updates, Optional Function onSuccess)
  • deleteTest (Optional Function onSuccess)
  • undeleteTest (Optional Function onSuccess)
  • setTestFoo (Mixed testFoo)
  • setTestBar (Mixed testBar)

And reducers:

  • testId
  • testDeleted
  • testFoo
  • testBar

Real world example

See provide-user. Also see Lumbur's user login component for an example where this is used.

Protip

Use provide-id-gen for your genId argument when creating an instance!