Javascript UI is a JavaScript framework. It describes HTML and CSS in Javascript similar to SwiftUI.

• ✔️ Declarative syntax, functions nest within each other, similar to HTML, but with methods instead of CSS properties and HTML attributes.
• 😎 Useful shorthands for HTML tags and attributes and CSS properties.
• 🤓 Methods for CSS tricks like truncate(), fontSmoothing(), fit, etc. More CSS is abstracted into views and stacks like ScrollView(), GridStack(), HStack(), VStack(), etc.
• 🐰 It's fast! Element objects simply provide helpful methods and are used during the first render, but they keep a reference to their element or document fragment. They modify the element directly rather than re-rendering it. There are never entire page re-renders, only selective re-renders when needed for state management.

• 💾 Stores
• ⚛️ State management
• 🦋 Standard animations (rotate, fade, flip, shake, and more!)
• 🧭 Router

Playground • Documentation

Install via NPM:

npm i javascript-ui

Import and add elements to the view() function.

import {view, Section, Paragraph} from 'javascript-ui'; window.onload = () => { view([ Section([ Paragraph('Hello, World!') .textColor('green') ]) ]); };

Resulting HTML:

<section> <p style="color: green;">Hello, World!</p> </section>

Result in browser:

This project aims to create a framework that allows you to create UI in a way that feels natural and easy.