All Projects → spapas → hyperapp-tutorial

spapas / hyperapp-tutorial

Licence: Unlicense license
A tutorial application written in hyperapp

Programming Languages

CSS
56736 projects
javascript
184084 projects - #8 most used programming language
python
139335 projects - #7 most used programming language
HTML
75241 projects
Batchfile
5799 projects

Projects that are alternatives of or similar to hyperapp-tutorial

Hyperawesome
A curated list of awesome projects built with Hyperapp & more.
Stars: ✭ 446 (+2130%)
Mutual labels:  hyperapp
Hyperapp Fx
Effects for use with Hyperapp
Stars: ✭ 105 (+425%)
Mutual labels:  hyperapp
boiler
Another Golang boilerplate
Stars: ✭ 21 (+5%)
Mutual labels:  hyperapp
Covid.reports
https://covidreports.netlify.com/
Stars: ✭ 16 (-20%)
Mutual labels:  hyperapp
Hyperapp Html
Html helper functions for Hyperapp V1
Stars: ✭ 83 (+315%)
Mutual labels:  hyperapp
Hyperapp Guide
HyperApp user's manual
Stars: ✭ 1,569 (+7745%)
Mutual labels:  hyperapp
hyperapp-scripts
Hyperapp expansion pack for create-react-app
Stars: ✭ 38 (+90%)
Mutual labels:  hyperapp
osjs-gui
OS.js GUI Module
Stars: ✭ 19 (-5%)
Mutual labels:  hyperapp
Hyperapp Render
Render Hyperapp to an HTML string with SSR and Node.js streaming support.
Stars: ✭ 93 (+365%)
Mutual labels:  hyperapp
Hydux
A light-weight type-safe Elm-like alternative for Redux ecosystem, inspired by hyperapp and Elmish
Stars: ✭ 216 (+980%)
Mutual labels:  hyperapp
Hyperbook
https://github.com/kwasniew/hyperbook-tutorial
Stars: ✭ 33 (+65%)
Mutual labels:  hyperapp
Hyperapp Todo Simple
Simple crud todo-app with hyperapp.js
Stars: ✭ 48 (+140%)
Mutual labels:  hyperapp
Scoped Style
A tiny css in js library 🚀
Stars: ✭ 129 (+545%)
Mutual labels:  hyperapp
Ijk
Transforms arrays into virtual dom trees; a terse alternative to JSX and h
Stars: ✭ 452 (+2160%)
Mutual labels:  hyperapp
hyperapp-example
hyperapp example
Stars: ✭ 14 (-30%)
Mutual labels:  hyperapp
Hyperapp Router
Declarative routing for Hyperapp V1 using the History API.
Stars: ✭ 256 (+1180%)
Mutual labels:  hyperapp
Superfine
Absolutely minimal view layer for building web interfaces.
Stars: ✭ 1,542 (+7610%)
Mutual labels:  hyperapp
hyperlight
Next-gen Hyperapp framework.
Stars: ✭ 22 (+10%)
Mutual labels:  hyperapp
cypress-hyperapp-unit-test
Unit test Hyperapp components using Cypress
Stars: ✭ 26 (+30%)
Mutual labels:  hyperapp
Hyperapp One
Hyperapp One is a Parcel boilerplate for quickstarting a web application with Hyperapp (V1), JSX, and Prettier.
Stars: ✭ 129 (+545%)
Mutual labels:  hyperapp

Serafeim's Hyperapp Tutorial

A Hyperapp (https://github.com/jorgebucaran/hyperapp) tutorial application. Hyperapp is a modern JS micro-framework with a functional twist. The project uses a Django - DRF API to provide a (writable) REST API.

Work in progress! I'll try to add more capabilities to this app; or you can do it if you want; PRs are welcome!!!

Demo

Hyperapp-tutorial demo

Components used

  1. Hyperapp (obviously - https://github.com/jorgebucaran/hyperapp)
  2. Spectre.css for styling (https://picturepan2.github.io/spectre/)
  3. A bunch of home-made spectre.css components for hyperapp (https://github.com/spapas/hyperapp-tutorial/tree/master/srcjs/components)
  4. Browserify / watchify and uglify for JS bundling (https://spapas.github.io/2015/05/27/using-browserify-watchify/)
  5. Django/DRF for server-side stuff (https://www.djangoproject.com/ + https://www.django-rest-framework.org/)

To run it locally

  1. Create a python virtualenv and activate it (virtualenv venv)
  2. Install python requirements (pip install -r requirements.txt)
  3. Create a superuser (python manage.py cratesuperuser)
  4. Run server (python manage.py runserver)

To develop in JS:

  1. Install requirements (yarn install)
  2. Run watch (yarn run watch)

To create prod build:

  1. Run build (yarn run build)
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].