1.0.0 • Published 5 years ago

nekotron v1.0.0

Weekly downloads
2
License
MIT
Repository
github
Last release
5 years ago

Nekotron

A simple and easy to use HTML templating tool that makes your life easier while creating static websites!

About

Nekotron is intended as a light-weight and simple HTML templating tool without depending on any external packages or services. Currently this package depends on zero packages and stands completely on its own!

Features

  • Layouts
  • Variables

  • Sections

Go ahead and have a look at the next section to see how to get started with this project!

Getting Started

First off, you'll need to install the package as follows:

npm i nekotron

Now the installation is finished, you can start compiling HTML using the nekotron.compile function about which you'll find more details later on in this README.

Adding a Layout

Generally, you'll get started with a layout file which all other pages will extend. A basic layout looks like this.

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="utf-8">

    <title><!-- #var title Untitled --> &mdash; Your Website</title>
</head>
<body>
    <!-- #yield content -->
</body>
</html>

As you can see, so-called tokens are placed within a HTML comment and always starts with the # symbol. Here's a quick overview of all layout tokens:

  • define to define a new variable;
  • var to get a previously defined variable. The Untitled in the example means this is the default value which is used in case the variable is not defined;

  • yield to include a section token with the same name.

Now you got your layout set up, move on to the next step to create your first page!

Adding a Page

Layout files on their are own are not really that useful. This is where you need a page file, which basically extends your previously created layout. A page file could look like the example below.

<!-- #extends ../layout -->
<!-- #define title Home Page -->

<!-- #section content -->
<div class="container">
    <h1><!-- #var title --></h1>
    <p>Dolor sit amet. Some more text here!</p>
</div>
<!-- #endsection -->

As you can tell from the example, the following tokens are available to page files beside the ones described in the layout tokens, except for yield:

  • extends to tell the page file which layout file it should use to extend;
  • section to start a section with the name that was used in the yield token for the extended layout file;
  • endsection to close a previously opened section. All section tokens need to be closed with this.

Compiling a Page

The final step to using the full functionality of Nekotron is by compiling a page. This is done by creating a main file such as index.js. You can then compile a page using the following code.

const nekotron = require('nekotron');

// Compile a single file and output it to the 'dist' directory
nekotron.compile(__dirname + '/pages/index.html', __dirname + '/dist');

// Or compile an entire directory and output it to the 'dist' directory
nekotron.compile(__dirname + '/pages', __dirname + '/dist');

For a fully functional example of using this tool, check out the test directory of this repository!

Contributing

This project is always open for contributions and suggestions! Feel free to open an issue or pull request to submit changes, improvements and suggestions and to report bugs!

htmltemplating
1.0.0

5 years ago