Build Hashnode

KINDAreplaces $5/mosaves $60/yrback to the verdict

0%0 of 19 items done

Saved on this device only. Tick prerequisites first, then work the phases in order · do not start one until the checks above it pass.

A developer blog you own: Markdown posts in a repo rendered by Astro with syntax highlighting, tags, RSS, search and a generated OG image per post, deployed to your domain, with a script that cross-posts to Hashnode with the canonical URL pointing home so you keep the feed without giving up ownership.

estimated effort weekendthe files for this build are in the project pack

FrameworkAstro with content collections, static outputContentMarkdown and MDX files in the repoHostingAny static host on your domain

Before step 1

Everything below is assumed from the first step. Tick each one when you actually have it, not when you plan to.

installfree
Why Everything in this build runs on it: the server, the scripts, the tests.
Get it Download the LTS installer from nodejs.org, or install with your package manager (brew install node, or nvm install 22). Restart the terminal afterwards. open ↗
Verify node --version prints v22 or higher
installfree
Why Every step below is a command you type or a file you edit.
Get it VS Code (code.visualstudio.com), Cursor or Zed. Open a folder for the project and use the editor's built-in terminal. open ↗
Verify You can open a folder and run a command in its terminal
installfree
Why History for your code, and the way most hosts deploy.
Get it Install from git-scm.com or with your package manager, then run git init in the project folder once it exists. open ↗
Verify git --version prints a version
have readyfree
Why Phase 1 imports them with their original dates.
Get it Hashnode: Blog dashboard > Export > download the JSON or Markdown export.
accountfree
Why Deploy on push.
Get it Cloudflare Pages or Netlify: connect the repository, build command npm run build, output dist. open ↗
accountroughly $10 a year, or free on an existing domain
Why Your posts at your address; canonical points here.
Get it Register at Cloudflare Registrar, Porkbun or Namecheap, or use a subdomain of one you already own. You add one DNS record in the deploy phase. open ↗
API keyfree
Why Phase 6 cross-posts via the API with canonical set to your domain.
Get it Hashnode > Account settings > Developer > Generate new token. open ↗

Data model

Create these before the first phase that stores anything. Changing a table later is the expensive kind of change.

Each post is one Markdown file with frontmatter: title, date, slug, tags, description, canonical (optional), draft (bool). The folder is the CMS and git is the history.

Environment variables

These go in a .env file the app reads at startup. The pack's .env.example is this table as a file · copy it, never commit the filled-in version.

Variable	Needed	Example	Where the value comes from
`SITE_URL`	required	`https://blog.yourdomain.com`	Canonical base for every post.
`HASHNODE_TOKEN`secret	optional	`...`	Developer token for cross-posting. Empty disables the script.
`HASHNODE_PUBLICATION_ID`	optional	`...`	From your Hashnode blog dashboard URL or the API.

The build, in order

1
Posts and routing
A validated content collection, post pages, an index, drafts excluded, code highlighted at build time.
1. title, date, slug, tags, description, canonical (optional), draft.
  Files src/content.config.ts
  terminal
  npm create astro@latest blog -- --template minimal --typescript strict --install --git cd blog && mkdir -p src/content/posts
done when · tick each as it passes
next phase
2
Reading experience
Typography, dark mode, a table of contents, reading time, anchors.
done when · tick each as it passes
next phase
3
Tags, RSS and search
Tag pages, a full-content feed, a sitemap, small client-side search.
1. terminal
  npx astro add rss sitemap
done when · tick each as it passes
next phase
4
SEO and cards
Canonical honoured, OG and JSON-LD present, an OG image per post.
2. terminal
  npm install satori@0.29.0 @resvg/resvg-js@2.6.2
done when · tick each as it passes
next phase
5
Newsletter signup
Emails stored locally; no sending in v1.
done when · tick each as it passes
next phase
6
Deploy and cross-post
Live on your domain, mirrored on Hashnode with canonical home.
2. Publish here first, syndicate second; the reverse leaves Hashnode canonical.
done when · tick each as it passes
next phase
7
Operate the newsletter endpointproduct builder
Only if you keep the signup: monitor and back it up like any small server.
done when · tick each as it passes

what this build does not replace

The network feed; cross-posting with canonical is the honest way to keep it.
Comments, reactions and image hosting.
the developer network feed and its discovery
built-in newsletter delivery
comments and reactions from a logged-in audience
the editor and image hosting

after v1, if you want it

Cross-post to dev.to with the same canonical rule
A series or collection page type

Need the files? The project pack on the verdict page hands your agent the whole brief · more publishing.