Textglue Templates Tutorial

Introduction and Basic Use Case

Textglue is a simple static templating library, especially intended for rendering static standalone html files. This is useful for putting a webpage or webapp into a single file that can be distributed and reliably run without a webserver. A single standalone html file is a very portable way to distribute simple demo pages or small javascript based webapps. That way it can be downloaded and run offline on a variety of platforms without running a server. You can distribute these demos as a zipped file or just the raw html.

Installation and Setup

First create a project folder for your demo

mkdir template_demo
cd template_demo

If you have a little experience with python, you may want to create a virtual environment. To create a virtual environment and activate it, from your project folder run the following commands. Both windows and linux commands are shown:

python -m venv venv

Linux Activate Python Virtual Environment

source venv/bin/activate

Windows Activate Python Virtual Environment

venv\Scripts\activate.bat

A virtual environment simply allows you to install python dependencies and tools in a clean environment, it is not strictly required by often preferred by experienced python users.

Once you are in your project folder, with or without an active virtual environment, you will want to install the text glue dependency.

Install Textglue from pypi python package index

python -m pip install textglue

If that succeeds, then you should be able to call the textglue command to initialize the demo project or an empty text glue project.

Initialize Empty Textglue Project or Demo

Empty project:

textglue init

Textglue Demo:

textglue demo

Rendering a Textglue Template

If the project has been setup correctly, including with the textglue.json config file, you should be able to run

textglue render

This will process a template to output the rendered files. Typically this would be a single html file, but you can also use it for multiple file outputs, or for other text based file formats.

Here is an example of what you might see when your run the 'textglue render' command.

Rendering template folder "src" to "."

Template: index.html.glue
====================================================
arg name:'Home Page'
arg url:'/'
arg name:'Github Project'
arg url:'https://gitlab.com/derekmc/derekmc.gitlab.io/-/tree/main/projects/textglue'

  Preview (5/67 Lines):
    1-
    2-  <!doctype html>
    3-  <html>
    4-    <head>
    5-      <title>TTStatic DEMO</title>

============ Static File: README.md ============

The Textglue Config File

The textglue config file simply provides the details such as input and output folder, as well other information for the textglue render command. It specifies these properties in a simple json file. See the examples or the python source for more information.

Simple example

index.html.glue

<!doctype html>
<html>
  <head>
    <title>{{file:html/_name.html}}</title>
    {{file:html/_viewport.html}}
    <style>
      {{file:css/_style.css}}
    </style>
  </head>
  <body>
    <h1>{{file:html/_name.html}}</h1>
    <p> This is a textglue demo </p>
  </body>
</html>

html/_name.html

TextGlue Demo

html/_viewport.html

<meta name="viewport" content="width=device-width, initial-scale=1.0">

css/_style.css

body{
  font-family: sans-serif;
}
.fl-right{
  float: right;
}
.fff-000{
  color: #fff;
  background: #000;
}

Project Source Code and PyPi package

The package on PyPi: textglue pypi The source code: textglue source

Thank You

Thanks for trying out my project and I appreciate any feedback.

derekmc/textglue_tutorial.md

Select an option

No results found