generate static sites in javascript

There are several popular tools available in JavaScript for generating static sites including:

1. GatsbyJS: It's a React-based framework which provides a pre-configured environment with GraphQL, webpack, and other tools for generating fast, SEO-friendly static websites.

2. Next.js: It's a similar framework based on React and provides server-side rendering, static site generation as well as framework-based dynamic rendering.

3. Hugo: It's a static site generator built-in Go which generates static sites from markdown and provides many pre-built themes and templates.

4. Nunjucks: It's a templating engine for Node.js which allows you to create static HTML pages from templates and data.

Here's an example of using Nunjucks to generate a static HTML page from a template and some data:

index.tsx
const nunjucks = require('nunjucks');
const fs = require('fs');

// provide the data to the template
const templateData = {
  title: 'My Page Title',
  body: 'This is the page content.'
};

// load the template
const template = fs.readFileSync('template.html', { encoding: 'utf-8' });

// configure nunjucks
nunjucks.configure({ autoescape: true });

// render the template with the data
const output = nunjucks.renderString(template, templateData);

// write the output to a file
fs.writeFileSync('output.html', output);
522 chars
21 lines

In this example, we loaded a template file named 'template.html' which contains placeholders for our data (title and body). We then loaded the data into the template using the nunjucks.renderString() method and wrote the resulting HTML to a file named 'output.html'.