Giter VIP home page Giter VIP logo

hyperapp-starter's Introduction

Hyperapp Starter

npm downloads slack chat

Boilerplate and tooling for authoring modern web applications with Hyperapp and Node.js.

  • Best practices — The project is based on HTML5 Boilerplate which is the product of years of iterative development and community knowledge.
  • No build configuration — Hassle-free updates for the whole toolchain with a single dependency.
  • Isomorphic — Write code once and run it on both client and server-side.

This project was bootstrapped with Hyperapp Starter (support).

Prerequisites

Getting Started

To create a new app, run a single command:

npm init hyperapp-starter

It will generate the initial project structure inside the current directory and install the dependencies.

Also you can directly specify the project directory if you want to:

npm init hyperapp-starter <project-directory>

Basic structure

.
├── build/              # Compiled output
├── coverage/           # Test coverage reports
├── node_modules/       # 3rd-party libraries and utilities
├── public/             # Static files such as favicon.ico etc.
├── src/                # Application source code
│   ├── app.js          # Universal (Isomorphic) application entry point
│   ├── index.js        # Client-side rendering, e.g. app(state, actions, view, container)
│   └── server.js       # Server-side rendering, e.g. renderToString(view, state, actions)
├── .env                # Environment variables (optional)
├── package.json        # The list of project dependencies + NPM scripts
└── README.md           # Getting started guide

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode with "live reload". Uses src/index.js and src/server.js files as entry points for client-side and server-side apps.

npm test

Launches the test runner. It will look for test files with .test.js or .spec.js suffix. Also you can use any cli options which Jest supports.

npm run lint

Finds problematic patterns in code using ESLint and stylelint. Using --fix option you can automatically fix some of them and also format files using Prettier.

npm run build

Builds the app for production to the build folder. It correctly bundles, optimizes and minifys the build for the best performance and the filenames include the hashes for a long term caching. Using --render option you can generate html files for a static site hosting.

See Hyperapp Tools for more.

License

Hyperapp Starter is MIT licensed. See LICENSE.

hyperapp-starter's People

Contributors

frenzzy avatar jorgebucaran avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.