Tntjs NPM | npm.io

TNT.js

License version

TNT.js

The JavaScript framework for modern web.

Roadmap

Please refer to TNT.js Roadmap.

Demo

Installation

Simply use package managers to install TNT.js:

$ npm i tntjs
$ # or
$ yarn add tntjs

Then add two files App.js and index.html:

import TNTApp from "tnt.min.js";

const app = new TNTApp()
  .useData({
    x: 233333,
    list: [
      "Alice",
      "Bob",
      "Candy"
    ]
  })
  .mount(document.getElementById("root"))

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>tntjs demo</title>
  </head>
  <body>
    <div id="root">
      <v data="x"></v>
      <t-for data="i in list">
        <v data="i"></v>
      </t-for>
    </div>
    <script type="module" src="./App.js"></script>  <!-- ES Modules! -->
  </body>
</html>

This is a kitchen-sink example of the current version of TNTjs. Might not be up-to-date though.

use <v data="variableName"/> to set variable and the bound variables are all reactive variables. They change the page as the value changes, and support expressions.

Documentation

Please refer to https://tntjs.bugduck.cn/doc.html for more information.

Sponsoring

We're all middle school students and we don't have that much money. So sponsoring TNTjs will give us an extra reward to let us keep updating!😉

Sponsor us on ZhiFuBao Sponsor us on WeChat

Contributors

Emoji guidelines:
- :star: : Community administrator
- :pen: : Major contributor
- :student: : Student


箱子Acbox :star: :pen: :student:	samzhangjy :star: :pen: :student:	mono :star: :pen:	27Onion :pen: :student:	leonfyr :pen: :student:	Rotten-LKZ :student: