Getting Started With Deenie

Warning

Deenie is still in an early alpha. The API is expected to change. Get involved with the development of deenie on Codeberg!

Install

Install the deenie CLI from JSR:

deno install --global --name=deenie --no-config \
  --allow-read="." --allow-write="." --allow-env="DEENIE" \
  jsr:@deenie/deenie@^0.0.1-alpha.4/cli

Project Setup

Minimally, deenie needs the following:

  • A configuration file – this is where you can specify project configuration
  • A source directory – this is where your Markdown, CSS, JavaScript, images, etc. will go.
  • A template directory – this is where your Nunjucks templates will go.

Example Project

Let's create a minimal example project. First, create the following directory structure in your project folder:

  • site/
    • index.md
  • templates/
    • base.njk
  • deenie.config.js

Then, we can create some cool Markdown in site/index.md:

---
title: Cool Page
template: base.njk
---

# My Really Cool Website

Welcome to my really cool website!

And we can specify a template for our website in templates/base.njk:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ data.title + " | " + page.metadata.title }}</title>
</head>
<body>
<main id="main">
    {{ page.content | safe }}
</main>
</body>
</html>

And finally, we can tie everything together with a config file, deenie.config.js:

export default {
    src: "site",  // Path to the site folder
    templates: "templates",  // Path to the template folder

    title: "Cool Website"
}

And finally, with any luck, running the following command will build the project:

deenie build --out="build" deenie.config.js

You should now see a build directory that contains an index.html file!

Adding Some Style

To add styles, create a site/styles.css file:

:root {
    font-family: sans-serif;
    font-size: 2rem;
}

And reference this by adding the following to the <head> in the template file:

<link rel="stylesheet" href="styles.css">

Running the build command again will now copy over the styles.css file into the build directory.