wings-feathers
Welcome to Wings-Feathers!
A FeathersJS 4-Way reactive data sync for any frontend framework
- DOM / UI (HTML)
- Data / State (Javascript)
- Local Storage (Offline)
- Backend/Database (Cloud)
Join and support our Community
Web and Mobile Developers PH
[ Facebook Page | Group ]
Installation
npm install wings-feathers
or
yarn add wings-feathers
Usage
import wings from 'wings-feathers'
// const wings = require('wings-feathers').default
let app = wings('http://localhost:3030')
let messagesSrvc = app.wingsService('messages')
messagesSrvc.on('dataChange', (messages) => {
console.log(messages)
})
messagesSrvc.init()
app.wingsService(serviceName, params, config)
Returns a wingsService <object>
| Param | Type | Description |
|---|---|---|
| serviceName | <string> |
Name of service |
| params.query | <object> |
( Optional ) Refer to Feathers Querying |
| config | <object> |
( Optional ) Configuration of wingsService <object> |
| config.channels | <array> |
( Optional ) Array of channel objects |
params.query <object>
Refer to Feathers Querying
/* example records
[
{ text: 'Hello', read: true, roomId: 1, nested: { prop: 'xander' } },
{ text: 'World', read: false, roomId: 2, nested: { prop: 'ford' } }
]
*/
let serviceName = 'message'
let params = {
query: {
read: false,
roomId: 2
}
}
let messagesSrvc = app.wingsService(serviceName, params)
messagesSrvc.on('dataChange', (messages) => {
console.log(messages)
// [ { text: 'World', read: false, roomId: 2, nested: { prop: 'ford' } } ]
})
config <object>
| Property | Type | Default | Description |
|---|---|---|---|
| debug | <boolean> |
false | Logs all events init, created, removed, patched, updated, loadMore, reset |
| newDataPosition | <string> |
'end' | Add new items to the start or end of an array |
| paginate | <boolean> |
false | Enable pagination based on $limit. **default is 10 records per page |
| channels | <array> |
[] | Refer to channels |
let config = {
debug: true,
newDataPosition: 'start',
paginate: true,
channels: []
}
let messagesSrvc = app.wingsService(serviceName, params, config)
config.channels <array> and channel <object>
Channels determine which records to receive that passes the prop === value .
| Property | Type | Description |
|---|---|---|
| prop | <string> |
Name of record's property |
| value | `<string | number |
| value | <function> |
callback accepts (val, message) arguments for custom test. **Must return a boolean value |
/* example records
[
{ text: 'Hello', read: true, roomId: 1, nested: { prop: 'xander' } },
{ text: 'World', read: false, roomId: 2, nested: { prop: 'ford' } }
]
*/
let config = {
channels: [
{ prop: 'roomId', value: 2},
{ prop: 'nested.prop', value: 'ford'},
{ prop: 'nested', value: (val) => val.prop === 'ford' }
]
}
let messagesSrvc = app.wingsService(serviceName, params, config)
You may use dot notation in prop as reference into the object's property
reset(params, config)
set new params, config and triggers init method
let params = {
query: {
read: false,
roomId: 2
}
}
let config = {
debug: true,
newDataPosition: 'start',
paginate: true,
channels: []
}
messagesSrvc.reset(params, config)
loadMore()
loads more data based on $skip = ( page + 1 ) * $limit
messagesSrvc.loadMore()
loadAll()
loads all data based on ($skip = page * $limit) * pages
messagesSrvc.loadAll()
loadPage(page)
loads the based on $skip = page * $limit
messagesSrvc.loadPage(2)
destroy()
destroys all listners created by .on(eventName, listener) function
messagesSrvc.destroy()
Join and support our Community
Web and Mobile Developers PH
[ Facebook Page | Group ]
Related Packages
The lightweight and powerful UI rendering engine without dependencies and writte...
The isomorphic Dark router designed for rendering universal web applications tha...
Advanced Charting / Charts supporting Javascript / Typescript / React / Angular...
Version History
| Version | Released | License |
|---|---|---|
| 4.0.10 | ISC | |
| 4.0.9 | ISC | |
| 4.0.8 | ISC | |
| 4.0.7 | ISC | |
| 4.0.6 | ISC | |
| 4.0.5 | ISC | |
| 4.0.4 | ISC | |
| 4.0.3 | ISC | |
| 4.0.2 | ISC | |
| 4.0.1 | ISC | |
| 4.0.0 | ISC | |
| 3.0.4 | ISC | |
| 3.0.3 | ISC | |
| 3.0.1 | ISC | |
| 3.0.0 | ISC | |
| 2.0.24 | ISC | |
| 2.0.23 | ISC | |
| 2.0.22 | ISC | |
| 2.0.21 | ISC | |
| 2.0.20 | ISC | |
| 2.0.19 | ISC | |
| 2.0.18 | ISC | |
| 2.0.17 | ISC | |
| 2.0.16 | ISC | |
| 2.0.15 | ISC | |
| 2.0.14 | ISC | |
| 2.0.13 | ISC | |
| 2.0.12 | ISC | |
| 2.0.11 | ISC | |
| 2.0.10 | ISC |
Showing the latest 30 of 46. See every release on npm