skanne

Hyperapp 2 – Actions, Effects and Subscriptions

Learn about the function signatures of actions, effects, and subscriptions in Hyperapp 2 and how they are used in apps.

Actions

Actions:

Are declared as constant arrow functions (const ActionFunction = (s, p) => ns).
Should have names written in PascalCase .

Hyperapp DOM

This gist offers another build-step-less way to construct Hyperapp views by using the powers of JavaScript proxies (see Proxy - JavaScript | MDN) and the ability to "create" dedicated hyperscript functions per needed tag on the fly by destructuring the imported proxy. Text nodes are implicit - just place a string as a child. Dashed custom elements and web components are also supported - just camel-case them when destructuring. Lists of children can be passed as an array or as individual arguments, or as a mix of both.

	var m = navigator.userAgent.match(/(iPhone\|iPad\|iPod\|Android\|Windows Phone\|BB10\|PlayBook)/)
	, device = false

	if (m && m.length) {
	if (/iPhone\|iPad\|iPod/.test(m[1])) {
	device = 'apple'
	} else if (/Android/.test(m[1])) {
	device = 'android'
	} else if (/Windows Phone/.test(m[1])) {
	device = 'windows'

	keyCode: {
	BACKSPACE: 8
	, TAB: 9
	, ENTER: 13
	, ESCAPE: 27
	, SPACE: 32
	, PAGE_UP: 33
	, PAGE_DOWN: 34
	, END: 35
	, HOME: 36

	const fx = effect => props => [effect, props]

	const noop = () => {}

	const _abortControllers = {}

	export const request = fx(
	(
	dispatch,
	{