Blog Return

A microservice which turns markdown into HTML over a '''RESTful''' API

This appllication takes a folder of markdown files, and runs an API which when accessed returns either a json string of all posts, or each individual file when called with a query.

Where to put your blog posts

On initial run of the application, it will create a folder named "assets". Blog posts will go inside here as markdown files.

The file name of each post becomes the url string. Each file must have a header denoting title, date, and draft status, surrounded by the character string '$~$':

$~$
title: A Blog, but it's a microservice (how this blog works)
date: 2024 Dec 15 12:08:21.234 +0500
draft: false
$~$
\\/ Blog content goes below second header string.

When parsing the markdown files, the generator will ignore files with the draft status as true.

How to use:

git clone https://gitlab.com/mseevee/blog-return
cd blog-return
cargo build --release
./target/release/blog-return

On the frontend website, add an HTML div <div class="hydrateMe"></div> and then add this Javascript:

let blogPost = (parsed, title, stem, date) => {
  let newFragment = new DocumentFragment;
  let blogDiv = document.createElement('div');
  blogDiv.setAttribute('class', 'blogPost');

  let titleHtml = `<h1><a href="/?stem=` + stem + `">` + title + `</a></h1>`;

  let dateHtml = `<p><i>` + date.substring(0, 10) + `</i></p>`;

  let innerhtml = titleHtml + dateHtml + parsed;
  
  blogDiv.innerHTML = innerhtml;
  newFragment.appendChild(blogDiv);
  return newFragment
};

async function getBlogs() {
  let params = new URLSearchParams(document.location.search);
  let stem = params.get("stem");
  let url = () => {
    if (stem == null) {
      return "http://localhost:3030/api/"
    } else {
      return "http://localhost:3030/api/?stem=" + stem
    }
  };

  let response = await fetch(url(), {
    method: "GET"
  }).then(async (res) => {
    try {
      const blogVal = await res.json()
      if (stem == null) {
        blogVal.forEach((element) => {
          document.getElementById('hydrateMe').appendChild(blogPost(element.summary, element.title, element.path, element.date));
        });
      } else {
        document.getElementById('hydrateMe').appendChild(blogPost(blogVal.parsed, blogVal.title, blogVal.path, blogVal.date));
      }
    } catch (error) {
      console.log(error);
      document.getElementById('hydrateMe').textContent = '404 Blog post not found :(';
    }
  }).catch((err) => {
    console.log(err);
  });
}
getBlogs();