wu

Reactive, functional and declarative framework for webapps

View the Project on GitHub migueldelmazo/wu

Wu framework: properties documentation

Wu is a framework that uses declarative programming. The API, ensurer, watcher, router, getter and setter items use the same properties to define their behavior.

Required, optional and not applicable properties:

| | API | Ensurer | Watcher | Router | Getter | Setter | | |—————————-:|:—————————–:|:————————————-:|:————————————-:|:———————————–:|:———————————–:|:———————————–:|:——:| | onChange | Required | Required | Required | N/A | N/A | N/A | Common | | when | Optional | Optional | Optional | N/A | N/A | N/A | Common | | args | Optional | Optional | Optional | N/A | Optional | Optional | Common | | run | Optional | Optional | Required | N/A | Optional | Optional | Common | | update | Required | Required | N/A | Required | N/A | Required | Common | | urlPattern | N/A | N/A | N/A | Required | N/A | N/A | Common |


onChange:

Examples of use:

{
  onChange: 'user.name'
}
{
  onChange: ['user.name', 'user.lang']
}

when:

Examples of use:

{
  when: {
    'user.name': _.isString
  }
}
{
  when: {
    'user.email': _.isEmail,
    'user.name': [_.negate(_.isEmpty), _.isString],
    'user.age': (userAge) => userAge >= 18 // custom function
  }
}

args:

Examples of use:

{
  // 'run' function will be executed with arguments: 'Anna', 'anna@gmail.com'
  args: ['user.name', 'user.email']
}
{
  // 'run' function will be executed with arguments: 'Anna', 'anna@gmail.com', true, null, 1, [1, 2, 3]
  args: ['user.name', 'user.email', true, null, 1, [1, 2, 3] ]
}
{
  // 'run' function will be executed with arguments: { name: 'Anna', email: 'anna@gmail.com', sendEmail: true }
  args: {
    name: 'user.name',
    email: 'user.email',
    sendEmail: true
  }
}
{
  // 'run' function will be executed with arguments: 'Anna', 'This is a string'
  args: ['user.email', '#This is a string']
}

run:

{
  args: ['user.name', 'user.lang'],
  run: (name, lang) => {
    if (lang === 'en') return 'Hello ' + name
    else if (lang === 'it') return 'Ciao ' + name
    else return 'Hola ' + name
  }
}

update:

{
  update: 'user.name'
}

urlPattern:

{
  urlPattern: '/user/login'
}
{
  urlPattern: '/user/:userId/detail'
}