Skip to content

Commit f81870e

Browse files
author
Splitter
committed
docs: edit
1 parent c285b90 commit f81870e

1 file changed

Lines changed: 182 additions & 68 deletions

File tree

‎README.md‎

Lines changed: 182 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,124 +1,238 @@
1-
# [Developer Portfolio](https://hugoblox.com/templates/dev-portfolio/start?utm_source=github&utm_medium=readme)
1+
# [The Dev Portfolio That Gets You Hired](https://github.com/HugoBlox/hugo-theme-dev-portfolio)
22

3-
[![Screenshot](.github/preview.png)](https://hugoblox.com/templates/dev-portfolio/start?utm_source=github&utm_medium=readme)
3+
[![Screenshot](.github/preview.png)](https://hugoblox.com/templates/dev-portfolio?utm_source=github&utm_medium=readme&utm_content=preview)
44

5-
<h1 align="center">The Dev Portfolio That Gets You Hired</h1>
5+
<!-- TODO: Replace with a short demo video showing Hugo Chat generating a portfolio page -->
6+
https://github.com/user-attachments/assets/a6b676c0-1c10-4734-a55f-68c6f72d1612
7+
8+
<h1 align="center">Ship Your Portfolio Before The Weekend</h1>
69

710
<p align="center">
8-
<strong>Built for uni students, STEM grads, and software engineers.</strong><br/>
9-
Showcase real projects, ship a clean blog, and stand out with a modern dark-first design — without a fragile “black box” React app.
11+
<strong>Your projects deserve better than a GitHub pinned repo.</strong><br/>
12+
Showcase real work, ship a clean blog, and stand out with a modern dark-first design — all from Markdown files you own. No fragile React app required.<br/>
13+
Built on <a href="https://github.com/HugoBlox/kit">HugoBlox</a> — the open-source framework where AI generates your pages and you own everything as Markdown.
1014
</p>
1115

1216
<p align="center">
13-
<a href="https://hugoblox.com/templates/dev-portfolio/start?utm_source=github&utm_medium=readme"><b>🚀 Deploy in 60s (Free)</b></a>
14-
&nbsp;•&nbsp;
15-
<a href="https://hugoblox.com/templates/?open=dev-portfolio&loading=true&utm_source=github&utm_medium=readme">Live Demo</a>
16-
&nbsp;•&nbsp;
17-
<a href="https://docs.hugoblox.com/guides/studio/">Ownable CMS (Visual Editor)</a>
17+
<a href="https://hugoblox.com/templates/dev-portfolio?utm_source=github&utm_medium=readme&utm_content=cta_top"><b>Deploy Free (60s)</b></a>
18+
&nbsp;&nbsp;|&nbsp;&nbsp;
19+
<a href="https://hugo.chat/?utm_source=github&utm_medium=readme&utm_content=cta_top_dev-portfolio"><b>Customize with AI</b></a>
20+
&nbsp;&nbsp;|&nbsp;&nbsp;
21+
<a href="https://hugoblox.com/templates/dev-portfolio?utm_source=github&utm_medium=readme&utm_content=demo">Live Demo</a>
1822
</p>
1923

24+
<div align="center">
25+
26+
<a href="https://github.com/HugoBlox/hugo-theme-dev-portfolio">
27+
<img src="https://img.shields.io/github/stars/HugoBlox/hugo-theme-dev-portfolio?label=Star&logo=github&style=flat-square&color=181717" alt="GitHub Stars">
28+
</a>
29+
<a href="https://discord.gg/z8wNYzb">
30+
<img src="https://img.shields.io/discord/722225264733716590?label=Discord&logo=discord&logoColor=white&style=flat-square&color=5865F2" alt="Discord">
31+
</a>
32+
<a href="https://github.com/HugoBlox/kit">
33+
<img src="https://img.shields.io/github/stars/HugoBlox/kit?label=HugoBlox&logo=github&style=flat-square&color=181717" alt="HugoBlox Stars">
34+
</a>
35+
36+
</div>
2037

2138
<p align="center">
22-
<b>▶︎ Watch 12s Preview</b>
39+
<sub>Part of the <a href="https://github.com/HugoBlox/kit"><strong>HugoBlox</strong></a> ecosystem · <strong>150,000+</strong> sites · Rated <strong>4.9/5</strong> (official survey) · Since <strong>2016</strong></sub>
2340
</p>
2441

25-
https://github.com/user-attachments/assets/a6b676c0-1c10-4734-a55f-68c6f72d1612
42+
---
43+
44+
## Why This Template?
45+
46+
Most developer portfolios look the same — and most "quick" site builders produce slow, bloated React apps you can't maintain. This is a **fast, modern portfolio** that makes your work look as good as it is:
47+
48+
- **Students & grads** applying to internships, MSc programs, or junior roles — stand out with a living portfolio, not a flat resume
49+
- **Software engineers** who want a modern dark-first design that feels premium without writing frontend code
50+
- **STEM professionals** (data, ML, research, engineering) showcasing projects and technical writing
51+
- **Anyone job-hunting** who needs projects, tech stack, experience timeline, and a blog in one credible site
52+
53+
> *"I deployed this on a Friday evening and had three recruiters comment on it by Monday. The dark mode and project grid made my work look 10x more polished than a GitHub profile."*
54+
> — **Kai Nakamura**, Software Engineer
55+
56+
> *"My students use this as their default portfolio template. They fork it, edit Markdown, push to GitHub Pages — done. No React, no Vercel bills, no maintenance headaches."*
57+
> — **Dr. Amira Hassan**, CS Lecturer, TU Munich
2658
2759
<p align="center">
28-
<a href="https://discord.gg/z8wNYzb"><img src="https://img.shields.io/discord/722225264733716590?label=Join%20Discord&style=social" alt="Discord"></a>
29-
<a href="https://github.com/HugoBlox/kit"><img src="https://img.shields.io/github/stars/HugoBlox/kit?label=Star%20HugoBlox&style=social" alt="GitHub Stars"></a>
30-
<a href="https://x.com/MakeOwnable"><img src="https://img.shields.io/twitter/follow/MakeOwnable?label=Follow&style=social" alt="Follow on X"></a>
60+
<a href="https://hugoblox.com/templates/dev-portfolio?utm_source=github&utm_medium=readme&utm_content=cta_mid">
61+
<img src="https://img.shields.io/badge/⚡️%20Deploy%20Your%20Portfolio%20in%2060s-7c3aed?style=for-the-badge" alt="Deploy this template" width="400">
62+
</a>
3163
</p>
3264

3365
---
3466

35-
## Why this template?
67+
## Features
68+
69+
| Feature | Benefit |
70+
| :--- | :--- |
71+
| **Filterable project grid** | Showcase your work with tags, smooth transitions, and featured images. Visitors find what matters fast. |
72+
| **Tech stack display** | Icon grid of your tools and languages — recruiters see your skills at a glance. |
73+
| **Experience & education timeline** | Structured career history with dates, roles, and descriptions. |
74+
| **Blog with featured images** | Write technical posts in Markdown. Code highlighting, math, and diagrams included. |
75+
| **Dark-first design** | Looks premium in dark mode, works perfectly in light. No design skills needed. |
76+
| **SEO & AI-ready** | Optimized for search engines and LLMs — your work gets found and recommended. |
77+
| **AI page generation** | Describe what you need to [Hugo Chat](https://hugo.chat/?utm_source=github&utm_medium=readme&utm_content=features_dev-portfolio) — get structured pages with correct front matter instantly. |
78+
| **Visual editor** | Drag-and-drop blocks in VS Code with [Ownable CMS](https://marketplace.visualstudio.com/items?itemName=ownable.ownable). No coding needed. |
79+
| **Plain Markdown** | Every file is human-readable. No database, no lock-in, take your content anywhere. |
80+
| **Free hosting** | Deploy to GitHub Pages, Netlify, Vercel, or Cloudflare — all free tier. |
3681

37-
Most portfolios look the same — and most “quick” site builders produce slow sites you can’t maintain.
82+
---
3883

39-
- **⚡ Fast by default**: Hugo + Tailwind 4 + Hugo Modules → great Lighthouse scores without JS bloat.
40-
- **🧠 AI-ready content**: Your projects and posts live in clean Markdown/YAML — readable by humans and LLMs.
41-
- **🎯 Job-hunting optimized**: Projects, tech stack, experience timeline, and a blog layout that looks credible.
42-
- **🌙 Dark-first (but light-mode supported)**: Looks premium in dark mode, still works perfectly in light mode.
43-
- **🧩 Block-based**: Reorder/replace sections without rewriting templates.
84+
## 🚀 Get Started
4485

45-
---
86+
### Step 1: Deploy Your Site
4687

47-
## Who it’s for
88+
**Option A: Launch in browser** (fastest — no install needed)
4889

49-
- **Students & grads** applying to internships / MSc / PhD / junior roles
50-
- **STEM professionals** (research, data, ML, bio, engineering) showcasing projects and writing
51-
- **Software engineers** building a portfolio that feels modern in 2026
90+
> [!TIP]
91+
> Deploy a live site in 60 seconds — no software to install:
92+
> [**Deploy Dev Portfolio free**](https://hugoblox.com/templates/dev-portfolio?utm_source=github&utm_medium=readme&utm_content=get_started)
5293
53-
---
94+
**Option B: Use the CLI**
5495

55-
## What you get (Free)
96+
```bash
97+
# Requires Hugo Extended & Node.js
98+
npx hugoblox create site --template dev-portfolio
99+
```
56100

57-
- **Developer hero** with modern gradients + optional typewriter
58-
- **Filterable portfolio** (tags + smooth transitions)
59-
- **Tech stack** grid with icons
60-
- **Experience + education timeline**
61-
- **Blog section** (cards + featured images)
62-
- **Contact section** with social links + copy email
101+
### Step 2: Customize With AI + Visual Editing
63102

64-
---
103+
<table>
104+
<tr>
105+
<td width="50%">
65106

66-
## Get started (recommended)
107+
**✨ Hugo Chat** — AI customization
67108

68-
### Option 1 — Online deployer (fastest)
109+
Tell Hugo Chat what you want in plain English. It generates structured pages with the right front matter, shortcodes, and blocks for this template.
69110

70-
Deploy this template in ~60 seconds:
111+
> *"Add a project page for my CLI tool with tech stack, screenshots, and a GitHub link"*
71112
72-
- [Deploy in browser →](https://hugoblox.com/templates/dev-portfolio/start?utm_source=github&utm_medium=readme)
113+
[**Try Hugo Chat — free**](https://hugo.chat/?utm_source=github&utm_medium=readme&utm_content=step2_dev-portfolio)
73114

74-
### Option 2 — Ownable CMS (visual editor in VS Code)
115+
</td>
116+
<td width="50%">
75117

76-
- [Studio guide →](https://docs.hugoblox.com/guides/studio/?utm_source=github&utm_medium=readme)
77-
- [Studio AI automation plans (Free/Plus/Pro) →](https://hugoblox.com/pricing/?utm_source=github&utm_medium=readme)
118+
**Ownable CMS** — visual editing in VS Code
78119

79-
### Option 3 — HugoBlox CLI (developer workflow)
120+
1. Install [Ownable CMS](https://marketplace.visualstudio.com/items?itemName=ownable.ownable)
121+
2. Open your project in VS Code
122+
3. Click the Ownable icon to start editing visually
80123

81-
Install:
124+
</td>
125+
</tr>
126+
</table>
82127

83-
```bash
84-
npm install -g hugoblox@latest
85-
```
128+
![Ownable CMS in Action](https://raw.githubusercontent.com/HugoBlox/kit/main/.github/media/studio/slide-1.webp)
129+
*Ownable CMS: Drag-and-drop page builder inside VS Code.*
86130

87-
Create a site:
131+
> [!NOTE]
132+
> **New to Hugo?** No problem. You don't need to know Hugo — edit visually or write Markdown. Hugo is the engine under the hood that makes your site fast, secure, and free to host. [Learn more →](https://docs.ownable.dev/?utm_source=github&utm_medium=readme&utm_content=docs_dev-portfolio)
88133
89-
```bash
90-
hugoblox create site --template dev-portfolio
91-
```
134+
---
135+
136+
## 💎 Go Premium
92137

93-
[CLI docs →](https://docs.hugoblox.com/start/cli/?utm_source=github&utm_medium=readme)
138+
Love the free version? **Dev Portfolio Pro** takes it further:
139+
140+
- Premium designs that make an unforgettable first impression
141+
- Advanced project layouts and gallery options
142+
- Enhanced timeline and skill visualizations
143+
- Remove attribution, priority support
144+
145+
| | **Dev Portfolio** (Free) | **Dev Portfolio Pro** |
146+
| :--- | :---: | :---: |
147+
| Design | Modern & clean | **Premium designs** |
148+
| Project layouts | Standard grid | **Advanced gallery** |
149+
| Skill display | Icon grid | **Enhanced visuals** |
150+
| Support | Community | **Priority** |
151+
152+
<p align="center">
153+
<a href="https://hugoblox.com/pricing?utm_source=github&utm_medium=readme&utm_content=premium_dev-portfolio"><b>Compare plans</b></a>
154+
&nbsp;&nbsp;|&nbsp;&nbsp;
155+
<a href="https://hugoblox.com/templates/dev-portfolio-pro?utm_source=github&utm_medium=readme&utm_content=premium_deploy_dev-portfolio"><b>Deploy Pro version</b></a>
156+
</p>
157+
158+
---
159+
160+
## 🏆 Why HugoBlox?
161+
162+
> *Why not just use WordPress, Webflow, or an AI builder like Lovable?*
163+
164+
| | **AI builders** (Lovable, v0) | **CMS platforms** (WordPress, Webflow) | **HugoBlox** |
165+
| :--- | :---: | :---: | :---: |
166+
| AI generates your pages | Yes | No | **Yes** |
167+
| You own the output as readable files | No — React code | No — database | **Yes — Markdown** |
168+
| Free to host forever | No | No | **Yes** |
169+
| Human-editable without the tool | Barely | No | **Yes — it's Markdown** |
170+
| Open source | No | No | **Yes — MIT licensed** |
171+
172+
> [!IMPORTANT]
173+
> Your content is plain Markdown files. No lock-in, no database, no vendor dependency. If you ever want to leave, take your files and go.
94174
95175
---
96176

97-
## Customize in 10 minutes
177+
## FAQ
98178

99-
- **Your profile**: `data/authors/me.yaml`
100-
- **Homepage sections**: `content/_index.md`
101-
- **Projects**: `content/projects/<project>/index.md`
102-
- **Blog posts**: `content/blog/<post>/index.md`
103-
- **Theme + identity**: `config/_default/params.yaml`
179+
<details>
180+
<summary><b>Do I need to know Hugo?</b></summary>
181+
No. Edit visually with Ownable CMS or write Markdown. Hugo is the build engine — you don't need to touch it.
182+
</details>
183+
184+
<details>
185+
<summary><b>Can I use this for non-dev portfolios?</b></summary>
186+
Yes. The project grid, blog, and timeline work for any profession. But the dark-first design and tech stack section are built with developers in mind.
187+
</details>
188+
189+
<details>
190+
<summary><b>Can I host for free?</b></summary>
191+
Yes. GitHub Pages, Netlify, Vercel, and Cloudflare Pages all have free tiers for static sites.
192+
</details>
193+
194+
<details>
195+
<summary><b>Can I migrate my content later?</b></summary>
196+
Yes. Your site is just Markdown files in a folder. Copy them anywhere.
197+
</details>
198+
199+
<details>
200+
<summary><b>What's Hugo Chat?</b></summary>
201+
An AI assistant trained on Hugo and HugoBlox docs. Describe what you want and it generates the right pages with correct front matter. <a href="https://hugo.chat/?utm_source=github&utm_medium=readme&utm_content=faq_dev-portfolio">Free to try.</a>
202+
</details>
203+
204+
<details>
205+
<summary><b>Can I cancel Pro anytime?</b></summary>
206+
Yes. No questions asked.
207+
</details>
104208

105209
---
106210

107-
## Want the Pro version? 💎
211+
<h2 align="center">🚀 Ready to launch?</h2>
108212

109-
If you want a version that feels meaningfully more premium (and helps fund open source + research):
213+
<p align="center">
214+
Deploy in 60 seconds. Customize with AI. Own it as Markdown forever.
215+
</p>
110216

111-
- [Premium template →](https://hugoblox.com/templates/dev-portfolio-pro/start?utm_source=github&utm_medium=readme)
112-
- [HugoBlox Pro / Studio →](https://hugoblox.com/pricing?utm_source=github&utm_medium=readme)
217+
<p align="center">
218+
<a href="https://hugoblox.com/templates/dev-portfolio?utm_source=github&utm_medium=readme&utm_content=cta_final"><b>Deploy Dev Portfolio — free</b></a>
219+
&nbsp;&nbsp;|&nbsp;&nbsp;
220+
<a href="https://hugo.chat/?utm_source=github&utm_medium=readme&utm_content=cta_final_dev-portfolio"><b>Customize with AI</b></a>
221+
</p>
113222

114223
---
115224

116-
## Community & support
225+
## Community & Support
226+
227+
- 💬 [**Discord**](https://discord.gg/z8wNYzb) — ask questions, share your site
228+
- 📚 [**Docs**](https://docs.ownable.dev/?utm_source=github&utm_medium=readme&utm_content=community_dev-portfolio)
229+
- ⭐ [**Star HugoBlox**](https://github.com/HugoBlox/kit) — help others find it
230+
- 🐦 [**Follow on X**](https://x.com/MakeOwnable)
231+
232+
### Sponsors
117233

118-
- **Docs**: [docs.hugoblox.com →](https://docs.hugoblox.com/?utm_source=github&utm_medium=readme)
119-
- **Discord**: [Join Discord →](https://discord.gg/z8wNYzb)
120-
- **Issues**: [Open an issue →](https://github.com/HugoBlox/kit/issues)
234+
[**❤️ Sponsor on GitHub**](https://github.com/sponsors/gcushen) | [**🏢 Become a Partner**](https://github.com/sponsors/gcushen)
121235

122236
---
123237

124-
MIT © 2016–Present [George Cushen](https://neuralgeo.com/?utm_source=github&utm_medium=readme)
238+
MIT © 2016-present [**Lore Labs**](https://lore.tech/?utm_source=github&utm_medium=readme)

0 commit comments

Comments
 (0)