This was an experiment, and it has ended. Please visit app-skeleton for its spiritual successor.
A small (36k) compilation of Preact, Preact Router, and HTM - along with a few of my own inventions - that allow 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.
Let me know. I will react immediately to anything that shows up in issues, so have at it; I am your slave.
Building is the standard:
- Fork the repo and clone it locally
npm ci
npm run build
The library will be in dist/buildless.modern.js
. You can import that file like you would
https://unpkg.com/@fordi-org/buildless
; I'll typically symlink to a file local to the app
I've got my test case written in.
Once you've got your fix or feature ready to go, push to your branch and PR as normal; I react to PRs immediately as well, and am super friendly when someone shows even a little bit of interest in my toys.