You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
jorgebucaran 0bc202396f Deploying to gh-pages from @ eec455a2b5 πŸš€ 10 months ago
__/node_modules/hyperapp Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
tutorial-assets Deploying to gh-pages from @ 0eb6b0f662a7a3229433df4adc3979b34fa52007 πŸš€ 10 months ago
CNAME Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Bold.9341457d.woff Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Bold.d2e4e930.woff2 Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Light.0049a308.woff2 Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Light.7462e69b.woff Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Medium.61e32950.woff2 Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Medium.fa345726.woff Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Regular.5c4d2b60.woff Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-Regular.de18f42f.woff2 Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-VF.2a9bbcf8.woff Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
FiraCode-VF.fa7346fc.woff2 Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
IBMPlexSans-Bold.4dfaebd3.ttf Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
IBMPlexSans-Light.ab432367.ttf Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
IBMPlexSans-Medium.f3ba3949.ttf Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
IBMPlexSans-Regular.97a23001.ttf Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
IBMPlexSans-SemiBold.027d36f8.ttf Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
IBMPlexSans-Thin.eb4bbefb.ttf Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
README.a5fa9974.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
_redirects Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
api.4a87837f.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
card.b7cfd6ff.png Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
close.d10ab7e3.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
do-more-with-less.310b45d4.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
ecosystem.0b358926.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
examples.md Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
faster-than-react.31c816ca.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
favicon.648f6921.png Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
global.89bdf38a.css Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
global.ef693322.css Deploying to gh-pages from - f30e70e77513948d2a1286ea6509b4e0c1de8999 πŸš€ 1 year ago
guides.31d0dce1.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
hyperapp-logo-v1.eed9079f.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
hyperapp-logo-v2.10d2f4a5.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
hypercharged.f1b19631.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
icon-192x192.c99be655.png Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
icon-512x512.ebbe6b77.png Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
index.html Deploying to gh-pages from @ 0eb6b0f662a7a3229433df4adc3979b34fa52007 πŸš€ 10 months ago
logo-big.e296631b.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
manifest.webmanifest Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
menu.1f287146.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
pages-data.json Deploying to gh-pages from @ eec455a2b5cfb75a19e6eaddfe670a6456c2f25f πŸš€ 10 months ago
quickstart.0e6b9c83.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
ref.md Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
robots.txt Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
so-small-cant-even.9a03a356.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
sponsor.ef925587.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
src.07c797be.js Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
src.34f9ddf1.css Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
src.42c1bece.css Deploying to gh-pages from - f30e70e77513948d2a1286ea6509b4e0c1de8999 πŸš€ 1 year ago
src.55a35a3a.js Deploying to gh-pages from - 48acd862586847ef3d9310c5be4467aa3481744f πŸš€ 1 year ago
src.1388ce03.js Deploying to gh-pages from - f30e70e77513948d2a1286ea6509b4e0c1de8999 πŸš€ 1 year ago
src.07140206.js Deploying to gh-pages from - cc7a0f427d85989231f08f9cbf4846ca57425b02 πŸš€ 1 year ago
src.c14d3482.js Deploying to gh-pages from @ 4121de9db41a3e98d8407b00b2a26f0eb410d96d πŸš€ 1 year ago
src.cf7a0d51.js Deploying to gh-pages from @ eec455a2b5cfb75a19e6eaddfe670a6456c2f25f πŸš€ 10 months ago
src.e0d09f5b.js Deploying to gh-pages from - e264cf38c0a06e996258e409ed83085276e05b19 πŸš€ 1 year ago
src.f5601ac4.js Deploying to gh-pages from @ d08c3d5051388685b0511cf5515a6f7bd8b7407f πŸš€ 12 months ago
src.f24912fc.js Deploying to gh-pages from - b1642432356101b07c7a8713fb6b44dad2d2e481 πŸš€ 1 year ago
src.fd60fa92.css Deploying to gh-pages from - e264cf38c0a06e996258e409ed83085276e05b19 πŸš€ 1 year ago
time-to-interactive.df8b26b1.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
tutorial.9811de31.html Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago
tutorial.aa05031e.html Deploying to gh-pages from - cc7a0f427d85989231f08f9cbf4846ca57425b02 πŸš€ 1 year ago
tutorial.b40797f8.html Deploying to gh-pages from @ eec455a2b5cfb75a19e6eaddfe670a6456c2f25f πŸš€ 10 months ago
tutorial.d5792d04.html Deploying to gh-pages from @ f1b6de9c900d1af845635247fb60a81a4ecebafb πŸš€ 10 months ago
tutorial.md Update hyperapp-fx link and import definitions for Interval (#950) 12 months ago
write-what-not-how.68035d11.svg Deploying to gh-pages from - 6f66eceb12e461b2b66a309a6ba2f0bcd326ee15 πŸš€ 1 year ago

README.a5fa9974.html

<h1 id="hyperapp-npm"><a href="https://hyperapp.dev">Hyperapp</a> <a href="https://github.com/jorgebucaran/hyperapp/releases/latest"><img src="https://img.shields.io/npm/v/hyperapp.svg?label=&color=0080FF" alt="npm"></a></h1><blockquote>
<p>The tiny framework for building web interfaces.</p>
</blockquote><ul>
<li><strong>Do more with less</strong>β€”We have minimized the concepts you need to learn to be productive. Views, actions, effects, and subscriptions are all pretty easy to get to grips with and work together seamlessly.</li>
<li><strong>Write what, not how</strong>β€”With a declarative syntax that&#39;s easy to read and natural to write, Hyperapp is your tool of choice to develop purely functional, feature-rich, browser-based applications.</li>
<li><strong>Hypercharged</strong>β€”Hyperapp is a modern VDOM engine, state management solution, and application design pattern all-in-one. Once you learn to use it, there&#39;ll be no end to what you can do.</li>
</ul><p>To learn more, go to <a href="https://hyperapp.dev">https://hyperapp.dev</a> for documentation, guides, and examples.</p><h2 id="quickstart">Quickstart</h2><p>Install Hyperapp with npm or Yarn:</p><pre><code class="language-console">npm i hyperapp</code></pre><p>Then with a module bundler like <a href="https://parceljs.org">Parcel</a> or <a href="https://webpack.js.org">Webpack</a> import it in your application and get right down to business.</p><pre><code class="language-js">import { h, app } from &quot;hyperapp&quot;</code></pre><p>Don&#39;t want to set up a build step? Import Hyperapp in a <code>&lt;script&gt;</code> tag as a module. Don&#39;t worry; modules are supported in all evergreen, self-updating desktop, and mobile browsers.</p><pre><code class="language-html">&lt;script type=&quot;module&quot;&gt;
import { h, app } from &quot;https://unpkg.com/hyperapp&quot;
&lt;/script&gt;</code></pre><p>Here&#39;s the first example to get you started: a counter that can go up or down. You can try it online <a href="https://codesandbox.io/s/hyperapp-playground-fwjlo">here</a>.</p><pre><code class="language-html">&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;en&quot;&gt;
&lt;head&gt;
&lt;script type=&quot;module&quot;&gt;
import { h, app } from &quot;https://unpkg.com/hyperapp&quot;

app({
init: 0,
view: state =&gt;
h(&quot;main&quot;, {}, [
h(&quot;h1&quot;, {}, state),
h(&quot;button&quot;, { onClick: state =&gt; state - 1 }, &quot;-&quot;),
h(&quot;button&quot;, { onClick: state =&gt; state + 1 }, &quot;+&quot;)
]),
node: document.getElementById(&quot;app&quot;)
})
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;main id=&quot;app&quot;&gt;&lt;/main&gt;
&lt;/body&gt;
&lt;/html&gt;</code></pre><p>The app starts off with <code>init</code> as the initial state. Our code doesn&#39;t explicitly maintain any state. Instead, we define actions to transform it and a view to visualize it. The view returns a plain object representation of the DOM known as a virtual DOM, and Hyperapp updates the real DOM to match it whenever the state changes.</p><p>Now it&#39;s your turn! Experiment with the code a bit. Spend some time thinking about how the view reacts to changes in the state. Can you add a button that resets the counter back to zero? Or how about multiple counters?</p><h2 id="help-im-stuck">Help, I&#39;m stuck!</h2><p>We love to talk JavaScript and Hyperapp. If you&#39;ve hit a stumbling block, hop on the <a href="https://hyperappjs.herokuapp.com">Hyperapp Slack</a> or drop by <a href="https://spectrum.chat/hyperapp">Spectrum</a> to get support, and if you don&#39;t receive an answer, or if you remain stuck, please file an issue, and we&#39;ll try to help you out.</p><p>Is anything wrong, unclear, missing? Help us <a href="https://github.com/jorgebucaran/hyperapp/fork">improve this page</a>.</p><h2 id="stay-in-the-loop">Stay in the loop</h2><ul>
<li><a href="https://twitter.com/hyperappjs">Twitter</a></li>
<li><a href="https://github.com/jorgebucaran/awesome-hyperapp">Awesome</a></li>
<li><a href="https://www.reddit.com/r/hyperapp">/r/hyperapp</a></li>
</ul><h2 id="license">License</h2><p><a href="/__/node_modules/hyperapp/LICENSE.html">MIT</a></p>