vibecodeit

Build Bear Blog

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

0%0 of 16 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 minimal blog with Bear's constitution: Markdown in, static HTML out, zero client-side JavaScript and one stylesheet under 5 KB. Tags, RSS, a sitemap, optional privacy analytics, and a custom domain. Everything you add is a reason it stops being Bear.

estimated effort one sittingthe files for this build are in the project pack

BuildOne Node script with markdown-it, pinnedStylingOne inlined stylesheet under 5 KBHostingAny 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.

  1. 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

  2. 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

  3. 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

  4. have readyfree

    Why Phase 1 renders them.

    Get it Bear: Dashboard > Settings > Export. Otherwise copy your posts into Markdown files with a date.

  5. free

    Why Deploy on push.

    Get it Cloudflare Pages, Netlify or GitHub Pages connected to the repo. open ↗

  6. roughly $10 a year, or free on an existing domain

    Why The point of leaving is a domain you own.

    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 ↗

Data model

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

posts/*.md with frontmatter: title, date, slug, tags, draft. The folder is the CMS.

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.

VariableNeededExampleWhere the value comes from
SITE_URLrequiredhttps://yourname.blogCanonical base for RSS and OG.

The build, in order

  1. Build pipeline

    posts/*.md to dist/, drafts excluded, frontmatter errors loud.

    1. Read posts/*.md with frontmatter (title, date, slug, tags, draft), render index.html newest first and one page per post, copy static assets.

      Files build.mjs

      terminal
      mkdir bear && cd bear && git init && npm init -y && npm pkg set type=module && npm install markdown-it@14 gray-matter@4
mkdir -p posts static && cp .env.example .env
    done when · tick each as it passes
    next phase

  2. The stylesheet

    Under 5 KB, inlined, no script tag anywhere.

    1. Inline it in build.mjs.

    done when · tick each as it passes
    next phase

  3. Tags and RSS

    Tag pages, a full-content feed, sitemap, robots.

    done when · tick each as it passes
    next phase

  4. Privacy analytics (optional)

    Pageviews without a cookie or a raw IP, or nothing at all.

    1. The endpoint logs a daily-salted hash of IP and user agent per path; /stats behind basic auth. Write the decision down.

    done when · tick each as it passes
    next phase

  5. Deploy

    One command from Markdown to live.

    2. Files README.md

    done when · tick each as it passes
    next phase
what this build does not replace
after v1, if you want it

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