https://github.com/jamen/hyperserver
Tiny WebSocket server that hooks into Hyperapp
https://github.com/jamen/hyperserver
Last synced: 12 months ago
JSON representation
Tiny WebSocket server that hooks into Hyperapp
- Host: GitHub
- URL: https://github.com/jamen/hyperserver
- Owner: jamen
- Created: 2017-11-11T04:32:31.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-11-11T04:34:09.000Z (over 8 years ago)
- Last Synced: 2025-06-10T10:51:25.618Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 2.93 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# @jamen/hyperserver
> Tiny WebSocket server that hooks into Hyperapp
Provdies a WebSocket server that hooks into Hyperapp actions. It uses "remote actions", which are just actions that pass through a server first. The different can be visualized as:
```
Normal action:
Action +---> State +---> View
Remote action:
Action +- - - - - -Offline?- - - - - - -> State +---> View
\ /
(Servers) +---Request-----Response---+
```
## Install
```
npm i -D @jamen/hyperserver
```
## Usage
### `server(props)`
Creates a WebSocket server with
- `messages` handling each incomming action.
- `host` being address of the server. (Defaults to `localhost`)
- `port` being port of the server. (Defaults to `3001`)
- `error(err)` being called
Each message looks like `name(request, response)`. They receive and send messages formated as `[name, data]`, which correlates to actions client-side. For example:
```js
server({
messages: {
token (req, res) {
// Receive "token" action from client
console.log(req.data)
// Respond with "token" action on client
res.send('token', {
token: randomBytes(8).toString('hex')
})
}
}
})
```
See below for handling responses.
### `remote(app, options)`
An extension to Hyperapp which adds `props.remote` for specifying remote actions. It connects to the Hyperserver with
- `host` being the address of the server. (Defaults to `localhost`)
- `port` being the port of the server. (Defaults to `3001`)
Remote actions are like regular actions except they ask a server first.
```
Action +- - - - - -Offline?- - - - - - -> State +---> View
\ /
(Servers) +---Request-----Response---+
```
An example of using the extension:
```js
app = remote(app)
app({
state: {
count: 0
},
remote: {
add: (state, actions) => data {
return { count: data.count + 1 }
}
},
view: (state, actions) => (
h('button', { onclick: actions.add }, state.count)
)
})
```
Everything defined in `remote` is available as `actions` everywhere else. Note remote actions take precedence of normal actions.