hyperapp-starter icon indicating copy to clipboard operation
hyperapp-starter copied to clipboard

Clean web app starter using Hyperapp with strong focus on developer experience.

Hyperapp non-official logo

Hyperapp starter

Starter template to quickly build front-ends using Hyperapp

🚀 Quick start:

Click here to use this template, or run these commands:

# Clone project
git clone https://github.com/loteoo/hyperapp-starter.git

cd hyperapp-starter

npm i               # Install dependencies
npm run dev         # Dev server
npm run build       # Build for production
npm run preview     # Preview production build

Or use a .zip download

Features

  • Vite for dev tooling
  • Written in TypeScript
  • CSS modules + nested syntax
  • Smart CSS defaults on top of sanitize.css
  • JSX ready to go
  • Absolute imports (say goodbye to the ../../ hell)
  • PWA/SPA ready with a default web app manifest
  • Pages + routing implementation

Live demo

https://hyperapp-starter-demo.netlify.com/


To-do list demo app:

Basic CRUD actions with hyperapp 2.0
https://github.com/loteoo/hyperapp-todolist

FAQ:

How do I deploy my app?

By default, apps using this starter can be considered static sites, which means you can deploy for free on services like Netlify and Github Pages.

Need code splitting and pre-rendering out of the box?

Checkout hyperstatic and the hyperstatic starter instead!