tweed-peek
v0.3.0
Published
Precompiled engine for running raw Tweed components in the browser
Maintainers
emilniklasReadme
Tweed Peek
So you want to try Tweed but have no patience for installing compilers and command line interfaces? That's no problem. Tweed Peek is a precompiled script that you can include directly in HTML and try out Tweed, compilers and all.
Tweed Peek is currently hosted here, so here's all you need to do.
<!DOCTYPE html>
<html>
<head>
<script src='https://tweedjs.github.io/peek.js'></script>
</head>
<body>
<div id='app'></div>
<script type='application/javascript+tweed'>
import { mutating, Node } from 'tweed'
import render from 'tweed/render/dom'
class Counter {
@mutating count = 0
render () {
return (
<button on-click={() => this.count++}>
Clicked {this.count} times
</button>
)
}
}
render(new Counter(), app)
</script>
</body>
</html>Then just open up index.html in a browser and you're up and running!
You don't have to write your code within the <script> if you don't want to. Just add a
src attribute and you're golden. However, if you do this, browsers will complain if
you're using file:// URL's. So you'll have to use a simple web server
like this one.
<!DOCTYPE>
<html>
<head>
<script src='https://tweedjs.github.io/peek.js'></script>
<script type='application/typescript+tweed' src='main.tsx'></script>
</head>
<body>
<div id='app'></div>
</body>
</html>Use the MIME types application/javascript+tweed and application/typescript+tweed to
use Babel or TypeScript, respectively, to compile the modules right there in the browser.
Note: Unless this goes without saying—This is not for production. Check out the website to learn more about how to set it up proper. (It's really easy. We have a CLI.)