Blitz Templating Language

Blitz provides a completely custom templating language for use in custom templates. The goal was for templates to always be valid syntax in whatever language you're writing, rather than getting syntax errors in your IDE and having to build the template to see if its output is correct like you do with embedded languages like EJS.

Variable Interpolation

This is the core of any templating language, and this syntax should be fairly familiar if you've used Handlebars or anything similar. To insert a variable that's been provided to the template's context argument, surround it with double underscores:

__.

// Input
export default function __ModelName__Home() {
  return <div />
}
// Output
export default function TodosHome() {
  return <div />
}

Conditional Expressions

In order to retain our first principle of valid syntax, conditional experessions currently only work in TypeScript templates. At runtime we place all of the provided template context values onto

process.env, and when compiling the template we search for any conditional expressions against a valid template value on process.env. This works both for traditional if statements as well as ternary operations. Soon we hope to add support for conditional expressions in JSX for conditional component insertion as well.

If you access a variable that isn't a template value it is ignored, allowing functionality like dead code elimination via

process.env.NODE_ENV into template to work properly.

// Input
export default function __ModelName__Home() {
  if (process.env.includeAnalytics) {
    useEffect(() => {
      setupAnalytics()
    }, [])
  }
  // ...
}
// Output (includeAnalytics: true)
export default function __ModelName__Home() {
  useEffect(() => {
    setupAnalytics()
  }, [])
  // ...
}
// Output (includeAnalytics: false)
export default function __ModelName__Home() {
  // ...
}

---

Interested in helping with the templating language? There's plenty of room for improvement including supporting loops and iteration, actual evaluation of conditionals rather than only truthiness checks, and more! Join us in Slack.