Dust

small static site generator with ( ocaml 🐫 / reasonml / rescript ) syntax

Table Of Contents

• Introduction
• Prerequisites
• Installation
• Documentation
  • Basics
  • Working with data
  • Configuration
  • Advanced & API

Introduction

Dust is a static site generator for hardcore ppl, that use ocaml 🐫 syntax as the template engine and transform it into static HTML; inspired from Halogen. Dust use Rescript as compiler, so you can use Rescript API like Js, Belt, Array, List also Node module & etc.

Benefit using Dust:

• Functional approach, Safe & Expressive. If you write wrong code, it will give you nice feedback (thanks Rescript). Also you can use looping, pattern matching or whatever like normal ocaml code (except u can't use ocaml packages, ofc).

example

module H = Dust.Html.Elements
module A = Dust.Html.Attributes

let head appname = 
  H.head [] [
    H.title [] (H.text appname)
  ]

(** Js code executed in compile time not runtime*)
let year = 
  Js.Date.now () 
  |> Js.Date.fromFloat 
  |> Js.Date.getFullYear 
  |> Js.Float.toString

let body = 
  H.body [] [
    H.h1 [] (H.text "Last this page rendered is: " ^ year)
  ]

(** main function is important to render the code into HTML *)
let main () =
  H.html [] [
    head "this is head title"
  ; body
  ; H.footer [] [
      H.span [] (H.text year)
    ]
  ]

Installation

Initialize project

# create project folder
mkdir yourapp
cd yourapp

# init with npm
npm init -y

# init with yarn
yarn init -y

Install Dependencies

# using npm
npm install rescript --save-dev
npm install @fahmiirsyadk/dust

# using yarn
yarn add -D rescript
yarn add @fahmiirsyadk/dust

Configuration

Configure bsconfig.json

Create a file named bsconfig.json in your project folder & paste code below, also change the name

{
  "name": "yourapp",
  "version": "0.0.1",
  "sources": [
    {
      "dir": "src",
      "subdirs": true
    }
  ],
  "package-specs": {
    "module": "commonjs",
    "in-source": true
  },
  "suffix": ".js",
  "bs-dependencies": [
    "@fahmiirsyadk/dust"
  ],
  "warnings": {
    "error": "+101"
  }
}

Configure run scripts

Open package.json & add script below to run dust

"scripts": {
  "dev": "npx dust w", 
  "build": "npx dust",
  "re:dev": "rescript build -w",
  "re:clean": "rescript clean",
  "re:build": "rescript",
  "export": "rescript && npx dust"
}

Documentation