https://github.com/iWaroz/HTML.JS

It's a javascript framework! However, you have to write frontend logic with HTML, and backend logic with HTML too. Have fun!
https://github.com/iWaroz/HTML.JS

Last synced: 4 days ago
JSON representation

It's a javascript framework! However, you have to write frontend logic with HTML, and backend logic with HTML too. Have fun!

• Host: GitHub
• URL: https://github.com/iWaroz/HTML.JS
• Owner: iWaroz
• License: mit
• Created: 2022-11-09T12:53:01.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2022-11-11T19:18:12.000Z (about 2 years ago)
• Last Synced: 2024-08-02T20:46:59.805Z (3 months ago)
• Language: JavaScript
• Size: 9.77 KB
• Stars: 23
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        

# HTML.JS

Sponsored by [Hostinger](https://hostinger.com/abyteofcode), get 10% off at checkout with code `ABYTEOFCODE`.

HTML.JS is a full stack javascript framework in which you don't need to write any javascript.

## Contributing

This demo was made mainly as satire, and as such is incomplete and does not provide any debugging help. If you want to make changes to improve the framework, go ahead lol

## Setup

Download the repository files into a node.js project and make sure to run the `index.js` file on execution. This will run your `script.html` file which is to contain your backend code.

## The Syntax

### Literals

Use `12` or `hello world` to create literal integers or strings. You also have `` or `` literal booleans. To create a list, use `` with each tag inside of array being its own value of the list.

  

### Functions

Use 

```html

  

    

    

  

  

  

    ... code here

  

``` 

to create a function. The name attribute and arguments are optional but not the block. A function without any name can be used directly as a value, with functions being first class citizens.

  

### Accessing Values

Use `` to get the value of a variable. If you need a property of it, add `` at the end of it (Eg. ``)

  

### Assigning Values

Use `...` to set the value of foo. To set a property or other runtime value, use

```html

  

    ... composite name eg. 

  

  ... value

```

In the case the value requires multiple tags, use `... value`.

  

### Functions & Operators

Call a function with `[function][arg1][arg2][arg...]`. In case the function or any argument is a composite value, be sure to use group. Similarily, operators work with `[arg1][arg2][arg...]` with whatever operator you want to use instead of +.

  

### Conditionals

Use 

```html

  [condition]

  [code]

  [more code...]

```

for conditionals, then simply string on as many `` tags as you want with the same internal structure and finally an optional `` tag without conditions.

  

### Looping

Use 

```html

  [condition]

  [code]

  [more code...]

```

The condition will be evaluated every iteration of the loop, and if it returns a falsy value, the loop will terminate. Otherwise, it will run the rest of the block.

  

## Behind the scenes

All the "framework" is doing is taking your HTML which looks very similar to how javascript is structured, and it converts the HTML into javascript and runs that. This means you can write code more efficiently by writing it in javascript first and then converting it to HTML.JS (that's what I did to make the code in the video lol)