Skip to content

Commit effbe05

Browse files
corylanoucorylanou
committed
feat: initial site setup with hype blog
Scaffold hypemd.dev using hype's blog system with the developer theme. Includes custom layout overrides for marketing hero section, nav links, and footer. Adds Getting Started tutorial, Dockerfile for Dokploy deployment, CI workflow for build validation, and project configuration.
0 parents  commit effbe05

19 files changed

Lines changed: 607 additions & 0 deletions

File tree

‎.github/pull_request_template.md‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
## Summary
2+
3+
<!-- What does this PR do? -->
4+
5+
## Type
6+
7+
- [ ] Content (new article or content update)
8+
- [ ] Layout/Theme (template or styling changes)
9+
- [ ] Infrastructure (Dockerfile, CI, config)
10+
- [ ] Other
11+
12+
## Test Plan
13+
14+
- [ ] `make build` succeeds
15+
- [ ] `make dev` shows changes correctly in browser
16+
- [ ] No broken links or missing assets

‎.github/workflows/ci.yml‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
name: CI
2+
3+
on:
4+
pull_request:
5+
branches: [main]
6+
push:
7+
branches: [main]
8+
9+
jobs:
10+
build:
11+
runs-on: ubuntu-latest
12+
steps:
13+
- uses: actions/checkout@v4
14+
15+
- uses: actions/setup-go@v5
16+
with:
17+
go-version: "1.24"
18+
19+
- name: Install hype
20+
run: go install github.com/gopherguides/hype/cmd/hype@latest
21+
22+
- name: Build site
23+
run: hype blog build
24+
25+
- name: Verify output
26+
run: |
27+
test -f public/index.html || (echo "Missing index.html" && exit 1)
28+
test -f public/rss.xml || (echo "Missing rss.xml" && exit 1)
29+
test -f public/sitemap.xml || (echo "Missing sitemap.xml" && exit 1)

‎.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
public/
2+
.DS_Store

‎CLAUDE.md‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
# Claude Code Instructions for hypemd.dev
2+
3+
## Project Overview
4+
5+
This is the public website for [Hype](https://github.com/gopherguides/hype), deployed at https://hypemd.dev via Dokploy. The entire site is built and served using hype's blog system — full dogfooding.
6+
7+
## Build & Serve
8+
9+
```bash
10+
make build # Build static site to public/
11+
make serve # Serve on localhost:3000
12+
make dev # Serve with file watching (auto-rebuild)
13+
make clean # Remove public/ directory
14+
```
15+
16+
## Content
17+
18+
Articles live in `content/<slug>/module.md`. Create new articles with:
19+
20+
```bash
21+
hype blog new <slug>
22+
```
23+
24+
Article frontmatter uses `<details>` blocks:
25+
26+
```markdown
27+
# Title
28+
29+
<details>
30+
slug: my-article
31+
published: MM/DD/YYYY
32+
author: Gopher Guides
33+
seo_description: Brief description for SEO
34+
tags: tag1, tag2
35+
</details>
36+
```
37+
38+
## Layout Overrides
39+
40+
Project-level layout overrides are in `layouts/`. These take priority over theme templates in `themes/developer/`.
41+
42+
- `layouts/_default/list.html` — Home page with hero section + article list
43+
- `layouts/partials/header.html` — Navigation with site links
44+
- `layouts/partials/footer.html` — Footer with links
45+
46+
## Deployment
47+
48+
- Auto-deploys on merge to main via Dokploy
49+
- Dockerfile builds hype from source, then builds and serves the site
50+
- Dokploy handles TLS termination
51+
52+
## Git Workflow
53+
54+
- Never commit directly to main
55+
- Create feature branches: `feat/`, `fix/`, `docs/`, `content/`
56+
- All PRs must pass CI (build validation)

‎Dockerfile‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
FROM golang:1.24 AS builder
2+
RUN go install github.com/gopherguides/hype/cmd/hype@latest
3+
4+
FROM golang:1.24
5+
COPY --from=builder /go/bin/hype /usr/local/bin/hype
6+
WORKDIR /site
7+
COPY . .
8+
RUN hype blog build
9+
EXPOSE 3000
10+
CMD ["hype", "blog", "serve", "--addr", ":3000"]

‎Makefile‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
.PHONY: build serve dev clean
2+
3+
build:
4+
hype blog build
5+
6+
serve:
7+
hype blog serve
8+
9+
dev:
10+
hype blog serve -watch
11+
12+
clean:
13+
rm -rf public/
14+
15+
docker-build:
16+
docker build -t hypemd-dev .
17+
18+
docker-run:
19+
docker run -p 3000:3000 hypemd-dev

‎config.yaml‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
title: "Hype"
2+
description: "Dynamic Markdown — execute code, include files, and validate content at build time"
3+
baseURL: "https://hypemd.dev"
4+
author:
5+
name: "Gopher Guides"
6+
email: ""
7+
twitter: ""
8+
theme: "developer"
9+
highlight:
10+
style: "monokai"
11+
lineNumbers: false
12+
seo:
13+
ogImage: "/images/og-default.png"
14+
twitterCard: "summary_large_image"
15+
contentDir: "content"
16+
outputDir: "public"

‎content/getting-started/module.md‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
# Getting Started with Hype
2+
3+
<details>
4+
slug: getting-started
5+
published: 03/15/2026
6+
author: Gopher Guides
7+
seo_description: Learn how to install Hype, create your first dynamic Markdown document, and execute code blocks at build time.
8+
tags: tutorial, getting-started, hype
9+
</details>
10+
11+
Hype is a content engine that makes Markdown dynamic. You can execute code, include files, and validate everything at build time. This guide walks you through installation and your first hype document.
12+
13+
## Installation
14+
15+
Install hype with Homebrew:
16+
17+
```shell
18+
brew install gopherguides/tap/hype
19+
```
20+
21+
Or install directly with Go:
22+
23+
```shell
24+
go install github.com/gopherguides/hype/cmd/hype@latest
25+
```
26+
27+
Verify the installation:
28+
29+
```shell
30+
hype version
31+
```
32+
33+
## Your First Hype Document
34+
35+
Create a new file called `module.md`:
36+
37+
```markdown
38+
# Hello Hype
39+
40+
This document is powered by hype.
41+
```
42+
43+
Build it to HTML:
44+
45+
```shell
46+
hype export -format html -f module.md
47+
```
48+
49+
Or export to Markdown (useful for generating README files):
50+
51+
```shell
52+
hype export -format markdown -f module.md
53+
```
54+
55+
## Code Execution
56+
57+
One of hype's most powerful features is executing code blocks at build time. When you include a Go source file and mark it for execution, hype runs the code and captures the output.
58+
59+
Create a `src/main.go` file next to your `module.md`:
60+
61+
```go
62+
package main
63+
64+
import "fmt"
65+
66+
func main() {
67+
fmt.Println("Hello from Hype!")
68+
}
69+
```
70+
71+
Then reference it in your Markdown using hype's include syntax. The code will be executed during build, and the output will appear in your final document.
72+
73+
This means your documentation always reflects the actual behavior of your code. If the code changes, the docs update automatically. If the code breaks, the build fails — so you catch issues before they ship.
74+
75+
## Starting a Blog
76+
77+
Hype includes a built-in static blog generator:
78+
79+
```shell
80+
hype blog init mysite
81+
cd mysite
82+
hype blog new hello-world
83+
hype blog build
84+
hype blog serve
85+
```
86+
87+
This creates a full blog with themes, RSS feeds, sitemaps, and SEO support — all powered by hype's dynamic Markdown.
88+
89+
## Next Steps
90+
91+
- Read the [full documentation](https://github.com/gopherguides/hype#readme)
92+
- Browse the [source code](https://github.com/gopherguides/hype)
93+
- Report [issues](https://github.com/gopherguides/hype/issues)

‎layouts/_default/list.html‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
{{define "main"}}
2+
<!-- Hero Section -->
3+
<div class="mb-16 pt-8">
4+
<div class="flex items-center gap-2 text-emerald-400 text-sm mb-6 font-mono">
5+
<span class="text-gray-500">$</span>
6+
<span>hype build</span>
7+
</div>
8+
<h1 class="text-5xl font-bold mb-4 font-mono leading-tight">
9+
Markdown that <span class="text-emerald-400">executes</span>.
10+
</h1>
11+
<p class="text-xl text-gray-400 font-mono mb-8 max-w-3xl leading-relaxed">
12+
Hype is a content engine for technical writers. Execute code blocks, include files,
13+
and validate everything at build time. Your docs are never out of date.
14+
</p>
15+
<div class="flex gap-4 font-mono text-sm">
16+
<a href="https://github.com/gopherguides/hype" class="bg-emerald-500 text-gray-950 px-6 py-3 rounded font-bold hover:bg-emerald-400 transition-colors">
17+
Get Started
18+
</a>
19+
<a href="https://github.com/gopherguides/hype" class="border border-gray-700 text-gray-300 px-6 py-3 rounded hover:border-emerald-400 hover:text-emerald-400 transition-colors">
20+
View on GitHub
21+
</a>
22+
</div>
23+
</div>
24+
25+
<!-- Features Grid -->
26+
<div class="grid md:grid-cols-3 gap-6 mb-16">
27+
<div class="border border-gray-800 rounded-lg p-6 hover:border-emerald-400/30 transition-colors">
28+
<div class="text-emerald-400 font-mono text-sm mb-2">// execute</div>
29+
<h3 class="font-mono font-bold mb-2">Code Execution</h3>
30+
<p class="text-gray-400 text-sm">Run Go, shell commands, and more directly from your Markdown. Output is captured and included in the final document.</p>
31+
</div>
32+
<div class="border border-gray-800 rounded-lg p-6 hover:border-emerald-400/30 transition-colors">
33+
<div class="text-emerald-400 font-mono text-sm mb-2">// include</div>
34+
<h3 class="font-mono font-bold mb-2">File Includes</h3>
35+
<p class="text-gray-400 text-sm">Include source files, snippets, and outputs. Keep your documentation DRY and always synchronized with your codebase.</p>
36+
</div>
37+
<div class="border border-gray-800 rounded-lg p-6 hover:border-emerald-400/30 transition-colors">
38+
<div class="text-emerald-400 font-mono text-sm mb-2">// validate</div>
39+
<h3 class="font-mono font-bold mb-2">Build-Time Validation</h3>
40+
<p class="text-gray-400 text-sm">Broken links, missing files, and failing code are caught at build time. Ship docs you can trust.</p>
41+
</div>
42+
</div>
43+
44+
<!-- Install Section -->
45+
<div class="mb-16 border border-gray-800 rounded-lg p-6">
46+
<div class="text-emerald-400 font-mono text-sm mb-3">// install</div>
47+
<div class="bg-gray-900 rounded p-4 font-mono text-sm">
48+
<div class="text-gray-500 mb-1"># with Homebrew</div>
49+
<div class="text-gray-100">brew install gopherguides/tap/hype</div>
50+
<div class="text-gray-500 mt-3 mb-1"># or with Go</div>
51+
<div class="text-gray-100">go install github.com/gopherguides/hype/cmd/hype@latest</div>
52+
</div>
53+
</div>
54+
55+
<!-- Articles Section -->
56+
{{if .Articles}}
57+
<div>
58+
<div class="flex items-center gap-2 text-emerald-400 text-sm mb-4 font-mono">
59+
<span class="text-gray-500">$</span>
60+
<span>ls -la articles/</span>
61+
</div>
62+
<div class="text-gray-500 text-xs font-mono pb-2 border-b border-gray-800">
63+
total {{len .Articles}}
64+
</div>
65+
<div class="space-y-4 mt-4">
66+
{{range .Articles}}
67+
<article class="group py-4 border-b border-gray-800 hover:bg-gray-900/50 transition-colors -mx-4 px-4">
68+
<div class="flex items-start gap-4">
69+
<div class="text-gray-500 text-xs font-mono whitespace-nowrap pt-1">
70+
{{.FormattedDate}}
71+
</div>
72+
<div class="flex-1 min-w-0">
73+
<h2 class="text-lg font-mono mb-1">
74+
<a href="{{.URL}}" class="text-white hover:text-emerald-400 transition-colors">
75+
{{.Title}}
76+
</a>
77+
</h2>
78+
{{if .SEODescription}}
79+
<p class="text-gray-400 text-sm line-clamp-2">{{.SEODescription}}</p>
80+
{{end}}
81+
<div class="flex items-center gap-4 mt-2 text-xs text-gray-500 font-mono">
82+
{{if .Author}}<span>@{{.Author}}</span>{{end}}
83+
{{if .ReadingTime}}<span>~{{.ReadingTime}}m</span>{{end}}
84+
{{if .Tags}}
85+
<div class="flex gap-1">
86+
{{range .Tags}}<span class="text-emerald-600">#{{.}}</span>{{end}}
87+
</div>
88+
{{end}}
89+
</div>
90+
</div>
91+
<a href="{{.URL}}" class="text-emerald-400 opacity-0 group-hover:opacity-100 transition-opacity font-mono text-sm">
92+
&rarr;
93+
</a>
94+
</div>
95+
</article>
96+
{{end}}
97+
</div>
98+
</div>
99+
{{end}}
100+
{{end}}

‎layouts/partials/footer.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{{define "partials/footer"}}
2+
<footer class="border-t border-gray-800 mt-auto">
3+
<div class="max-w-5xl mx-auto px-4 py-6 text-center text-gray-500 font-mono text-sm">
4+
<div class="flex justify-center gap-6 mb-3">
5+
<a href="https://github.com/gopherguides/hype" class="hover:text-emerald-400 transition-colors">GitHub</a>
6+
<a href="https://github.com/gopherguides/hype/issues" class="hover:text-emerald-400 transition-colors">Issues</a>
7+
<a href="/rss.xml" class="hover:text-emerald-400 transition-colors">RSS</a>
8+
</div>
9+
<p>
10+
<span class="text-gray-600">//</span>
11+
&copy; {{.CurrentYear}} {{.Config.Title}}
12+
{{if .Config.Author.Name}}
13+
<span class="text-gray-600">|</span>
14+
{{.Config.Author.Name}}
15+
{{end}}
16+
</p>
17+
</div>
18+
</footer>
19+
{{end}}

0 commit comments

Comments
 (0)