An open API service indexing awesome lists of open source software.

https://github.com/attack-monkey/hyperapp-seed-ts

Hyperapp seed for typescript
https://github.com/attack-monkey/hyperapp-seed-ts

Last synced: 5 months ago
JSON representation

Hyperapp seed for typescript

Awesome Lists containing this project

README

          

# Hyperapp - Seed App (typescript / parcel / tsx )

Hyperapp seed with:

- typescript / tsx
- parceljs
- bootstrap
- hyperappRouter
- auto code splitting + lazy loaded components
- immutable update (iu-ts)

## Install

Install parcel.js globally (This is the bundler)

```

npm i -g parcel-bundler

```

Install douglas globally

> douglas is an importer that imports npm packages as a full projects rather than a node_modules

```

npm i -g douglas

```

Install hyperapp-seed-ts

```

douglas get doug-hyperapp-seed-ts

```

## Start

```

npm start

```

## Immutable Update

This app uses iu-ts (immutable update - typescript) to immutably update deep nested objects.

**Declarative actions are still recommended**, however using iu-ts removes the need to nest actions (allowing for easier refactor).

eg.

```tsx

// The following immutably increments state.counter.count using iu

actions.counterUp(1))}>-

```

```ts

export const actions: Actions = {
counterUp: value => state => iu(state, 'counter/count', state.counter.count + value),
counterDown: value => state => iu(state, 'counter/count', state.counter.count - value)
}

```