Malina.js

Frontend compiler, inspired by Svelte

UI FrameworkSvelte
malinajs/malinajsmalinajs.github.io

README


Malina.js



Malina.js builds your web-application to use it without framework on frontend side. Therefore your web-app becomes thinner and faster, and the application itself consists of vanilla JavaScript, look at examples. TodoMVC example2.7kb (gzipped) and source code.

For documentation about Malinajs, please visit our website.
Also, please join our community on Discord or Telegram.

tools


Syntax Highlighter for VS-Code
Try Malina.js online (REPL)

Articles


Comparision with Svelte.js
Comparision with Vue 3
Passing CSS classes to child components
Using fragments

The Gist


  1. ```html
  2. <script>
  3.   let name = 'world';
  4.     
  5.   function rename() {
  6.     name = 'user';
  7.   }
  8. </script>
  9. <h1>Hello {name.toUpperCase()}!</h1>
  10. <button @click={rename}>Rename</button>
  11. ```

Quick Start


You can get started with a simple app by running the following in your terminal:
  1. ```
  2. npx create-malina myapp
  3. cd myapp
  4. npm run dev
  5. # open http://localhost:7000/
  6. ```


Or via Docker:
  1. ```
  2. docker run --rm -it --user ${UID} -p 7000:7000 -v `pwd`:/app/src lega911/malina
  3. # open http://localhost:7000/
  4. ```


Build compiler
  1. ```
  2. npm install
  3. npm run build
  4. ```

License


MIT