npm - vibestats - Versions diffs - 1.4.6 → 1.4.7 - Mend

vibestats 1.4.6 → 1.4.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (148) hide show

package/dist/web/guides.html CHANGED Viewed

	@@ -1 +1 @@
1	- <!DOCTYPE html><!--OTOSYSO_lYg8uryMGgC0P--><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="/_next/static/css/335de1248158d380.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-175b2f5685d7557b.js"/><script src="/_next/static/chunks/c476d598-9099ed8b975ae1d6.js" async=""></script><script src="/_next/static/chunks/498-74a3a367cb8442f0.js" async=""></script><script src="/_next/static/chunks/main-app-6619364ab1f13fb7.js" async=""></script><script src="/_next/static/chunks/app/layout-6ebd9b17af55ec02.js" async=""></script><script src="/_next/static/chunks/816-8960921093d57453.js" async=""></script><script src="/_next/static/chunks/app/guides/page-5d0587c1d5910e68.js" async=""></script><link rel="preload" href="https://analytics.wolfai.dev/wolf-analytics.min.js" as="script"/><title>Guides \| vibestats</title><meta name="description" content="Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."/><meta name="application-name" content="vibestats"/><meta name="keywords" content="vibestats,Claude Code stats,Codex CLI stats,AI coding stats,AI coding analytics,Claude Code wrapped,Codex usage tracker,developer analytics,Claude Code usage guide,Codex CLI usage guide,AI coding analytics guide"/><link rel="canonical" href="https://vibestats.wolfai.dev/guides"/><meta property="og:title" content="Guides \| vibestats"/><meta property="og:description" content="Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."/><meta property="og:url" content="https://vibestats.wolfai.dev/guides"/><meta property="og:site_name" content="vibestats"/><meta property="og:locale" content="en_US"/><meta property="og:type" content="website"/><meta name="twitter:card" content="summary"/><meta name="twitter:title" content="Guides \| vibestats"/><meta name="twitter:description" content="Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."/><script>(self.__next_s=self.__next_s\|\|[]).push([0,{"children":"window.WOLF_ANALYTICS_CONFIG = {\"apiUrl\":\"https://analapi.wolfai.dev\",\"projectApiKey\":\"wa_rMSm5mgj44W_9LzMsKCwwAipAtxPynp1tn4PbxN_Oa8\",\"mode\":\"intl\",\"sourceApp\":\"vibestats\"};","id":"wolf-analytics-config"}])</script><script>(self.__next_s=self.__next_s\|\|[]).push(["https://analytics.wolfai.dev/wolf-analytics.min.js",{"id":"wolf-analytics-script"}])</script><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body class="antialiased min-h-screen bg-background text-foreground"><div hidden=""><!--$--><!--/$--></div><main class="min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(253,186,116,0.22),_transparent_35%),linear-gradient(180deg,#fff9f1_0%,#fff1de_100%)] px-4 py-8 text-slate-900 md:px-8 md:py-12"><script type="application/ld+json">{"@context":"https://schema.org","@type":"CollectionPage","name":"AI coding analytics guides","description":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.","url":"https://vibestats.wolfai.dev/guides","mainEntity":{"@type":"ItemList","itemListElement":[{"@type":"ListItem","position":1,"name":"How to track Claude Code usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-claude-code-usage"},{"@type":"ListItem","position":2,"name":"How to track Codex CLI usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-codex-cli-usage"},{"@type":"ListItem","position":3,"name":"How to create an AI coding wrapped","url":"https://vibestats.wolfai.dev/guides/how-to-create-ai-coding-wrapped"},{"@type":"ListItem","position":4,"name":"How to build an AI activity heatmap","url":"https://vibestats.wolfai.dev/guides/how-to-build-ai-activity-heatmap"},{"@type":"ListItem","position":5,"name":"How to measure AI token costs","url":"https://vibestats.wolfai.dev/guides/how-to-measure-ai-token-costs"},{"@type":"ListItem","position":6,"name":"How to share AI coding stats","url":"https://vibestats.wolfai.dev/guides/how-to-share-ai-coding-stats"},{"@type":"ListItem","position":7,"name":"How to read Claude diagnostics","url":"https://vibestats.wolfai.dev/guides/how-to-read-claude-diagnostics"},{"@type":"ListItem","position":8,"name":"How to compare model usage","url":"https://vibestats.wolfai.dev/guides/how-to-compare-model-usage"}]}}</script><div class="mx-auto max-w-7xl"><header class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] overflow-hidden"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.28em] text-slate-500">Guide library</p><h1 class="mt-4 max-w-4xl font-[family-name:var(--font-display)] text-5xl leading-none text-slate-950 md:text-7xl">AI coding analytics guides</h1><p class="mt-5 max-w-3xl text-base leading-7 text-slate-600 md:text-lg">Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.</p><div class="mt-6 grid gap-3 text-sm text-slate-600 md:grid-cols-3"><div class="rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4"><strong class="block text-slate-950">8<!-- --> pages</strong><span class="mt-2 block">Built around real vibestats workflows instead of generic SEO filler.</span></div><div class="rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4"><strong class="block text-slate-950">Internal links</strong><span class="mt-2 block">Each page connects to related features, guides, and use cases.</span></div><div class="rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4"><strong class="block text-slate-950">Search intent</strong><span class="mt-2 block">Every page is focused on one product or reporting question.</span></div></div></header><section class="mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-3"><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-track-claude-code-usage"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to track Claude Code usage</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to tracking Claude Code usage locally with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Start with daily usage, then refine</li><li>Model and session views answer different follow-up questions</li><li>Diagnostics help when the totals look confusing</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-track-codex-cli-usage"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to track Codex CLI usage</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to tracking OpenAI Codex CLI usage locally with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Codex works best as its own first view</li><li>Total and session views answer different questions</li><li>Combined reporting is a second step, not the first</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-create-ai-coding-wrapped"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to create an AI coding wrapped</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to generating a wrapped-style AI coding recap with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Wrapped is the best narrative recap view</li><li>Quiet mode is useful for share-first workflows</li><li>Heatmaps complement wrapped, not replace it</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-build-ai-activity-heatmap"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to build an AI activity heatmap</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to generating a GitHub-style AI coding activity heatmap with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Heatmaps are best for rhythm and consistency</li><li>Metric choice changes the story</li><li>Hosted pages are easier to reuse in updates</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-measure-ai-token-costs"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to measure AI token costs</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to measuring token volume and estimated cost in vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Totals are the cleanest starting point</li><li>Tokens and cost are related but not identical</li><li>Model views help explain cost shifts</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-share-ai-coding-stats"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to share AI coding stats</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to turning local vibestats output into shareable aggregate pages.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Share the surface that fits the audience</li><li>Aggregate pages are better than screenshots</li><li>Stored share pages are better than legacy payload URLs</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-read-claude-diagnostics"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to read Claude diagnostics</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to using vibestats Claude diagnostics commands for local state and limit clues.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Diagnostics complement usage reports</li><li>Best used when something looks off</li><li>Local file visibility beats guesswork</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-compare-model-usage"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to compare model usage</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to comparing AI model usage in vibestats across reporting windows and source scopes.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Stable windows matter more than perfect totals</li><li>Model share is easier to read when grouped directly</li><li>Source context helps interpret model shifts</li></ul></a></section></div></main><!--$--><!--/$--><script src="/_next/static/chunks/webpack-175b2f5685d7557b.js" id="_R_" async=""></script><script>(self.__next_f=self.__next_f\|\|[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[7437,[\"177\",\"static/chunks/app/layout-6ebd9b17af55ec02.js\"],\"\"]\n3:I[5965,[],\"\"]\n4:I[3609,[],\"\"]\n9:I[2207,[],\"\"]\n:HL[\"/_next/static/css/335de1248158d380.css\",\"style\"]\n5:T615,"])</script><script>self.__next_f.push([1,"{\"@context\":\"https://schema.org\",\"@type\":\"CollectionPage\",\"name\":\"AI coding analytics guides\",\"description\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\",\"url\":\"https://vibestats.wolfai.dev/guides\",\"mainEntity\":{\"@type\":\"ItemList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"How to track Claude Code usage\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-track-claude-code-usage\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to track Codex CLI usage\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-track-codex-cli-usage\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to create an AI coding wrapped\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-create-ai-coding-wrapped\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"How to build an AI activity heatmap\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-build-ai-activity-heatmap\"},{\"@type\":\"ListItem\",\"position\":5,\"name\":\"How to measure AI token costs\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-measure-ai-token-costs\"},{\"@type\":\"ListItem\",\"position\":6,\"name\":\"How to share AI coding stats\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-share-ai-coding-stats\"},{\"@type\":\"ListItem\",\"position\":7,\"name\":\"How to read Claude diagnostics\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-read-claude-diagnostics\"},{\"@type\":\"ListItem\",\"position\":8,\"name\":\"How to compare model usage\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-compare-model-usage\"}]}}"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"OTOSYSO_lYg8uryMGgC0P\",\"p\":\"\",\"c\":[\"\",\"guides\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"guides\",{\"children\":[\"__PAGE__\",{}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/335de1248158d380.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"$L2\",null,{\"id\":\"wolf-analytics-config\",\"strategy\":\"beforeInteractive\",\"children\":\"window.WOLF_ANALYTICS_CONFIG = {\\\"apiUrl\\\":\\\"https://analapi.wolfai.dev\\\",\\\"projectApiKey\\\":\\\"wa_rMSm5mgj44W_9LzMsKCwwAipAtxPynp1tn4PbxN_Oa8\\\",\\\"mode\\\":\\\"intl\\\",\\\"sourceApp\\\":\\\"vibestats\\\"};\"}],[\"$\",\"$L2\",null,{\"id\":\"wolf-analytics-script\",\"src\":\"https://analytics.wolfai.dev/wolf-analytics.min.js\",\"strategy\":\"beforeInteractive\"}]]}],[\"$\",\"body\",null,{\"className\":\"antialiased min-h-screen bg-background text-foreground\",\"children\":[\"$\",\"$L3\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L4\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]]}]]}],{\"children\":[\"guides\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L3\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L4\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"main\",null,{\"className\":\"min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(253,186,116,0.22),_transparent_35%),linear-gradient(180deg,#fff9f1_0%,#fff1de_100%)] px-4 py-8 text-slate-900 md:px-8 md:py-12\",\"children\":[[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$5\"}}],\"$L6\"]}],null,\"$L7\"]}],{},null,false]},null,false]},null,false],\"$L8\",false]],\"m\":\"$undefined\",\"G\":[\"$9\",[]],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"a:I[4816,[\"816\",\"static/chunks/816-8960921093d57453.js\",\"6\",\"static/chunks/app/guides/page-5d0587c1d5910e68.js\"],\"\"]\n12:I[496,[],\"OutletBoundary\"]\n14:I[3737,[],\"AsyncMetadataOutlet\"]\n16:I[496,[],\"ViewportBoundary\"]\n18:I[496,[],\"MetadataBoundary\"]\n19:\"$Sreact.suspense\"\n"])</script><script>self.__next_f.push([1,"6:[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-7xl\",\"children\":[[\"$\",\"header\",null,{\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] overflow-hidden\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.28em] text-slate-500\",\"children\":\"Guide library\"}],[\"$\",\"h1\",null,{\"className\":\"mt-4 max-w-4xl font-[family-name:var(--font-display)] text-5xl leading-none text-slate-950 md:text-7xl\",\"children\":\"AI coding analytics guides\"}],[\"$\",\"p\",null,{\"className\":\"mt-5 max-w-3xl text-base leading-7 text-slate-600 md:text-lg\",\"children\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}],[\"$\",\"div\",null,{\"className\":\"mt-6 grid gap-3 text-sm text-slate-600 md:grid-cols-3\",\"children\":[[\"$\",\"div\",null,{\"className\":\"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4\",\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-slate-950\",\"children\":[8,\" pages\"]}],[\"$\",\"span\",null,{\"className\":\"mt-2 block\",\"children\":\"Built around real vibestats workflows instead of generic SEO filler.\"}]]}],[\"$\",\"div\",null,{\"className\":\"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4\",\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-slate-950\",\"children\":\"Internal links\"}],[\"$\",\"span\",null,{\"className\":\"mt-2 block\",\"children\":\"Each page connects to related features, guides, and use cases.\"}]]}],[\"$\",\"div\",null,{\"className\":\"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4\",\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-slate-950\",\"children\":\"Search intent\"}],[\"$\",\"span\",null,{\"className\":\"mt-2 block\",\"children\":\"Every page is focused on one product or reporting question.\"}]]}]]}]]}],[\"$\",\"section\",null,{\"className\":\"mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-3\",\"children\":[[\"$\",\"$La\",\"how-to-track-claude-code-usage\",{\"href\":\"/guides/how-to-track-claude-code-usage\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to track Claude Code usage\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to tracking Claude Code usage locally with vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Start with daily usage, then refine\",{\"children\":\"Start with daily usage, then refine\"}],[\"$\",\"li\",\"Model and session views answer different follow-up questions\",{\"children\":\"Model and session views answer different follow-up questions\"}],[\"$\",\"li\",\"Diagnostics help when the totals look confusing\",{\"children\":\"Diagnostics help when the totals look confusing\"}]]}]]}],[\"$\",\"$La\",\"how-to-track-codex-cli-usage\",{\"href\":\"/guides/how-to-track-codex-cli-usage\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to track Codex CLI usage\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to tracking OpenAI Codex CLI usage locally with vibestats.\"}],\"$Lb\"]}],\"$Lc\",\"$Ld\",\"$Le\",\"$Lf\",\"$L10\",\"$L11\"]}]]}]\n"])</script><script>self.__next_f.push([1,"7:[\"$\",\"$L12\",null,{\"children\":[\"$L13\",[\"$\",\"$L14\",null,{\"promise\":\"$@15\"}]]}]\n8:[\"$\",\"$1\",\"h\",{\"children\":[null,[[\"$\",\"$L16\",null,{\"children\":\"$L17\"}],null],[\"$\",\"$L18\",null,{\"children\":[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$19\",null,{\"fallback\":null,\"children\":\"$L1a\"}]}]}]]}]\n"])</script><script>self.__next_f.push([1,"b:[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Codex works best as its own first view\",{\"children\":\"Codex works best as its own first view\"}],[\"$\",\"li\",\"Total and session views answer different questions\",{\"children\":\"Total and session views answer different questions\"}],[\"$\",\"li\",\"Combined reporting is a second step, not the first\",{\"children\":\"Combined reporting is a second step, not the first\"}]]}]\n"])</script><script>self.__next_f.push([1,"c:[\"$\",\"$La\",\"how-to-create-ai-coding-wrapped\",{\"href\":\"/guides/how-to-create-ai-coding-wrapped\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to create an AI coding wrapped\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to generating a wrapped-style AI coding recap with vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Wrapped is the best narrative recap view\",{\"children\":\"Wrapped is the best narrative recap view\"}],[\"$\",\"li\",\"Quiet mode is useful for share-first workflows\",{\"children\":\"Quiet mode is useful for share-first workflows\"}],[\"$\",\"li\",\"Heatmaps complement wrapped, not replace it\",{\"children\":\"Heatmaps complement wrapped, not replace it\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"d:[\"$\",\"$La\",\"how-to-build-ai-activity-heatmap\",{\"href\":\"/guides/how-to-build-ai-activity-heatmap\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to build an AI activity heatmap\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to generating a GitHub-style AI coding activity heatmap with vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Heatmaps are best for rhythm and consistency\",{\"children\":\"Heatmaps are best for rhythm and consistency\"}],[\"$\",\"li\",\"Metric choice changes the story\",{\"children\":\"Metric choice changes the story\"}],[\"$\",\"li\",\"Hosted pages are easier to reuse in updates\",{\"children\":\"Hosted pages are easier to reuse in updates\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"e:[\"$\",\"$La\",\"how-to-measure-ai-token-costs\",{\"href\":\"/guides/how-to-measure-ai-token-costs\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to measure AI token costs\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to measuring token volume and estimated cost in vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Totals are the cleanest starting point\",{\"children\":\"Totals are the cleanest starting point\"}],[\"$\",\"li\",\"Tokens and cost are related but not identical\",{\"children\":\"Tokens and cost are related but not identical\"}],[\"$\",\"li\",\"Model views help explain cost shifts\",{\"children\":\"Model views help explain cost shifts\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"f:[\"$\",\"$La\",\"how-to-share-ai-coding-stats\",{\"href\":\"/guides/how-to-share-ai-coding-stats\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to share AI coding stats\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to turning local vibestats output into shareable aggregate pages.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Share the surface that fits the audience\",{\"children\":\"Share the surface that fits the audience\"}],[\"$\",\"li\",\"Aggregate pages are better than screenshots\",{\"children\":\"Aggregate pages are better than screenshots\"}],[\"$\",\"li\",\"Stored share pages are better than legacy payload URLs\",{\"children\":\"Stored share pages are better than legacy payload URLs\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"10:[\"$\",\"$La\",\"how-to-read-claude-diagnostics\",{\"href\":\"/guides/how-to-read-claude-diagnostics\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to read Claude diagnostics\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to using vibestats Claude diagnostics commands for local state and limit clues.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Diagnostics complement usage reports\",{\"children\":\"Diagnostics complement usage reports\"}],[\"$\",\"li\",\"Best used when something looks off\",{\"children\":\"Best used when something looks off\"}],[\"$\",\"li\",\"Local file visibility beats guesswork\",{\"children\":\"Local file visibility beats guesswork\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"11:[\"$\",\"$La\",\"how-to-compare-model-usage\",{\"href\":\"/guides/how-to-compare-model-usage\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to compare model usage\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to comparing AI model usage in vibestats across reporting windows and source scopes.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Stable windows matter more than perfect totals\",{\"children\":\"Stable windows matter more than perfect totals\"}],[\"$\",\"li\",\"Model share is easier to read when grouped directly\",{\"children\":\"Model share is easier to read when grouped directly\"}],[\"$\",\"li\",\"Source context helps interpret model shifts\",{\"children\":\"Source context helps interpret model shifts\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"17:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n13:null\n"])</script><script>self.__next_f.push([1,"15:{\"metadata\":[[\"$\",\"title\",\"0\",{\"children\":\"Guides \| vibestats\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}],[\"$\",\"meta\",\"2\",{\"name\":\"application-name\",\"content\":\"vibestats\"}],[\"$\",\"meta\",\"3\",{\"name\":\"keywords\",\"content\":\"vibestats,Claude Code stats,Codex CLI stats,AI coding stats,AI coding analytics,Claude Code wrapped,Codex usage tracker,developer analytics,Claude Code usage guide,Codex CLI usage guide,AI coding analytics guide\"}],[\"$\",\"link\",\"4\",{\"rel\":\"canonical\",\"href\":\"https://vibestats.wolfai.dev/guides\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:title\",\"content\":\"Guides \| vibestats\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:description\",\"content\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:url\",\"content\":\"https://vibestats.wolfai.dev/guides\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:site_name\",\"content\":\"vibestats\"}],[\"$\",\"meta\",\"9\",{\"property\":\"og:locale\",\"content\":\"en_US\"}],[\"$\",\"meta\",\"10\",{\"property\":\"og:type\",\"content\":\"website\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:card\",\"content\":\"summary\"}],[\"$\",\"meta\",\"12\",{\"name\":\"twitter:title\",\"content\":\"Guides \| vibestats\"}],[\"$\",\"meta\",\"13\",{\"name\":\"twitter:description\",\"content\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}]],\"error\":null,\"digest\":\"$undefined\"}\n"])</script><script>self.__next_f.push([1,"1a:\"$15:metadata\"\n"])</script></body></html>
1	+ <!DOCTYPE html><!--O1feF7gPLeHeL0mJlyXjP--><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="/_next/static/css/335de1248158d380.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-175b2f5685d7557b.js"/><script src="/_next/static/chunks/c476d598-9099ed8b975ae1d6.js" async=""></script><script src="/_next/static/chunks/498-74a3a367cb8442f0.js" async=""></script><script src="/_next/static/chunks/main-app-f5021d739a517f33.js" async=""></script><script src="/_next/static/chunks/816-8960921093d57453.js" async=""></script><script src="/_next/static/chunks/app/guides/page-08fe89950f57d6cd.js" async=""></script><title>Guides \| vibestats</title><meta name="description" content="Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."/><meta name="application-name" content="vibestats"/><meta name="keywords" content="vibestats,Claude Code stats,Codex CLI stats,AI coding stats,AI coding analytics,Claude Code wrapped,Codex usage tracker,developer analytics,Claude Code usage guide,Codex CLI usage guide,AI coding analytics guide"/><link rel="canonical" href="https://vibestats.wolfai.dev/guides"/><meta property="og:title" content="Guides \| vibestats"/><meta property="og:description" content="Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."/><meta property="og:url" content="https://vibestats.wolfai.dev/guides"/><meta property="og:site_name" content="vibestats"/><meta property="og:locale" content="en_US"/><meta property="og:type" content="website"/><meta name="twitter:card" content="summary"/><meta name="twitter:title" content="Guides \| vibestats"/><meta name="twitter:description" content="Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."/><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body class="antialiased min-h-screen bg-background text-foreground"><div hidden=""><!--$--><!--/$--></div><main class="min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(253,186,116,0.22),_transparent_35%),linear-gradient(180deg,#fff9f1_0%,#fff1de_100%)] px-4 py-8 text-slate-900 md:px-8 md:py-12"><script type="application/ld+json">{"@context":"https://schema.org","@type":"CollectionPage","name":"AI coding analytics guides","description":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.","url":"https://vibestats.wolfai.dev/guides","mainEntity":{"@type":"ItemList","itemListElement":[{"@type":"ListItem","position":1,"name":"How to track Claude Code usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-claude-code-usage"},{"@type":"ListItem","position":2,"name":"How to track Codex CLI usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-codex-cli-usage"},{"@type":"ListItem","position":3,"name":"How to create an AI coding wrapped","url":"https://vibestats.wolfai.dev/guides/how-to-create-ai-coding-wrapped"},{"@type":"ListItem","position":4,"name":"How to build an AI activity heatmap","url":"https://vibestats.wolfai.dev/guides/how-to-build-ai-activity-heatmap"},{"@type":"ListItem","position":5,"name":"How to measure AI token costs","url":"https://vibestats.wolfai.dev/guides/how-to-measure-ai-token-costs"},{"@type":"ListItem","position":6,"name":"How to share AI coding stats","url":"https://vibestats.wolfai.dev/guides/how-to-share-ai-coding-stats"},{"@type":"ListItem","position":7,"name":"How to read Claude diagnostics","url":"https://vibestats.wolfai.dev/guides/how-to-read-claude-diagnostics"},{"@type":"ListItem","position":8,"name":"How to compare model usage","url":"https://vibestats.wolfai.dev/guides/how-to-compare-model-usage"}]}}</script><div class="mx-auto max-w-7xl"><header class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] overflow-hidden"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.28em] text-slate-500">Guide library</p><h1 class="mt-4 max-w-4xl font-[family-name:var(--font-display)] text-5xl leading-none text-slate-950 md:text-7xl">AI coding analytics guides</h1><p class="mt-5 max-w-3xl text-base leading-7 text-slate-600 md:text-lg">Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.</p><div class="mt-6 grid gap-3 text-sm text-slate-600 md:grid-cols-3"><div class="rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4"><strong class="block text-slate-950">8<!-- --> pages</strong><span class="mt-2 block">Built around real vibestats workflows instead of generic SEO filler.</span></div><div class="rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4"><strong class="block text-slate-950">Internal links</strong><span class="mt-2 block">Each page connects to related features, guides, and use cases.</span></div><div class="rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4"><strong class="block text-slate-950">Search intent</strong><span class="mt-2 block">Every page is focused on one product or reporting question.</span></div></div></header><section class="mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-3"><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-track-claude-code-usage"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to track Claude Code usage</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to tracking Claude Code usage locally with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Start with daily usage, then refine</li><li>Model and session views answer different follow-up questions</li><li>Diagnostics help when the totals look confusing</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-track-codex-cli-usage"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to track Codex CLI usage</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to tracking OpenAI Codex CLI usage locally with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Codex works best as its own first view</li><li>Total and session views answer different questions</li><li>Combined reporting is a second step, not the first</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-create-ai-coding-wrapped"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to create an AI coding wrapped</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to generating a wrapped-style AI coding recap with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Wrapped is the best narrative recap view</li><li>Quiet mode is useful for share-first workflows</li><li>Heatmaps complement wrapped, not replace it</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-build-ai-activity-heatmap"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to build an AI activity heatmap</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to generating a GitHub-style AI coding activity heatmap with vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Heatmaps are best for rhythm and consistency</li><li>Metric choice changes the story</li><li>Hosted pages are easier to reuse in updates</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-measure-ai-token-costs"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to measure AI token costs</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to measuring token volume and estimated cost in vibestats.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Totals are the cleanest starting point</li><li>Tokens and cost are related but not identical</li><li>Model views help explain cost shifts</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-share-ai-coding-stats"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to share AI coding stats</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to turning local vibestats output into shareable aggregate pages.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Share the surface that fits the audience</li><li>Aggregate pages are better than screenshots</li><li>Stored share pages are better than legacy payload URLs</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-read-claude-diagnostics"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to read Claude diagnostics</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to using vibestats Claude diagnostics commands for local state and limit clues.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Diagnostics complement usage reports</li><li>Best used when something looks off</li><li>Local file visibility beats guesswork</li></ul></a><a class="rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300" href="/guides/how-to-compare-model-usage"><p class="text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500">Guide</p><h2 class="mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950">How to compare model usage</h2><p class="mt-4 text-sm leading-7 text-slate-600">A practical guide to comparing AI model usage in vibestats across reporting windows and source scopes.</p><ul class="mt-5 space-y-2 text-sm leading-6 text-slate-600"><li>Stable windows matter more than perfect totals</li><li>Model share is easier to read when grouped directly</li><li>Source context helps interpret model shifts</li></ul></a></section></div></main><!--$--><!--/$--><script src="/_next/static/chunks/webpack-175b2f5685d7557b.js" id="_R_" async=""></script><script>(self.__next_f=self.__next_f\|\|[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[5965,[],\"\"]\n3:I[3609,[],\"\"]\n8:I[2207,[],\"\"]\n:HL[\"/_next/static/css/335de1248158d380.css\",\"style\"]\n4:T615,"])</script><script>self.__next_f.push([1,"{\"@context\":\"https://schema.org\",\"@type\":\"CollectionPage\",\"name\":\"AI coding analytics guides\",\"description\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\",\"url\":\"https://vibestats.wolfai.dev/guides\",\"mainEntity\":{\"@type\":\"ItemList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"How to track Claude Code usage\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-track-claude-code-usage\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to track Codex CLI usage\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-track-codex-cli-usage\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to create an AI coding wrapped\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-create-ai-coding-wrapped\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"How to build an AI activity heatmap\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-build-ai-activity-heatmap\"},{\"@type\":\"ListItem\",\"position\":5,\"name\":\"How to measure AI token costs\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-measure-ai-token-costs\"},{\"@type\":\"ListItem\",\"position\":6,\"name\":\"How to share AI coding stats\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-share-ai-coding-stats\"},{\"@type\":\"ListItem\",\"position\":7,\"name\":\"How to read Claude diagnostics\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-read-claude-diagnostics\"},{\"@type\":\"ListItem\",\"position\":8,\"name\":\"How to compare model usage\",\"url\":\"https://vibestats.wolfai.dev/guides/how-to-compare-model-usage\"}]}}"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"O1feF7gPLeHeL0mJlyXjP\",\"p\":\"\",\"c\":[\"\",\"guides\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"guides\",{\"children\":[\"__PAGE__\",{}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/335de1248158d380.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"children\":[[\"$\",\"head\",null,{\"children\":null}],[\"$\",\"body\",null,{\"className\":\"antialiased min-h-screen bg-background text-foreground\",\"children\":[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]]}]]}],{\"children\":[\"guides\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"main\",null,{\"className\":\"min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(253,186,116,0.22),_transparent_35%),linear-gradient(180deg,#fff9f1_0%,#fff1de_100%)] px-4 py-8 text-slate-900 md:px-8 md:py-12\",\"children\":[[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$4\"}}],\"$L5\"]}],null,\"$L6\"]}],{},null,false]},null,false]},null,false],\"$L7\",false]],\"m\":\"$undefined\",\"G\":[\"$8\",[]],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"9:I[4816,[\"816\",\"static/chunks/816-8960921093d57453.js\",\"6\",\"static/chunks/app/guides/page-08fe89950f57d6cd.js\"],\"\"]\n11:I[496,[],\"OutletBoundary\"]\n13:I[3737,[],\"AsyncMetadataOutlet\"]\n15:I[496,[],\"ViewportBoundary\"]\n17:I[496,[],\"MetadataBoundary\"]\n18:\"$Sreact.suspense\"\n"])</script><script>self.__next_f.push([1,"5:[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-7xl\",\"children\":[[\"$\",\"header\",null,{\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] overflow-hidden\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.28em] text-slate-500\",\"children\":\"Guide library\"}],[\"$\",\"h1\",null,{\"className\":\"mt-4 max-w-4xl font-[family-name:var(--font-display)] text-5xl leading-none text-slate-950 md:text-7xl\",\"children\":\"AI coding analytics guides\"}],[\"$\",\"p\",null,{\"className\":\"mt-5 max-w-3xl text-base leading-7 text-slate-600 md:text-lg\",\"children\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}],[\"$\",\"div\",null,{\"className\":\"mt-6 grid gap-3 text-sm text-slate-600 md:grid-cols-3\",\"children\":[[\"$\",\"div\",null,{\"className\":\"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4\",\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-slate-950\",\"children\":[8,\" pages\"]}],[\"$\",\"span\",null,{\"className\":\"mt-2 block\",\"children\":\"Built around real vibestats workflows instead of generic SEO filler.\"}]]}],[\"$\",\"div\",null,{\"className\":\"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4\",\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-slate-950\",\"children\":\"Internal links\"}],[\"$\",\"span\",null,{\"className\":\"mt-2 block\",\"children\":\"Each page connects to related features, guides, and use cases.\"}]]}],[\"$\",\"div\",null,{\"className\":\"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4\",\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-slate-950\",\"children\":\"Search intent\"}],[\"$\",\"span\",null,{\"className\":\"mt-2 block\",\"children\":\"Every page is focused on one product or reporting question.\"}]]}]]}]]}],[\"$\",\"section\",null,{\"className\":\"mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-3\",\"children\":[[\"$\",\"$L9\",\"how-to-track-claude-code-usage\",{\"href\":\"/guides/how-to-track-claude-code-usage\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to track Claude Code usage\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to tracking Claude Code usage locally with vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Start with daily usage, then refine\",{\"children\":\"Start with daily usage, then refine\"}],[\"$\",\"li\",\"Model and session views answer different follow-up questions\",{\"children\":\"Model and session views answer different follow-up questions\"}],[\"$\",\"li\",\"Diagnostics help when the totals look confusing\",{\"children\":\"Diagnostics help when the totals look confusing\"}]]}]]}],[\"$\",\"$L9\",\"how-to-track-codex-cli-usage\",{\"href\":\"/guides/how-to-track-codex-cli-usage\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to track Codex CLI usage\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to tracking OpenAI Codex CLI usage locally with vibestats.\"}],\"$La\"]}],\"$Lb\",\"$Lc\",\"$Ld\",\"$Le\",\"$Lf\",\"$L10\"]}]]}]\n"])</script><script>self.__next_f.push([1,"6:[\"$\",\"$L11\",null,{\"children\":[\"$L12\",[\"$\",\"$L13\",null,{\"promise\":\"$@14\"}]]}]\n7:[\"$\",\"$1\",\"h\",{\"children\":[null,[[\"$\",\"$L15\",null,{\"children\":\"$L16\"}],null],[\"$\",\"$L17\",null,{\"children\":[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$18\",null,{\"fallback\":null,\"children\":\"$L19\"}]}]}]]}]\n"])</script><script>self.__next_f.push([1,"a:[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Codex works best as its own first view\",{\"children\":\"Codex works best as its own first view\"}],[\"$\",\"li\",\"Total and session views answer different questions\",{\"children\":\"Total and session views answer different questions\"}],[\"$\",\"li\",\"Combined reporting is a second step, not the first\",{\"children\":\"Combined reporting is a second step, not the first\"}]]}]\n"])</script><script>self.__next_f.push([1,"b:[\"$\",\"$L9\",\"how-to-create-ai-coding-wrapped\",{\"href\":\"/guides/how-to-create-ai-coding-wrapped\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to create an AI coding wrapped\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to generating a wrapped-style AI coding recap with vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Wrapped is the best narrative recap view\",{\"children\":\"Wrapped is the best narrative recap view\"}],[\"$\",\"li\",\"Quiet mode is useful for share-first workflows\",{\"children\":\"Quiet mode is useful for share-first workflows\"}],[\"$\",\"li\",\"Heatmaps complement wrapped, not replace it\",{\"children\":\"Heatmaps complement wrapped, not replace it\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"c:[\"$\",\"$L9\",\"how-to-build-ai-activity-heatmap\",{\"href\":\"/guides/how-to-build-ai-activity-heatmap\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to build an AI activity heatmap\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to generating a GitHub-style AI coding activity heatmap with vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Heatmaps are best for rhythm and consistency\",{\"children\":\"Heatmaps are best for rhythm and consistency\"}],[\"$\",\"li\",\"Metric choice changes the story\",{\"children\":\"Metric choice changes the story\"}],[\"$\",\"li\",\"Hosted pages are easier to reuse in updates\",{\"children\":\"Hosted pages are easier to reuse in updates\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"d:[\"$\",\"$L9\",\"how-to-measure-ai-token-costs\",{\"href\":\"/guides/how-to-measure-ai-token-costs\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to measure AI token costs\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to measuring token volume and estimated cost in vibestats.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Totals are the cleanest starting point\",{\"children\":\"Totals are the cleanest starting point\"}],[\"$\",\"li\",\"Tokens and cost are related but not identical\",{\"children\":\"Tokens and cost are related but not identical\"}],[\"$\",\"li\",\"Model views help explain cost shifts\",{\"children\":\"Model views help explain cost shifts\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"e:[\"$\",\"$L9\",\"how-to-share-ai-coding-stats\",{\"href\":\"/guides/how-to-share-ai-coding-stats\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to share AI coding stats\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to turning local vibestats output into shareable aggregate pages.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Share the surface that fits the audience\",{\"children\":\"Share the surface that fits the audience\"}],[\"$\",\"li\",\"Aggregate pages are better than screenshots\",{\"children\":\"Aggregate pages are better than screenshots\"}],[\"$\",\"li\",\"Stored share pages are better than legacy payload URLs\",{\"children\":\"Stored share pages are better than legacy payload URLs\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"f:[\"$\",\"$L9\",\"how-to-read-claude-diagnostics\",{\"href\":\"/guides/how-to-read-claude-diagnostics\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to read Claude diagnostics\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to using vibestats Claude diagnostics commands for local state and limit clues.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Diagnostics complement usage reports\",{\"children\":\"Diagnostics complement usage reports\"}],[\"$\",\"li\",\"Best used when something looks off\",{\"children\":\"Best used when something looks off\"}],[\"$\",\"li\",\"Local file visibility beats guesswork\",{\"children\":\"Local file visibility beats guesswork\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"10:[\"$\",\"$L9\",\"how-to-compare-model-usage\",{\"href\":\"/guides/how-to-compare-model-usage\",\"className\":\"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500\",\"children\":\"Guide\"}],[\"$\",\"h2\",null,{\"className\":\"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950\",\"children\":\"How to compare model usage\"}],[\"$\",\"p\",null,{\"className\":\"mt-4 text-sm leading-7 text-slate-600\",\"children\":\"A practical guide to comparing AI model usage in vibestats across reporting windows and source scopes.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-5 space-y-2 text-sm leading-6 text-slate-600\",\"children\":[[\"$\",\"li\",\"Stable windows matter more than perfect totals\",{\"children\":\"Stable windows matter more than perfect totals\"}],[\"$\",\"li\",\"Model share is easier to read when grouped directly\",{\"children\":\"Model share is easier to read when grouped directly\"}],[\"$\",\"li\",\"Source context helps interpret model shifts\",{\"children\":\"Source context helps interpret model shifts\"}]]}]]}]\n"])</script><script>self.__next_f.push([1,"16:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n12:null\n"])</script><script>self.__next_f.push([1,"14:{\"metadata\":[[\"$\",\"title\",\"0\",{\"children\":\"Guides \| vibestats\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}],[\"$\",\"meta\",\"2\",{\"name\":\"application-name\",\"content\":\"vibestats\"}],[\"$\",\"meta\",\"3\",{\"name\":\"keywords\",\"content\":\"vibestats,Claude Code stats,Codex CLI stats,AI coding stats,AI coding analytics,Claude Code wrapped,Codex usage tracker,developer analytics,Claude Code usage guide,Codex CLI usage guide,AI coding analytics guide\"}],[\"$\",\"link\",\"4\",{\"rel\":\"canonical\",\"href\":\"https://vibestats.wolfai.dev/guides\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:title\",\"content\":\"Guides \| vibestats\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:description\",\"content\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:url\",\"content\":\"https://vibestats.wolfai.dev/guides\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:site_name\",\"content\":\"vibestats\"}],[\"$\",\"meta\",\"9\",{\"property\":\"og:locale\",\"content\":\"en_US\"}],[\"$\",\"meta\",\"10\",{\"property\":\"og:type\",\"content\":\"website\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:card\",\"content\":\"summary\"}],[\"$\",\"meta\",\"12\",{\"name\":\"twitter:title\",\"content\":\"Guides \| vibestats\"}],[\"$\",\"meta\",\"13\",{\"name\":\"twitter:description\",\"content\":\"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.\"}]],\"error\":null,\"digest\":\"$undefined\"}\n"])</script><script>self.__next_f.push([1,"19:\"$14:metadata\"\n"])</script></body></html>

package/dist/web/guides.txt CHANGED Viewed

@@ -1,27 +1,26 @@
 1:"$Sreact.fragment"
-2:I[7437,["177","static/chunks/app/layout-6ebd9b17af55ec02.js"],""]
-3:I[5965,[],""]
-4:I[3609,[],""]
-9:I[2207,[],""]
+2:I[5965,[],""]
+3:I[3609,[],""]
+8:I[2207,[],""]
 :HL["/_next/static/css/335de1248158d380.css","style"]
-5:T615,{"@context":"https://schema.org","@type":"CollectionPage","name":"AI coding analytics guides","description":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.","url":"https://vibestats.wolfai.dev/guides","mainEntity":{"@type":"ItemList","itemListElement":[{"@type":"ListItem","position":1,"name":"How to track Claude Code usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-claude-code-usage"},{"@type":"ListItem","position":2,"name":"How to track Codex CLI usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-codex-cli-usage"},{"@type":"ListItem","position":3,"name":"How to create an AI coding wrapped","url":"https://vibestats.wolfai.dev/guides/how-to-create-ai-coding-wrapped"},{"@type":"ListItem","position":4,"name":"How to build an AI activity heatmap","url":"https://vibestats.wolfai.dev/guides/how-to-build-ai-activity-heatmap"},{"@type":"ListItem","position":5,"name":"How to measure AI token costs","url":"https://vibestats.wolfai.dev/guides/how-to-measure-ai-token-costs"},{"@type":"ListItem","position":6,"name":"How to share AI coding stats","url":"https://vibestats.wolfai.dev/guides/how-to-share-ai-coding-stats"},{"@type":"ListItem","position":7,"name":"How to read Claude diagnostics","url":"https://vibestats.wolfai.dev/guides/how-to-read-claude-diagnostics"},{"@type":"ListItem","position":8,"name":"How to compare model usage","url":"https://vibestats.wolfai.dev/guides/how-to-compare-model-usage"}]}}0:{"P":null,"b":"OTOSYSO_lYg8uryMGgC0P","p":"","c":["","guides"],"i":false,"f":[[["",{"children":["guides",{"children":["__PAGE__",{}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/335de1248158d380.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","children":[["$","head",null,{"children":[["$","$L2",null,{"id":"wolf-analytics-config","strategy":"beforeInteractive","children":"window.WOLF_ANALYTICS_CONFIG = {\"apiUrl\":\"https://analapi.wolfai.dev\",\"projectApiKey\":\"wa_rMSm5mgj44W_9LzMsKCwwAipAtxPynp1tn4PbxN_Oa8\",\"mode\":\"intl\",\"sourceApp\":\"vibestats\"};"}],["$","$L2",null,{"id":"wolf-analytics-script","src":"https://analytics.wolfai.dev/wolf-analytics.min.js","strategy":"beforeInteractive"}]]}],["$","body",null,{"className":"antialiased min-h-screen bg-background text-foreground","children":["$","$L3",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L4",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]]}]]}],{"children":["guides",["$","$1","c",{"children":[null,["$","$L3",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L4",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","main",null,{"className":"min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(253,186,116,0.22),_transparent_35%),linear-gradient(180deg,#fff9f1_0%,#fff1de_100%)] px-4 py-8 text-slate-900 md:px-8 md:py-12","children":[["$","script",null,{"type":"application/ld+json","dangerouslySetInnerHTML":{"__html":"$5"}}],"$L6"]}],null,"$L7"]}],{},null,false]},null,false]},null,false],"$L8",false]],"m":"$undefined","G":["$9",[]],"s":false,"S":true}
-a:I[4816,["816","static/chunks/816-8960921093d57453.js","6","static/chunks/app/guides/page-5d0587c1d5910e68.js"],""]
-12:I[496,[],"OutletBoundary"]
-14:I[3737,[],"AsyncMetadataOutlet"]
-16:I[496,[],"ViewportBoundary"]
-18:I[496,[],"MetadataBoundary"]
-19:"$Sreact.suspense"
-6:["$","div",null,{"className":"mx-auto max-w-7xl","children":[["$","header",null,{"className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] overflow-hidden","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.28em] text-slate-500","children":"Guide library"}],["$","h1",null,{"className":"mt-4 max-w-4xl font-[family-name:var(--font-display)] text-5xl leading-none text-slate-950 md:text-7xl","children":"AI coding analytics guides"}],["$","p",null,{"className":"mt-5 max-w-3xl text-base leading-7 text-slate-600 md:text-lg","children":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}],["$","div",null,{"className":"mt-6 grid gap-3 text-sm text-slate-600 md:grid-cols-3","children":[["$","div",null,{"className":"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4","children":[["$","strong",null,{"className":"block text-slate-950","children":[8," pages"]}],["$","span",null,{"className":"mt-2 block","children":"Built around real vibestats workflows instead of generic SEO filler."}]]}],["$","div",null,{"className":"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4","children":[["$","strong",null,{"className":"block text-slate-950","children":"Internal links"}],["$","span",null,{"className":"mt-2 block","children":"Each page connects to related features, guides, and use cases."}]]}],["$","div",null,{"className":"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4","children":[["$","strong",null,{"className":"block text-slate-950","children":"Search intent"}],["$","span",null,{"className":"mt-2 block","children":"Every page is focused on one product or reporting question."}]]}]]}]]}],["$","section",null,{"className":"mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-3","children":[["$","$La","how-to-track-claude-code-usage",{"href":"/guides/how-to-track-claude-code-usage","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to track Claude Code usage"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to tracking Claude Code usage locally with vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Start with daily usage, then refine",{"children":"Start with daily usage, then refine"}],["$","li","Model and session views answer different follow-up questions",{"children":"Model and session views answer different follow-up questions"}],["$","li","Diagnostics help when the totals look confusing",{"children":"Diagnostics help when the totals look confusing"}]]}]]}],["$","$La","how-to-track-codex-cli-usage",{"href":"/guides/how-to-track-codex-cli-usage","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to track Codex CLI usage"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to tracking OpenAI Codex CLI usage locally with vibestats."}],"$Lb"]}],"$Lc","$Ld","$Le","$Lf","$L10","$L11"]}]]}]
-7:["$","$L12",null,{"children":["$L13",["$","$L14",null,{"promise":"$@15"}]]}]
-8:["$","$1","h",{"children":[null,[["$","$L16",null,{"children":"$L17"}],null],["$","$L18",null,{"children":["$","div",null,{"hidden":true,"children":["$","$19",null,{"fallback":null,"children":"$L1a"}]}]}]]}]
-b:["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Codex works best as its own first view",{"children":"Codex works best as its own first view"}],["$","li","Total and session views answer different questions",{"children":"Total and session views answer different questions"}],["$","li","Combined reporting is a second step, not the first",{"children":"Combined reporting is a second step, not the first"}]]}]
-c:["$","$La","how-to-create-ai-coding-wrapped",{"href":"/guides/how-to-create-ai-coding-wrapped","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to create an AI coding wrapped"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to generating a wrapped-style AI coding recap with vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Wrapped is the best narrative recap view",{"children":"Wrapped is the best narrative recap view"}],["$","li","Quiet mode is useful for share-first workflows",{"children":"Quiet mode is useful for share-first workflows"}],["$","li","Heatmaps complement wrapped, not replace it",{"children":"Heatmaps complement wrapped, not replace it"}]]}]]}]
-d:["$","$La","how-to-build-ai-activity-heatmap",{"href":"/guides/how-to-build-ai-activity-heatmap","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to build an AI activity heatmap"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to generating a GitHub-style AI coding activity heatmap with vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Heatmaps are best for rhythm and consistency",{"children":"Heatmaps are best for rhythm and consistency"}],["$","li","Metric choice changes the story",{"children":"Metric choice changes the story"}],["$","li","Hosted pages are easier to reuse in updates",{"children":"Hosted pages are easier to reuse in updates"}]]}]]}]
-e:["$","$La","how-to-measure-ai-token-costs",{"href":"/guides/how-to-measure-ai-token-costs","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to measure AI token costs"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to measuring token volume and estimated cost in vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Totals are the cleanest starting point",{"children":"Totals are the cleanest starting point"}],["$","li","Tokens and cost are related but not identical",{"children":"Tokens and cost are related but not identical"}],["$","li","Model views help explain cost shifts",{"children":"Model views help explain cost shifts"}]]}]]}]
-f:["$","$La","how-to-share-ai-coding-stats",{"href":"/guides/how-to-share-ai-coding-stats","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to share AI coding stats"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to turning local vibestats output into shareable aggregate pages."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Share the surface that fits the audience",{"children":"Share the surface that fits the audience"}],["$","li","Aggregate pages are better than screenshots",{"children":"Aggregate pages are better than screenshots"}],["$","li","Stored share pages are better than legacy payload URLs",{"children":"Stored share pages are better than legacy payload URLs"}]]}]]}]
-10:["$","$La","how-to-read-claude-diagnostics",{"href":"/guides/how-to-read-claude-diagnostics","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to read Claude diagnostics"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to using vibestats Claude diagnostics commands for local state and limit clues."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Diagnostics complement usage reports",{"children":"Diagnostics complement usage reports"}],["$","li","Best used when something looks off",{"children":"Best used when something looks off"}],["$","li","Local file visibility beats guesswork",{"children":"Local file visibility beats guesswork"}]]}]]}]
-11:["$","$La","how-to-compare-model-usage",{"href":"/guides/how-to-compare-model-usage","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to compare model usage"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to comparing AI model usage in vibestats across reporting windows and source scopes."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Stable windows matter more than perfect totals",{"children":"Stable windows matter more than perfect totals"}],["$","li","Model share is easier to read when grouped directly",{"children":"Model share is easier to read when grouped directly"}],["$","li","Source context helps interpret model shifts",{"children":"Source context helps interpret model shifts"}]]}]]}]
-17:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]
-13:null
-15:{"metadata":[["$","title","0",{"children":"Guides | vibestats"}],["$","meta","1",{"name":"description","content":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}],["$","meta","2",{"name":"application-name","content":"vibestats"}],["$","meta","3",{"name":"keywords","content":"vibestats,Claude Code stats,Codex CLI stats,AI coding stats,AI coding analytics,Claude Code wrapped,Codex usage tracker,developer analytics,Claude Code usage guide,Codex CLI usage guide,AI coding analytics guide"}],["$","link","4",{"rel":"canonical","href":"https://vibestats.wolfai.dev/guides"}],["$","meta","5",{"property":"og:title","content":"Guides | vibestats"}],["$","meta","6",{"property":"og:description","content":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}],["$","meta","7",{"property":"og:url","content":"https://vibestats.wolfai.dev/guides"}],["$","meta","8",{"property":"og:site_name","content":"vibestats"}],["$","meta","9",{"property":"og:locale","content":"en_US"}],["$","meta","10",{"property":"og:type","content":"website"}],["$","meta","11",{"name":"twitter:card","content":"summary"}],["$","meta","12",{"name":"twitter:title","content":"Guides | vibestats"}],["$","meta","13",{"name":"twitter:description","content":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}]],"error":null,"digest":"$undefined"}
-1a:"$15:metadata"
+4:T615,{"@context":"https://schema.org","@type":"CollectionPage","name":"AI coding analytics guides","description":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats.","url":"https://vibestats.wolfai.dev/guides","mainEntity":{"@type":"ItemList","itemListElement":[{"@type":"ListItem","position":1,"name":"How to track Claude Code usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-claude-code-usage"},{"@type":"ListItem","position":2,"name":"How to track Codex CLI usage","url":"https://vibestats.wolfai.dev/guides/how-to-track-codex-cli-usage"},{"@type":"ListItem","position":3,"name":"How to create an AI coding wrapped","url":"https://vibestats.wolfai.dev/guides/how-to-create-ai-coding-wrapped"},{"@type":"ListItem","position":4,"name":"How to build an AI activity heatmap","url":"https://vibestats.wolfai.dev/guides/how-to-build-ai-activity-heatmap"},{"@type":"ListItem","position":5,"name":"How to measure AI token costs","url":"https://vibestats.wolfai.dev/guides/how-to-measure-ai-token-costs"},{"@type":"ListItem","position":6,"name":"How to share AI coding stats","url":"https://vibestats.wolfai.dev/guides/how-to-share-ai-coding-stats"},{"@type":"ListItem","position":7,"name":"How to read Claude diagnostics","url":"https://vibestats.wolfai.dev/guides/how-to-read-claude-diagnostics"},{"@type":"ListItem","position":8,"name":"How to compare model usage","url":"https://vibestats.wolfai.dev/guides/how-to-compare-model-usage"}]}}0:{"P":null,"b":"O1feF7gPLeHeL0mJlyXjP","p":"","c":["","guides"],"i":false,"f":[[["",{"children":["guides",{"children":["__PAGE__",{}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/335de1248158d380.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","children":[["$","head",null,{"children":null}],["$","body",null,{"className":"antialiased min-h-screen bg-background text-foreground","children":["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]]}]]}],{"children":["guides",["$","$1","c",{"children":[null,["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","main",null,{"className":"min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(253,186,116,0.22),_transparent_35%),linear-gradient(180deg,#fff9f1_0%,#fff1de_100%)] px-4 py-8 text-slate-900 md:px-8 md:py-12","children":[["$","script",null,{"type":"application/ld+json","dangerouslySetInnerHTML":{"__html":"$4"}}],"$L5"]}],null,"$L6"]}],{},null,false]},null,false]},null,false],"$L7",false]],"m":"$undefined","G":["$8",[]],"s":false,"S":true}
+9:I[4816,["816","static/chunks/816-8960921093d57453.js","6","static/chunks/app/guides/page-08fe89950f57d6cd.js"],""]
+11:I[496,[],"OutletBoundary"]
+13:I[3737,[],"AsyncMetadataOutlet"]
+15:I[496,[],"ViewportBoundary"]
+17:I[496,[],"MetadataBoundary"]
+18:"$Sreact.suspense"
+5:["$","div",null,{"className":"mx-auto max-w-7xl","children":[["$","header",null,{"className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] overflow-hidden","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.28em] text-slate-500","children":"Guide library"}],["$","h1",null,{"className":"mt-4 max-w-4xl font-[family-name:var(--font-display)] text-5xl leading-none text-slate-950 md:text-7xl","children":"AI coding analytics guides"}],["$","p",null,{"className":"mt-5 max-w-3xl text-base leading-7 text-slate-600 md:text-lg","children":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}],["$","div",null,{"className":"mt-6 grid gap-3 text-sm text-slate-600 md:grid-cols-3","children":[["$","div",null,{"className":"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4","children":[["$","strong",null,{"className":"block text-slate-950","children":[8," pages"]}],["$","span",null,{"className":"mt-2 block","children":"Built around real vibestats workflows instead of generic SEO filler."}]]}],["$","div",null,{"className":"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4","children":[["$","strong",null,{"className":"block text-slate-950","children":"Internal links"}],["$","span",null,{"className":"mt-2 block","children":"Each page connects to related features, guides, and use cases."}]]}],["$","div",null,{"className":"rounded-[1.3rem] border border-slate-200 bg-slate-50 px-4 py-4","children":[["$","strong",null,{"className":"block text-slate-950","children":"Search intent"}],["$","span",null,{"className":"mt-2 block","children":"Every page is focused on one product or reporting question."}]]}]]}]]}],["$","section",null,{"className":"mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-3","children":[["$","$L9","how-to-track-claude-code-usage",{"href":"/guides/how-to-track-claude-code-usage","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to track Claude Code usage"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to tracking Claude Code usage locally with vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Start with daily usage, then refine",{"children":"Start with daily usage, then refine"}],["$","li","Model and session views answer different follow-up questions",{"children":"Model and session views answer different follow-up questions"}],["$","li","Diagnostics help when the totals look confusing",{"children":"Diagnostics help when the totals look confusing"}]]}]]}],["$","$L9","how-to-track-codex-cli-usage",{"href":"/guides/how-to-track-codex-cli-usage","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to track Codex CLI usage"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to tracking OpenAI Codex CLI usage locally with vibestats."}],"$La"]}],"$Lb","$Lc","$Ld","$Le","$Lf","$L10"]}]]}]
+6:["$","$L11",null,{"children":["$L12",["$","$L13",null,{"promise":"$@14"}]]}]
+7:["$","$1","h",{"children":[null,[["$","$L15",null,{"children":"$L16"}],null],["$","$L17",null,{"children":["$","div",null,{"hidden":true,"children":["$","$18",null,{"fallback":null,"children":"$L19"}]}]}]]}]
+a:["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Codex works best as its own first view",{"children":"Codex works best as its own first view"}],["$","li","Total and session views answer different questions",{"children":"Total and session views answer different questions"}],["$","li","Combined reporting is a second step, not the first",{"children":"Combined reporting is a second step, not the first"}]]}]
+b:["$","$L9","how-to-create-ai-coding-wrapped",{"href":"/guides/how-to-create-ai-coding-wrapped","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to create an AI coding wrapped"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to generating a wrapped-style AI coding recap with vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Wrapped is the best narrative recap view",{"children":"Wrapped is the best narrative recap view"}],["$","li","Quiet mode is useful for share-first workflows",{"children":"Quiet mode is useful for share-first workflows"}],["$","li","Heatmaps complement wrapped, not replace it",{"children":"Heatmaps complement wrapped, not replace it"}]]}]]}]
+c:["$","$L9","how-to-build-ai-activity-heatmap",{"href":"/guides/how-to-build-ai-activity-heatmap","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to build an AI activity heatmap"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to generating a GitHub-style AI coding activity heatmap with vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Heatmaps are best for rhythm and consistency",{"children":"Heatmaps are best for rhythm and consistency"}],["$","li","Metric choice changes the story",{"children":"Metric choice changes the story"}],["$","li","Hosted pages are easier to reuse in updates",{"children":"Hosted pages are easier to reuse in updates"}]]}]]}]
+d:["$","$L9","how-to-measure-ai-token-costs",{"href":"/guides/how-to-measure-ai-token-costs","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to measure AI token costs"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to measuring token volume and estimated cost in vibestats."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Totals are the cleanest starting point",{"children":"Totals are the cleanest starting point"}],["$","li","Tokens and cost are related but not identical",{"children":"Tokens and cost are related but not identical"}],["$","li","Model views help explain cost shifts",{"children":"Model views help explain cost shifts"}]]}]]}]
+e:["$","$L9","how-to-share-ai-coding-stats",{"href":"/guides/how-to-share-ai-coding-stats","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to share AI coding stats"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to turning local vibestats output into shareable aggregate pages."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Share the surface that fits the audience",{"children":"Share the surface that fits the audience"}],["$","li","Aggregate pages are better than screenshots",{"children":"Aggregate pages are better than screenshots"}],["$","li","Stored share pages are better than legacy payload URLs",{"children":"Stored share pages are better than legacy payload URLs"}]]}]]}]
+f:["$","$L9","how-to-read-claude-diagnostics",{"href":"/guides/how-to-read-claude-diagnostics","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to read Claude diagnostics"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to using vibestats Claude diagnostics commands for local state and limit clues."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Diagnostics complement usage reports",{"children":"Diagnostics complement usage reports"}],["$","li","Best used when something looks off",{"children":"Best used when something looks off"}],["$","li","Local file visibility beats guesswork",{"children":"Local file visibility beats guesswork"}]]}]]}]
+10:["$","$L9","how-to-compare-model-usage",{"href":"/guides/how-to-compare-model-usage","className":"rounded-[1.8rem] border border-slate-200 bg-white/95 p-6 shadow-[0_20px_40px_rgba(15,23,42,0.06)] transition hover:-translate-y-0.5 hover:border-orange-300","children":[["$","p",null,{"className":"text-[0.72rem] font-semibold uppercase tracking-[0.22em] text-slate-500","children":"Guide"}],["$","h2",null,{"className":"mt-3 font-[family-name:var(--font-display)] text-3xl leading-none text-slate-950","children":"How to compare model usage"}],["$","p",null,{"className":"mt-4 text-sm leading-7 text-slate-600","children":"A practical guide to comparing AI model usage in vibestats across reporting windows and source scopes."}],["$","ul",null,{"className":"mt-5 space-y-2 text-sm leading-6 text-slate-600","children":[["$","li","Stable windows matter more than perfect totals",{"children":"Stable windows matter more than perfect totals"}],["$","li","Model share is easier to read when grouped directly",{"children":"Model share is easier to read when grouped directly"}],["$","li","Source context helps interpret model shifts",{"children":"Source context helps interpret model shifts"}]]}]]}]
+16:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]
+12:null
+14:{"metadata":[["$","title","0",{"children":"Guides | vibestats"}],["$","meta","1",{"name":"description","content":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}],["$","meta","2",{"name":"application-name","content":"vibestats"}],["$","meta","3",{"name":"keywords","content":"vibestats,Claude Code stats,Codex CLI stats,AI coding stats,AI coding analytics,Claude Code wrapped,Codex usage tracker,developer analytics,Claude Code usage guide,Codex CLI usage guide,AI coding analytics guide"}],["$","link","4",{"rel":"canonical","href":"https://vibestats.wolfai.dev/guides"}],["$","meta","5",{"property":"og:title","content":"Guides | vibestats"}],["$","meta","6",{"property":"og:description","content":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}],["$","meta","7",{"property":"og:url","content":"https://vibestats.wolfai.dev/guides"}],["$","meta","8",{"property":"og:site_name","content":"vibestats"}],["$","meta","9",{"property":"og:locale","content":"en_US"}],["$","meta","10",{"property":"og:type","content":"website"}],["$","meta","11",{"name":"twitter:card","content":"summary"}],["$","meta","12",{"name":"twitter:title","content":"Guides | vibestats"}],["$","meta","13",{"name":"twitter:description","content":"Read practical guides for tracking Claude Code usage, tracking Codex CLI usage, creating wrapped reports, building activity heatmaps, and sharing aggregate stats."}]],"error":null,"digest":"$undefined"}
+19:"$14:metadata"