Gathering detailed insights and metrics for redux-data-service
Gathering detailed insights and metrics for redux-data-service
Connect seamlessly to any API using first class Models, customizable serialization, validation, dependency injection and TypeScript type-safety
Installations
npm install redux-data-serviceDeveloper Guide
BETA
Typescript
Yes
Module System
CommonJS
Node Version
11.8.0
NPM Version
6.5.0
Releases
Unable to fetch releases
Languages
1
TypeScript
TypeScript (100%)
Developer
Rediker-Software
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
MIT License
10 Stars
145 Commits
3 Forks
13 Watchers
6 Branches
7 Contributors
Updated on Jan 28, 2023
Maintainers
1
Package Meta Information
Latest Version
0.3.5
Package Id
redux-data-service@0.3.5
Unpacked Size
241.70 kB
Size
42.20 kB
File Count
223
NPM Version
6.5.0
Node Version
11.8.0
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
13
Dev Dependencies
26
@types/node@types/redux-actions@types/webpack@types/webpack-envawesome-typescript-loaderclean-webpack-plugincross-envfakerfast-globfsinternredux-devtools-extensionredux-test-utilssinonts-nodetslinttslint-reacttslint-webpack-plugintypedoctypedoc-plugin-markdowntypescriptwebpackwebpack-cliwebpack-configwebpack-dev-servercircular-dependency-plugin
redux-data-service
A Redux library to seamlessly connect to any API using first-class models created from true TypeScript classes, with support for customizable serialization, validation, and dependency injection.
- Interact with Redux through a friendly syntax that is simple and familiar to developers
- Maintain an immutable architecture and unidirectional data store without the pain!
- Create a layer of abstraction that is still plain-old Redux under the hood with regular reducers, actions and selectors
- Use TypeScript classes to create type-safe models, validators, serializers, and API adapters
- Provide custom validation and serialization rules on a per-field basis for each model
- Support any API on a per-model basis with configurable serializers and API adapters, with default support for a standard REST API
- Sensible default configuration with plenty of escape hatches to suit your needs
- Feel confident with an open source library that is thoroughly unit tested
- Rendering library/framework agnostic:
- Official support for React - redux-data-service-react
- Vue: TBD
- Angular: TBD
Create models with TypeScript classes:
1// student/model.ts 2import { attr, required, Model, EmailField, NumberField, StringField } from "redux-data-service"; 3 4export class Student extends Model { 5 public readonly string serviceName = "student"; 6 7 @required() 8 @attr(StringField) 9 public string firstName; 10 11 @attr(NumberField) 12 public string age; 13 14 @attr(EmailField) 15 public string email; 16}
- Validation and serialization rules are provided using property decorators.
- Models can also support
belongsToandhasManyrelationships to other models which are lazy-loaded when they are requested.
Interact with models through a familiar syntax
1import { Student } from "./student"; 2 3const student = new Student({ id: "123" }); 4 5student.firstName = "Jessica"; 6student.age = 9; 7student.email = "jess@example.com";
- In preserving the awesome power of an immutable architecture, the above will not mutate the model.
- Instead, it uses magic setters to dispatch model-specific actions, where a new instance of the model is created each time:
1{ type: "student/SET_FIELD", payload: { id: "123", fieldName: "firstName", value: "Jessica" } } 2{ type: "student/SET_FIELD", payload: { id: "123", fieldName: "age", value: 9 } } 3{ type: "student/SET_FIELD", payload: { id: "123", fieldName: "email", value: "jess@example.com" } }
Commit pending changes to the model's corresponding API end-point:
1student.save();
Calling the save method validates the model and dispatches an action to an underlying redux-observable epic:
1{ type: "student/UPDATE_RECORD", payload: { id: "123" } }
The epic will then:
- serialize the model into a JSON string (using the default serializer)
- send a
POSTor aPUTto the API to create or update the model (using the default API adapter):
1PUT api/students/123 2{"id": "123", "firstName": "Jessica", "age": 9, "email": "jess@example.com"}
Although the above example uses the default serializer and API adapter for connecting to a REST API, any ISerializer or IAdapter may be used to connect to any API.
Easily connect models to your React components
- For React projects, use redux-data-service-react
- Pull Requests are welcome to support other libraries/frameworks, such as Vue or Angular!
Querying the API
1import * as React from "react"; 2import { withModelQuery } from "redux-data-service-react"; 3 4export const StudentList = withModelQuery({ modelName: "student" })( 5 ({ items }) => ( 6 <ul> 7 {items.map(student => ( 8 <li key={student.id}>{student.name}, age {student.age}, email {student.email}</li> 9 ))} 10 </ul> 11 ) 12);
Apollo-like syntax is also supported:
1import * as React from "react"; 2import { Query } from "redux-data-service-react"; 3 4export const StudentList = ( 5 <Query modelName="student"> 6 {({ items }) => ( 7 <ul> 8 {items.map(student => ( 9 <li key={student.id}>{student.name}, age {student.age}, email {student.email}</li> 10 ))} 11 </ul> 12 )} 13 </Query> 14);
Simply use your component as you normally would and it will automatically query the API when the component mounts:
1<StudentList />
Additional query params may be specified:
1<StudentList queryParams={{ page: 1, name: "Jess" }}/>
You may also provide an iterable list of models to render instead of querying the API:
1<StudentList items={students}/>
Creating/editing models
1import * as React from "react"; 2import { withNewModel, ModelForm, ModelField } from "redux-data-service-react"; 3 4const Input = (props) => <input {...props />; 5 6export const StudentForm = withNewModel("student")( 7 ({ student, ...props }) => ( 8 <ModelForm model={student} {...props}> 9 <ModelField name="firstName" component={Input}/> 10 <ModelField name="age" type="number" component={Input}/> 11 <ModelField name="email" type="email" component={Input}/> 12 <Input type="submit" value="Save" /> 13 </ModelForm> 14 ) 15);
The above form can be used for creating or editing a student model:
- Creating a Student:
<StudentForm /> - Editing a Student:
<StudentForm studentId="123"/>or<StudentForm student={student}/>
When the form is submitted it will:
- validate the model, then
- save the model by committing changes to the API
Displaying a single model:
1import * as React from "react"; 2import { withModel } from "redux-data-service-react"; 3 4export const StudentDetail = withModel("student")( 5 ({ student }) => ( 6 <section> 7 <h1>{student.name}</h1> 8 <strong>age:</strong> {student.age} 9 <em>{student.email}</em> 10 </section> 11 ) 12);
The above component, given a model id, will load and subscribe to the requested model.
Working with React-Router
Simply pass the id from the route into the above component, for example:
<Route
path="/students/:studentId"
render={(props) => <StudentDetail studentId={props.match.params.studentId}/>}
/>
Wiring into Redux
Before we can use the Student model defined above, we must wire it into Redux!
Create a corresponding DataService class for each model
The DataService class provides a layer of abstraction around Redux to create a unidirectional, immutable architecture without the pain!
- Creates a corresponding Redux reducer with model-specific actions and selectors for each model
- Communicates to any API using a configurable API adapter when the model is saved or requested
- Supports serializing/deserializing models when communicating to the API with support for custom serializers
- Leverages RxJS observables to make it simple to subscribe to changes to any model
1// student/service.ts 2import { DataService } from "redux-data-service"; 3import { Student } from "./Student"; 4 5export class StudentService extends DataService { 6 public readonly name = "student"; 7 public readonly ModelClass = Student; 8}
Configure redux-data-service and create your Redux data store
Add each of your DataService classes to the configure function to enable dependency injection and create the Redux store
- Configure
redux-data-serviceto globally override any default functionality as needed - You may provide a callback as the second parameter, which given the individual reducers and epics, should create the Redux store as desired
1import { configure } from "redux-data-service"; 2import { StudentService } from "./student/service.ts"; 3 4export const store = configure({ 5 modules: { 6 student: StudentService 7 } 8});
Please Read the docs for more detailed information.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
Found 11/30 approved changesets -- score normalized to 3
Reason
project is archived
Details
- Warn: Repository is archived.
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 11 are checked with a SAST tool
Reason
132 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-6chw-6frg-f759
- Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
- Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-pp7h-53gx-mx7r
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw
- Warn: Project is vulnerable to: GHSA-c6rq-rjc2-86v2
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-qgfr-5hqp-vrw9
- Warn: Project is vulnerable to: GHSA-3wcq-x3mq-6r9p
- Warn: Project is vulnerable to: GHSA-vh7m-p724-62c2
- Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w
- Warn: Project is vulnerable to: GHSA-434g-2637-qmqr
- Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m
- Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw
- Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p
- Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747
- Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh
- Warn: Project is vulnerable to: GHSA-4gmj-3p3h-gm8h
- Warn: Project is vulnerable to: GHSA-6h5x-7c5m-7cr7
- Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q
- Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c
- Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc
- Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp
- Warn: Project is vulnerable to: GHSA-8r6j-v8pm-fqw3
- Warn: Project is vulnerable to: MAL-2023-462
- Warn: Project is vulnerable to: GHSA-4q6p-r6v2-jvc5
- Warn: Project is vulnerable to: GHSA-vvj3-85vf-fgmw
- Warn: Project is vulnerable to: GHSA-q42p-pg8m-cqh6
- Warn: Project is vulnerable to: GHSA-w457-6q6x-cgp9
- Warn: Project is vulnerable to: GHSA-62gr-4qp9-h98f
- Warn: Project is vulnerable to: GHSA-f52g-6jhx-586p
- Warn: Project is vulnerable to: GHSA-2cf5-4w76-r9qv
- Warn: Project is vulnerable to: GHSA-3cqr-58rm-57f8
- Warn: Project is vulnerable to: GHSA-g9r4-xpmj-mj65
- Warn: Project is vulnerable to: GHSA-q2c6-c6pm-g3gh
- Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44
- Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988
- Warn: Project is vulnerable to: GHSA-vfrc-7r7c-w9mx
- Warn: Project is vulnerable to: GHSA-7wwv-vh3v-89cq
- Warn: Project is vulnerable to: GHSA-6x33-pw7p-hmpq
- Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27
- Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37
- Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-2pr6-76vf-7546
- Warn: Project is vulnerable to: GHSA-8j8c-7jfh-h6hx
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-jg8v-48h5-wgxg
- Warn: Project is vulnerable to: GHSA-36fh-84j7-cv5h
- Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-4xc9-xhrj-v574
- Warn: Project is vulnerable to: GHSA-x5rq-j2xg-h7qm
- Warn: Project is vulnerable to: GHSA-jf85-cpcp-j695
- Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-xf5p-87ch-gxw2
- Warn: Project is vulnerable to: GHSA-ch52-vgq2-943f
- Warn: Project is vulnerable to: GHSA-5v2h-r2cx-5xgj
- Warn: Project is vulnerable to: GHSA-rrrm-qjm4-v8hf
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-fhjf-83wg-r2j9
- Warn: Project is vulnerable to: GHSA-92xj-mqp7-vmcj
- Warn: Project is vulnerable to: GHSA-wxgw-qj99-44c2
- Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5
- Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp
- Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq
- Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr
- Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765
- Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g
- Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-g6ww-v8xp-vmwg
- Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6
- Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59
- Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
- Warn: Project is vulnerable to: GHSA-h9rv-jmmf-4pgx
- Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94
- Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
- Warn: Project is vulnerable to: GHSA-4g88-fppr-53pp
- Warn: Project is vulnerable to: GHSA-4jqc-8m5r-9rpr
- Warn: Project is vulnerable to: GHSA-g4rg-993r-mgx7
- Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6
- Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj
- Warn: Project is vulnerable to: GHSA-c9g6-9335-x697
- Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq
- Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9
- Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw
- Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc
- Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh
- Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p
- Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
- Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-46c4-8wrp-j99v
- Warn: Project is vulnerable to: GHSA-9m6j-fcg5-2442
- Warn: Project is vulnerable to: GHSA-hh27-ffr2-f2jc
- Warn: Project is vulnerable to: GHSA-rqff-837h-mm52
- Warn: Project is vulnerable to: GHSA-8v38-pw62-9cw2
- Warn: Project is vulnerable to: GHSA-hgjh-723h-mx2j
- Warn: Project is vulnerable to: GHSA-jf5r-8hm2-f872
- Warn: Project is vulnerable to: GHSA-rv73-9c8w-jp4c
- Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6
- Warn: Project is vulnerable to: GHSA-cf66-xwfp-gvc4
- Warn: Project is vulnerable to: GHSA-4v9v-hfq4-rm2v
- Warn: Project is vulnerable to: GHSA-9jgg-88mc-972h
- Warn: Project is vulnerable to: GHSA-g78m-2chm-r7qv
- Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
- Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp
Score
2.5
/10
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More