Documentation

Ink is a template engine with a built-in compiler that generates HTML markup, web components and support reactivity. Like React and Svelte, Ink is a modern approach to building front-end code addressing state management and reactivity. Unlike React and Svelte that focus on keeping the developer experience mostly on the front-end, Ink focuses on being a modern templating solution for server side frameworks. Ink can be used as a template engine on the server side, as a site generator to make static websites and single page applications, or can be used to publish native HTML5 web components. Ink sticks closely to the classic web development model of HTML, CSS, and JS, just adding a few extensions to HTML and JavaScript. It arguably has fewer concepts and tools to learn than some of the other framework options.
<style> h1 { font-weight: bold; } </style> <script> const name = 'world'; </script> <h1>Hello {name}!</h1>

Hello world!

At it's core, a ink file is a special template file that allows HTML, JavaScript, CSS and importing of components and templates. All of which are transpiled to TypeScript or JavaScript source code.
<style> h1 { font-weight: bold; } </style> <script> import { props } from '@stackpress/ink'; const { name } = props(); </script> <h1>Hello {name}!!</h1> import { props } from '@stackpress/ink'; export default class Hello extends InkComponent { styles() { return 'h1 { font-weight: bold; }'; } template() { const { name } = props(); return () => [ InkRegistry.createElement('h1', null, `Hello ${name}`) ] } }