Socket
Socket
Sign inDemoInstall

boxedjs

Package Overview
Dependencies
1
Maintainers
1
Versions
12
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    boxedjs

Yet another static html templating engine


Version published
Weekly downloads
12
increased by200%
Maintainers
1
Install size
196 kB
Created
Weekly downloads
 

Readme

Source

boxedjs

Yet another templating engine.

Why?

While working on my personal website, which is just static HTML and CSS, I realised I would need some very basic templating system. I didn't want to clutter the project with too powerful or overly-complicated engines, just to repeat my footer and header in all the pages of the website.

So I wrote this.

NOTE: This is intended as an experiment and nothing more.

Install

npm install -g boxedjs

Project structure

The script needs to be run in the root folder of the project and it expects the following project structure:

/
├── assets/
├── pages/
├── templates/

where the content of the folders is the following:

  • assets: contains all the styling files, images and other files but html.
  • pages: contains the pages of your website
  • templates: contains the templates used inside the pages

How to use the templates in a page

Whenever you want to use one of the templates in one of the pages you can require them like the following:

<!DOCTYPE html>
<html>
  <head>
    <title>My templated website</title>
  </head>
  <body>
    [[header]] <!-- Template header.html -->
    <div>
      <p>Occaecat eu occaecat cupidatat et in dolore ullamco do dolore laboris magna deserunt in fugiat aute irure occaecat veniam tempor fugiat qui cillum ad aliquip dolore labore pariatur ut dolore est sit minim amet irure.
      </p>
    </div>
    [[footer]] <!-- Template footer.html -->
  </body>
</html>

Export

Once you finished writing your HTML, you can just run:

cd root_of_project
boxedjs

The website will be exported in the dist/ folder.

You can find more in the example/ folder

TODO:

  • create-new-project script
  • Configuration file for handling different folder structure
  • ...

FAQs

Last updated on 03 Sep 2017

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc