A small (20k) compilation of Preact, Preact Router, and HTM - along with a few of my own inventions - that allows you to write modern web applications with little-to-no framework, and without a compilation step.
The goal here is that you should be able to create apps whose source runs directly in the browser - just like the olden days - but which take can take full advantage of JavaScript features that modern browsers now ubiquitously support.
A minimal buildless app looks like this:
<!DOCTYPE html>
<html>
<head>
<title>Simple Buildless app</title>
<script type="module">
import { render, useState, html } from 'https://unpkg.com/@fordi-org/buildless';
const ClickCounter = () => {
const [count, setCount] = useState(0);
const increment = () => setCount(count + 1);
return html`
<div>
<button onClick=${increment}>
Clicked ${count} times
</button>
</div>
`;
};
render(html`<${ClickCounter}/>`, document.body);
</script>
</head>
<body></body>
</html>
That's it. No build required. Just serve up that file. If you're feeling
like that's too terse, you can throw all your code into an index.js
, and replace
that script tag with <script async defer type="module" src="./index.js"></script>
.
Browser support. Buildless relies on ES Modules support in your browser, which means that, for example, IE users are lost (though Edge users will work).
Everything in
preact
,
preact/hooks
,
and preact-router
is exported from the one module, so they are most of your documentation,
along with a preact-bound instance htm
,
and the Buildless tools.
Go. Play. Build some neat stuff.
*sigh* fine. Go here for information on how to make a production build.