Skip to content

Latest commit

 

History

History
290 lines (201 loc) · 3.82 KB

doc.md

File metadata and controls

290 lines (201 loc) · 3.82 KB

How to write binx document?

Binx syntax similar to xml syntax. Anyone knows xml syntax can easily write a binx document.

Module

Import module

import { compile } from "/path/to/binx/index.js";

Usage compile function

const compiled = compile(`!DOCTYPE[html]
html[lang="tr"]{
    head{
        title{BINX}
    }
    body{
        p#tag-id.tag-class.class2[style="color:gray;"]{
            \\tbinx is\\s not\\nxml
        }
    }
    script[src="./script.js"]{}
}`);
console.log(compiled.type, compiled.output);

CLI

flags

  • compile or c
    Compiles binx file into xml/html.
    If output not specified, writes to stdout.

  • serve or s
    serves path on local host.

  • version
    print binx version

  • help
    shows help menu

examples

# writes output to stdout
$ binx compile /path/to/input.bx

# writes output to output file
$ binx c /path/to/input.bx /path/to/output.html

# compiles and serves path on local host
$ binx serve /path/

# compiles and serves path on local host with spesific port
# default is 8080
$ binx serve /path/ 3000

Writing binx document.

Important

Document type specifying is required on document start.

Specify document type

``` Document start ```
!DOCTYPE[html]

Normal tags

IMPORTANT

Important

The ID must always be specified before the class. And binx does not supports inline JavaScript and CSS coding.

in xml

<tag-name attribute="value" id="tag-id" class="class class2">
    tag content
</tag-name>

in binx

tag-name#tag-id.class.class2[attribute="value"]{
    tag content
}

Self-closed tags

in xml

<tag-name attribute="value" id="tag-id" class="class class2" />

in binx

tag-name#tag-id.class.class2[attribute="value"]&

Non Self-closed tags

in xml

<tag-name attribute="value" id="tag-id" class="class class2">

in binx

tag-name#tag-id.class.class2[attribute="value"]%

Question tags

in xml

<?php echo 'Hello, world!'; ?>

in binx

?php{
    echo 'Hello, world!';
}

Exclamation tags

in html

<!DOCTYPE html>

in binx

!DOCTYPE[html]

Set tag id

in xml

<tag-name id="tag-id"></tag-name>

in binx

tag-name#tag-id{}

Set tag class

in xml

<tag-name class="class class2"></tag-name>

in binx

tag-name.class.class2{}

Set tag attributes

in xml

<tag-name attribute="value"></tag-name>

in binx

tag-name[attribute="value"]{}

New line

in html

<br>

in xml

<br/>

in binx

\n

Reversed slash

in xml

\

in binx

\\

Tab space

in xml

&emsp;

in binx

\t

Space in tab content

in xml

&nbsp;

in binx

\s

Examples

-> Click to go example.bx file.

binx syntax example