Delta-cli NPM | npm.io

Welcome to Delta Cli!

Delta CLI is depricated, checkout Ace-CLI: https://www.npmjs.com/package/ace-clir

Delta is a CLI toolkit that helps you build static websites with reusable components which are rendered beforehand

This project is helpful especially when you do not need to overkill and go for heavy frameworks.

Get Started by a starting template:

$ delta-cli create <name>

will create your app

To build your app, simply use

$ delta-cli build

$ delta-cli server

to watch for changes

How does delta works?

Delta works by simply creating components separately which reduces a lot of redundant code, and speeding up process.

To create a component, simply create a html file with any name (Without space) inside the components folder

eg. components/hello.html

Now you can use the tag

<hello></hello> inside the page and other components.

Variables

you can pass variables like this:

<hello name="value"></hello>

and you can use the variable inside the html like this:

inside hello.html:

<h1>{ name }</h1>

Children

any child elements or text like this:

<component>
    child
</component>

are passed onto the { children } variable

templates

You can re-use a template for stuff like CDN, for which before you had to add the CDN to each page separatly, you can do it from one single template.

Templates also accept arguments like components.

To create a template, create a html file of any name without space inside the templates folder

eg. templates/basic.html

Now to use a template inside of a page, simply use the template file name as a tag and put all the children inside.

in templates/basic.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>{ title }</title>
</head>
<body>
    { children }
</body>
</html>

in pages/index.html

<basic title="Hello World">
    <div>
        Hello World
    </div>
</basic>

NOTE: If you are using the template tag and write something outside the template tag, the outside content will get overriden

NOTE: Do not name the template as default tags, like div or template because it will cause document conflicts and will not result in proper formatting