Eleanor Konik eleanorkonik

Build a Custom Dashboard with Claude Code

A single-file skill for building a personal dashboard from scratch using Claude Code as your primary developer. This bundles months of hard-won lessons from building and maintaining two custom dashboards into one reference.

Everything you need is probably here, but this is not the actual system I used, it's just some helpers for another AI agent. The first thing you should do once you're rolling is move the reference sections (Database, Design System, Frontend Patterns, etc.) into their own files so your AI assistant can load only what's relevant per task. But start with this single file so you can see the whole picture, and tweak it according to your prefernces.

Stack

The Konik Method: LLM Step-by-Step Process for Obsidian Vault

Overview

This process transforms highlighted quotes from Readwise imports into claim-based headers that can later be spun out into atomic notes/zettelkasten-style index cards. The goal is to convert passive highlights into actionable, searchable claims.

Files contain highlights with ID numbers (format: ### id123456789 or loc 12345)
Original highlights may have basic annotations but need conversion to claim statements

Step-by-Step Process

File name

{{title|replace("#","")|replace("?","")|replace(".","")|replace(""","")|replace(""","")|replace("'","")|replace("'","")|truncate(127)}} by {{author|truncate(120)}} - Notes

I do this so that weird characters or overly-long file names don't break dropbox or git, tho Readwise now natively sanitizes things.

	```dataview
	TABLE file.inlinks AS Inlinks, file.outlinks AS Outlinks, file.tags AS Tags
	FROM "10 Pending"
	WHERE length(file.inlinks) > 0 OR length(file.outlinks) > 1 Or length(file.tags) > 2
	SORT file.size ASC
	```

	```dataviewjs
	const count = 2;
	let d = {};

	```dataviewjs
	//get all md files in vault
	const files = app.vault.getMarkdownFiles()

	//create an array with the filename and lines that include the desired tag
	let arr = files.map(async(file) => {
	const content = await app.vault.cachedRead(file)
	//turn all the content into an array
	let lines = await content.split("\n").filter(line => line.includes("- [?]"))
	return ["[["+file.name.split(".")[0]+"]]", lines]

	module.exports = async (params) => {
	console.log("Starting...")
	console.log(params);
	const currentFile = params.app.workspace.getActiveFile();
	if (!currentFile) {
	new Notice("No active file.");
	return;
	}
	console.log("Found active file: ", currentFile.basename);


	### {% if highlight_location != "View Highlight" and highlight_location != "View Tweet" %}{{highlight_location}}{% else %}id{{highlight_id}}{% endif %}

	> {{ highlight_text }}
	{% if highlight_note %}
	- [n] {{ highlight_note }}
	{% endif %}
	{% if highlight_location and highlight_location_url %} * [{{highlight_location}}]({{highlight_location_url}}){% elif highlight_location %} ({{highlight_location}}){% endif %}