[go: up one dir, main page]

Skip to content

unmaintain/tmpl.js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

⚠️ This project in not maintained! Fork for any improvements!

tmpl.js

The easiest string templating

Features

  • Easy data replacement in the string
  • No dependency
  • Compatible with all browsers
  • Nanoweight helper

Use

Use keys in double brackets to replace your data

Simple example

'These {{something}} are so {{adjective}}!'.tmpl({
    something: 'diamonds',
    adjective: 'shiny',
})

// These diamonds are so shiny!

With fetch

// define a project template here
const projectTmpl = `
<h2>{{name}}</h2>
<p>{{description}}</p>
`

// fetch a project data
const data = await (await fetch('path/to/data.json')).json()

// apply a project data to the template
const project = projectTmpl.tmpl(data)

// and append it
const projects = document.getElementById('projects')
projects.append(project)

License

Released under the MIT license