Hugo Leetcode Dashboard is a Python-based plugin that generates a personal LeetCode progress dashboard as markdown files and deploys it to a Hugo-powered site.
What is Hugo Leetcode Dashboard?
Hugo Leetcode Dashboard takes your LeetCode-cn account credentials and your Hugo content directory as inputs, runs a Python script, and outputs a set of markdown files that form an answer dashboard. The dashboard includes a Chinese entry page (leetcode.md), an English entry page (leetcode_en.md), and a problemset/ folder with one subfolder per solved problem, each containing your solution source, a solution writeup, and the problem description in both languages.
The plugin is built for the Hugo static site generator and is released under the MIT License. It uses the requests and aiohttp Python packages for network calls.
Key Features
- Progress overview — Shows completed questions and overall progress at a glance.
- Detailed answer board — Each entry displays the question number, title, favorite tag, solution language, acceptance rate, difficulty, and problem type.
- Problem description display — Includes the full LeetCode problem statement in each problem folder, in both Chinese and English (readme.md and readme_en.md).
- Personal solution repository — Stores your own solution source files (e.g., .go) alongside a markdown writeup for each problem.
- Bilingual entries — Generates two entry markdown files, one Chinese and one English, for Hugo site integration.
- One-command deployment — After configuration, running
python3 run.pygenerates the files and copies them to your Hugo content directory.
Who is it for?
- Competitive programmers who track LeetCode progress and want a published dashboard on a personal blog.
- Hugo site owners who want to automatically convert their LeetCode solutions into structured blog content.
- Job seekers who want to showcase problem-solving activity and code samples in a portfolio.
What can you do with it?
- Portfolio showcasing: Convert your LeetCode-cn solved problems into a bilingual dashboard with per-problem code and explanations, ready to publish on a Hugo blog.
- Progress tracking: Keep a public record of your completion rate, difficulty distribution, and solution languages.
- Knowledge base: Maintain a searchable archive of problem descriptions and your own solutions by language.
How does Hugo Leetcode Dashboard work?
First you clone the repository and install the Python dependencies (requests and aiohttp) with pip. Then you edit config.json to set your LeetCode-cn username, password, and the output directory (typically your Hugo content folder). After creating a shortcode for raw HTML in your Hugo site to support the generated HTML, you run echo "2" | python3 run.py and copy the logo image to your static folder.
Pros and cons
- Free and open source — MIT licensed, so you can modify and reuse it.
- Stores credentials in plaintext — The config.json stores your LeetCode-cn password as readable text, so handle it with care (e.g., keep the file private).
FAQ
Is Hugo Leetcode Dashboard free?
Yes, it is released under the MIT License, so it is free to use, modify, and distribute.
Does it require an account from LeetCode-cn only?
The README config example uses a leetcode-cn@leetcode username and a plain password, and it refers to "LeetCode-cn 账号". The plugin does not document support for LeetCode.com accounts.
What files does it generate?
It generates two entry markdown files (leetcode.md and leetcode_en.md) and a problemset/ directory with a subfolder per problem, containing your solution source, a solution writeup, and the problem description in both Chinese and English.
How do I integrate it with my Hugo site?
The output directory from config.json should be your Hugo content path. You also need to add a layouts/shortcodes/rawhtml.html file to your site to allow raw HTML from the generated markdown. Then run the deployment command and copy the logo to static/images.
