# Behavior traces — Chalarangelo/30-seconds-of-code

> Canonical page: https://codevetter.com/unpack/30-seconds-of-code/behavior-traces

# Behavior traces — Chalarangelo/30-seconds-of-code

Scanned commit bd756f8b2283a38560efe83cb30af38324d4e9e9 (2026-09-09). Generated by codevetter codevetter 1.12.0 on 2026-09-22.

The three flows worth knowing end-to-end: (1) 'npm run dev' runs the content pipeline with Prism fast-highlighting then starts astro dev; (2) 'npm run build' runs the full pipeline (assets + Shiki + all generated artifacts) then astro build; (3) at runtime, the only dynamic behavior is the omnisearch modal which fetches the prebuilt search index. A fourth flow — watch mode — respawns the whole dev pipeline per file change, and deployment is a cron-triggered Cloudflare webhook call.
- Dev startup trace: npm run dev → predev 'bin/prepare dev --fast-highlight' → sets NODE_ENV=development → ContentUtils.prepareContent('prism') → extractData → FileHandler.write(.content/content.json) → Loader.loadModules + importData → AstroContent.generate → SearchIndex.generate → TimestampDump.generate → ContentComponents.prepare → 'astro dev --port 8000'. — [bin/prepare#L66-90](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/bin/prepare#L66-L90) [package.json#L44-45](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/package.json#L44-L45) [src/lib/contentUtils/contentUtils.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/contentUtils/contentUtils.js)
- Full build trace: npm run build → prebuild 'bin/prepare full' → ContentUtils.prepareAssets (sharp image conversion, non-forced) → prepareContent with Shiki (fastHighlight=false) → importData → AstroContent.generate → SearchIndex.generate → Redirects.generate → Feed.generate → Sitemap.generate → TimestampDump.generate → ContentComponents.prepare → 'astro build'. — [bin/prepare#L29-65](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/bin/prepare#L29-L65) [package.json#L50-51](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/package.json#L50-L51)
- Watch trace: 'bin/prepare watch [--fast-highlight]' → FileWatcher.watch does fs.watch('content', {recursive:true}) → every event logs the filename and exec()s a fresh 'bin/prepare dev' child process — a full re-extraction per change with no debounce. — [bin/prepare#L91-99](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/bin/prepare#L91-L99) [src/lib/contentUtils/fileWatcher.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/contentUtils/fileWatcher.js)
- Snippet page render trace (at astro build): getStaticPaths reads .content/pages/[lang]/s/[snippet].json → each serialized SnippetPage entry supplies params {lang, snippet} and props {breadcrumbs, pageDescription, snippet(context), journey(pagination), recommendations(collection+snippets, ≤4 previews)} → Layout renders Breadcrumb, SnippetContent, Pagination (if journey), PreviewList, ContentComponentsFallback, TableOfContents. — [src/astro/pages/[lang]/s/[snippet].astro](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/astro/pages/%5Blang%5D/s/%5Bsnippet%5D.astro) [src/adapters/page/snippetPage.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/adapters/page/snippetPage.js) [src/serializers/pageSerializer.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/serializers/pageSerializer.js)
- Recommendation trace inside a snippet page build: SnippetPage.props reads object.recommendedSnippets → RecommendationPresenter.recommendSnippets() scores candidates pre-grouped by languageId and primaryTag (language up to 45 pts, primary tag up to 15, recToken overlap up to 40, thresholds per settings.recommendations) → top results merged with recommendedCollection and sliced to 4 previews. — [src/presenters/recommendationPresenter.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/presenters/recommendationPresenter.js) [src/config/settings.js#L100-121](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/config/settings.js#L100-L121) [src/adapters/page/snippetPage.js#L24-30](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/adapters/page/snippetPage.js#L24-L30)
- Omnisearch runtime trace: user clicks [data-open-modal] → open() → prepare() fetches /search-data.json once → documents mapped {id:url, content:deserializeTokens(searchTokens)} → new DocumentIndex → search(index) closure → keyup on #omnisearch → searchByKeyphrase trims/lowercases, returns [] for len<=1 → searchDocuments(q,100) → TF-IDF term scoring + 0.7-weighted ngram similarity → displayResults writes innerHTML list. — [src/astro/scripts/omnisearch.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/astro/scripts/omnisearch.js) [src/lib/search/documentSearch.js#L109-149](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/search/documentSearch.js#L109-L149) [src/lib/search/documentIndex.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/search/documentIndex.js)
- Scheduled publishing trace: snippet front-matter dateModified in the future → Snippet.isScheduled true → Snippet.scope('published') excludes it; AstroContent.generateSnippetPages uses Snippet.all when NODE_ENV==='development' but Snippet.scope('published') otherwise, so scheduled articles appear locally but not in production builds. — [src/lib/astroContent.js#L45-54](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/astroContent.js#L45-L54) [src/models/snippet.js#L47-55](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/models/snippet.js#L47-L55) [src/models/snippet.js#L180-190](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/models/snippet.js#L180-L190)
- Deploy trace: deploy-production.yml runs on cron '20 18 * * *' or manual dispatch → checkout@v1 → chmod +x ./bin/deploy → './bin/deploy production' → bash curl -X POST to $DEPLOY_URL (secret CF_BUILD_HOOK_URL) with trigger_title and trigger_branch=master → Cloudflare rebuilds and serves the static site. — [.github/workflows/deploy-production.yml](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/.github/workflows/deploy-production.yml) [bin/deploy](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/bin/deploy)
- Content creation trace: 'npm run create' → 'bin/prepare create snippet js my-name' → ContentCreator.create resolves content/snippets/js/snippet-template.md as the template → replaces title and dateModified (today) via regex → mkdirs content/snippets/js/s if needed → writes my-name.md; collections similarly use content/collection-template.yaml with slug/name replacement. — [package.json#L53](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/package.json#L53) [bin/prepare#L105-112](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/bin/prepare#L105-L112) [src/lib/contentUtils/contentCreator.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/contentUtils/contentCreator.js)
- Console trace: 'npm run console' → bin/console starts node:repl → Loader.loadModules + importData hydrates the full model graph → models/serializers/pages/module classes injected into REPL context → PreparedQueries functions bound and documentIndex prebuilt → exposes helpers like searchForTerm, snippetsWithoutFormatting, snippetCoverUsage. — [bin/console](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/bin/console) [src/lib/preparedQueries.js](https://github.com/Chalarangelo/30-seconds-of-code/blob/bd756f8b2283a38560efe83cb30af38324d4e9e9/src/lib/preparedQueries.js)

Every claim links to its cited files at the pinned commit. Citations identify source evidence; they do not establish runtime correctness. Independent CodeVetter scan — not reviewed by upstream maintainers.

## Public product links

- [CodeVetter](https://codevetter.com/)
- [Download](https://codevetter.com/download)
- [Documentation](https://codevetter.com/docs/)
- [Source](https://github.com/Codevetter/codevetter)