https://github.com/lemol/hyperapp-react-hooks

Trying to build Hyperapp syntax with simple react hooks
https://github.com/lemol/hyperapp-react-hooks

hyperapp react react-hooks

Last synced: 7 months ago
JSON representation

Trying to build Hyperapp syntax with simple react hooks

• Host: GitHub
• URL: https://github.com/lemol/hyperapp-react-hooks
• Owner: lemol
• Created: 2018-10-30T11:55:52.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2019-12-30T16:03:43.000Z (about 6 years ago)
• Last Synced: 2025-06-26T20:07:39.824Z (8 months ago)
• Topics: hyperapp, react, react-hooks
• Language: HTML
• Homepage: https://codesandbox.io/s/github/lemol/hyperapp-react-hooks
• Size: 9.77 KB
• Stars: 4
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# hyperapp-react-hook

Trying to build [Hyperapp](https://github.com/jorgebucaran/hyperapp) syntax with simple react hooks.

[![Edit 6joor0no6w](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/6joor0no6w)

## Use

```bash

yarn         # OR npm install

yarn start   # OR npm start

```

## Result

With `create-react-app`, based on the [Hyperapp getting started counter example](https://github.com/jorgebucaran/hyperapp#getting-started), just:

1. Import `React` instead of `h`.

2. Replace `onclick` to `onClick`.

```javascript

import { React, app } from "./hyperapp"

const state = {

  count: 0

}

const actions = {

  down: value => state => ({ count: state.count - value }),

  up: value => state => ({ count: state.count + value })

}

const view = (state, actions) => (

  


    
{state.count}

     actions.down(1)}>-

     actions.up(1)}>+

  

)


app(state, actions, view, document.body);

```