beedle
Version:
Beedle is a tiny little library to help you manage state across your application. Inspired by great libraries like Vuex and Redux, Beedle creates a central store that enables you to both better control and cascade state across your application.
43 lines (39 loc) • 1.49 kB
HTML
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Beedle Demo</title>
<style>
* {
box-sizing: border-box;
}
body {
padding: 2rem;
font-family: sans-serif;
}
form {
margin-top: 2rem;
max-width: 50ch;
}
a {
color: #c23616;
}
</style>
<link rel="stylesheet" media="all" href="https://rawgit.com/hankchizljaw/boilerform/master/dist/css/boilerform.min.css" />
</head>
<body>
<main>
<h1>Beedle demo</h1>
<p>A simple demo to show how <a href="https://github.com/hankchizljaw/beedle">Beedle</a> manages your state and how the state changes are cascaded. View <a href="/main.js">source</a>.</p>
<p><b>Live Message:</b> <span aria-live="polite" class="js-message-element">Hello, world</span></p>
<form class="boilerform" action="" method="post">
<div>
<label for="message" class="c-label">Update the live message</label>
<textarea name="message" id="message" class="c-input-field c-input-field--multiline" rows="10"></textarea>
</div>
</form>
</main>
</body>
<script src="main.js" async type="module"></script>
</html>