Build a minimal blog with Deno and host it on Deno Deploy

irm https://deno.land/install.ps1 | iex

curl -fsSL https://deno.land/x/install/install.sh | sh

export PATH="/home/username/.deno/bin:$PATH"

deno upgrade

Create the blog from template and customize it

We’ll be using the deno_blog boilerplate to set up a very minimal, no frills blog. The creator of Deno, Ryan Dahl, uses a version of this template for his own blog.

Open a terminal and use the following command, substituting the path at the end where your project will live locally:

$ deno run -r --allow-read --allow-write https://deno.land/x/blog/init.ts ./directory/for/blog/

Once the blog is set up, go into the project directory and run the development server using the command deno task dev and go to the URL. Notice the default layout of everything.

To configure and customize the blog, edit the main.tsx file. It should look like the below:

/** @jsx h */

import blog, { ga, redirects, h } from "blog";

blog({
  title: "My Blog",
  description: "This is my new blog.",
  // header: <header>Your custom header</header>,
  // section: <section>Your custom section</section>,
  // footer: <footer>Your custom footer</footer>,
  avatar: "https://deno-avatar.deno.dev/avatar/blog.svg",
  avatarClass: "rounded-full",
  author: "An author",

  // middlewares: [

  // If you want to set up Google Analytics, paste your GA key here.
  // ga("UA-XXXXXXXX-X"),

  // If you want to provide some redirections, you can specify them here,
  // pathname specified in a key will redirect to pathname in the value.
  // redirects({
  //  "/hello_world.html": "/hello_world",
  // }),

  // ]
});

We’ll go through this bit by bit:

• The title will appear in large text directly under your avatar, and description will appear in smaller text right under that. The avatar parameter takes a URL for the image to be displayed, and avatarClass determines the avatar’s shape. Finally, author is self-explanatory, just use your own name here.

• The header, section and footer are commented out by default, but can be customized to change the default appearance of your blog. That’s beyond the scope of this guide. (Mainly because I haven’t messed with it too much myself.) It’s safe to delete this if you will not use it.

• The commented out middleware and redirects are fairly self-explanatory, you can add a Google Analytics key and specify some redirects. Feel free to delete if you’re not using them.
  
  

In addition, you can add the following parameters:

• dateStyle: "long" displays dates in long format, for example November 15, 2022 (the default is short format, e.g. 2022-11-15)
• favicon: "favicon.ico" lets you use a custom favicon, but be warned it only accepts .ico files — unfortunately it does not support SVG favicons at this time.
• lang: "en" specifies the blog’s language, the default is en (English).
• unocss: unocss_opts seems to be for importing Uno CSS but I have not used it myself.
  
  

Once you’ve got everything set up to your liking, you’ll need to push the project to a GitHub repo for the next step.