HTML, JavaScript and TSX

Open Web sites can be written in OpenView and OpenScript, or with the web languages you already know: HTML, CSS, JavaScript, TypeScript and TSX (including React-style components). They are still hosted by you, served over OWP and verified by your site key.

Folder layout

my-site/
  site.owp
  pages/index.html      open://you.site/
  pages/about.html      open://you.site/about
  styles/site.css
  scripts/app.tsx       compiled to JavaScript by owhost
  assets/logo.png

TypeScript and TSX

owhost check, dev and publish compile .ts, .tsx and .jsx to JavaScript and show syntax errors with file and line. Types are removed, not checked: run tsc --noEmit in your editor if you want type checking.

<script type="module" src="/scripts/app.tsx"></script>

React

react, react-dom, react-dom/client and preact are built into Nibble (Preact 10, the small React-compatible library). No npm, no bundler:

import { useState } from "react";
import { createRoot } from "react-dom/client";

function Counter() {
  const [n, setN] = useState(0);
  return <button onClick={() => setN(n + 1)}>Clicked {n} times</button>;
}
createRoot(document.getElementById("root")!).render(<Counter />);

What scripts can do

• Use the DOM: querySelector, createElement, innerHTML, classList, style, events.
• Timers, promises, async/await, ES modules imported from your own site.
• fetch() files and pages from your own site only, over OWP.

They cannot read files, open other connections, or track visitors. Each script run is limited to 3 seconds and 64 MB.

Not supported yet

Canvas, SVG, video, iframes, web fonts, CSS animations and absolute positioning; localStorage is kept only while the page is open. See the known limitations in the Open Web repository.

Back to the documentation