Package Exports
- apprun
- apprun/dist/apprun.esm.js
- apprun/dist/apprun.js
- apprun/esm/apprun.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (apprun) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
AppRun

Introduction
AppRun is a lightweight alternative to other frameworks and libraries. It has a unique architecture inspired by the Elm architecture that can help you manage states, routing, and other essential aspects of your web application.
Use a Counter as an example.
// define the initial state
const state = 0;
// view is a function to display the state
const view = state => `<div>
<h1>${state}</h1>
<button onclick="app.run('-1')">-1</button>
<button onclick="app.run('+1')">+1</button>
</div>`;
// update is a collection of event handlers
const update = {
'+1': state => state + 1,
'-1': state => state - 1
};
// start the app
app.start(document.body, state, view, update);At its core, AppRun harnesses the power of the event PubsSub (Publish-Subscribe) pattern to streamline your application’s state handling.
Why the Event Pubsub Pattern
The event PubSub pattern isn't new; it's a well-established design pattern used widely in software development to handle communication between components or services in a decoupled manner. Web developers are likely already familiar with the PubSub pattern through their use of DOM event handling.
AppRun takes the familiar PubSub concept and extends it into your application's logic, providing a more structured and powerful approach to state management. The result? Cleaner, more maintainable code and a smoother development experience.
AppRun Benefits
- Clean architecture that needs less code
- State management and routing included
- No proprietary syntax to learn (no hooks, no reducers, no signals)
- Use directly in the browser or with a compiler/bundler
- Advanced features: JSX, Web Components, Dev Tools, SSR, etc.
Getting Started
AppRun is distributed on npm. To get it, run:
npm install apprunYou can also load AppRun directly from the unpkg.com CDN:
<html>
<body>
<script src="https://unpkg.com/apprun/dist/apprun-html.js"></script>
<script>
const view = state => `<div>${state}</div>`;
app.start(document.body, 'hello AppRun', view);
</script>
</body>
</html>Or, use the ESM version:
<html>
<body>
<script type="module">
import { app } from 'https://unpkg.com/apprun/dist/apprun-html.esm.js';
const view = state => `<div>${state}</div>`;
app.start(document.body, 'hello ESM', view);
</script>
</body>
</html>Or, you can create an AppRun app by using the npm create apprun-app command.
npm create apprun-app [my-app]Learn More
You can get started with AppRun Docs and the AppRun Playground.
AppRun Book from Apress
Contribute
You can launch the webpack dev-server and the demo app from the demo folder with the following npm commands:
npm install
npm startYou can run the unit tests from the tests folder.
npm testUnit tests can serve as functional specifications.
Finally, to build optimized js files to the dist folder, just run:
npm run buildHave fun and send pull requests.
Contributors
Support
AppRun is an MIT-licensed open source project. Please consider supporting the project on Patreon. 👍❤️🙏
Thank you for your support
- Athkahden Asura
- Alfred Nerstu
- Gyuri Lajos
- Lorenz Glißmann
- Kevin Shi
- Chancy Kennedy
License
MIT
Copyright (c) 2015-2024 Yiyi Sun
