How do I build a personal hub on Cloudflare Pages?
AI-written, human-reviewed
Use static HTML with JSON data files, a build step that inlines content for crawlers, lazy YouTube embeds, prompt-and-answer blog posts, and a thinking capture page that exports entries you can commit to git.
Prompt
cloudflare optimize landing page for cloudflare pages ; youtube videos ; list of the domains and dev pages I am working on ; a blog section for the text of the prompts and answers ; old projects from google drive ; capturing my wandering stream of thinking and more.
Why build a personal hub on Cloudflare Pages?
Cloudflare Pages gives you free static hosting on a global CDN with instant rollbacks and custom domains. A personal hub centralizes every project URL, dev preview, video note, and half-formed idea in one crawler-readable place instead of scattering them across bookmarks and Drive folders.
You do not need a database or server runtime for a developer portfolio hub. Static files deploy in seconds, cost nothing at modest traffic, and survive traffic spikes without configuration. Cloudflare Pages also pairs naturally with Workers if you later add dynamic features, but the baseline hub should stay static so Google and LLM retrievers always get full text.
Daniel's Corner uses this pattern: one homepage, JSON data files you edit by hand, and a small build script that writes HTML blocks before deploy. The result is fast for humans and complete for bots.
TLDR: Cloudflare Pages is free, fast, and ideal for a static hub that LLMs can read.
Related: Daniel's Corner homepage · Projects table
What belongs on a developer personal hub?
A useful hub lists live and in-progress domains, embeds relevant YouTube walkthroughs, archives legacy Google Drive folders, publishes prompt-and-answer logs from your build sessions, and captures raw thoughts before they become blog posts or tasks.
Think of the hub as an index, not a second blog. The homepage answers "what am I building right now?" in a table with production URL, dev preview, status, and stack. Video cards explain demos. Drive cards link old exports. The blog preserves exact prompts and answers so future you (and search engines) can trace decisions.
The thinking stream fills the gap between tweet-length notes and polished articles. Capture locally, export JSON, merge into git, redeploy. Nothing requires a backend until you choose to add one.
TLDR: Projects table, videos, Drive links, prompt logs, and a thinking stream cover the full workflow.
Related: Thinking stream · Drive archive
How does static HTML help Google and LLM discovery?
Search engines and AI crawlers reliably parse HTML in the initial response. Content loaded only through JavaScript after page load is invisible to many bots, which lowers citation odds and organic rankings.
LLM retrieval systems favor pages with clear structure: question-based headings, direct answers in the first sentences of each section, plain-text prices and metrics, and JSON-LD in the head. Daniel's Corner ships critical text in the HTML source. JSON files remain the editor-friendly source of truth, but npm run build inlines tables, cards, and blog lists into the page before deploy.
This is the same principle as Answer Engine Optimization (AEO): make the answer easy to extract. A wall of JavaScript-rendered cards fails that test even if the site looks fine in Chrome.
TLDR: Static HTML in the first response beats JS-only rendering for Google and LLMs.
Related: Homepage FAQ · Blog index
How do I organize projects and dev pages in one table?
Store each project as a JSON object with name, production URL, dev preview URL, status (live, dev, planned), stack, and notes. A build script renders a semantic HTML table crawlers can parse row by row.
Example row: IsraeliLeads at israelileads.com with preview on Pages, status live, stack Cloudflare Pages. Empty URLs render as "n/a" instead of broken links. Status uses colored pills for humans but the text label remains plain in the cell for bots.
Edit public/data/domains.json, run the build, deploy. No CMS required. The table on the homepage is the canonical project index linked from the footer and blog posts.
TLDR: One JSON file, one HTML table, rebuild on change.
Related: Live projects table · IsraeliLeads
How do I embed YouTube without slowing the page?
Use the privacy-enhanced youtube-nocookie.com embed URL, add loading="lazy" on the iframe, and place title plus description as static text below each embed so crawlers see context even if they skip the iframe.
Video IDs live in public/data/youtube.json. Each entry has id, title, videoId, and description. The build script outputs article cards with iframes and paragraphs. Lazy loading defers network cost until the user scrolls near the video, which helps Largest Contentful Paint on the homepage.
Do not rely on the iframe title alone for SEO. Repeat the topic in an H3 and a plain sentence under the embed. That text is what LLMs quote when summarizing your hub.
TLDR: nocookie embeds, lazy iframes, static titles and descriptions beneath each video.
Related: Homepage videos
How do I publish prompt-and-answer logs?
Each blog post stores the original user prompt and the full model answer on a dedicated static URL. Titles are phrased as questions. Summaries appear in list cards and meta descriptions. The detail page adds Article JSON-LD.
This format mirrors how developers actually work with AI tools: you ask a compound question, get a long answer, and want to preserve both for later. Shipping them as static HTML makes the log discoverable when someone searches "how do I build a personal hub on Cloudflare Pages?"
Metadata lives in public/data/blog-posts.json. Long-form body content can live in /blog/{slug}/index.html for depth. List pages and RSS are generated at build time from the JSON index.
TLDR: Question titles, static detail pages, prompt block plus answer block on each post.
Related: Blog index · RSS feed
How do I capture wandering thoughts before they become posts?
The Thinking page saves drafts in browser localStorage, lets you export them as JSON, and displays published notes from thoughts.json as static HTML on the homepage and thinking page.
Not every idea deserves a 3,000-word article immediately. Short dated notes with optional tags capture momentum without forcing structure. When an idea matures, promote it: expand into a blog post, add a domain row, or link a Drive folder.
The workflow is intentionally manual after export: merge JSON, rebuild, deploy. That keeps the git history honest and avoids putting write credentials on a static site.
TLDR: Local capture, JSON export, merge to thoughts.json, rebuild, deploy.
Related: Thinking page · Published thoughts preview
Where do Google Drive archives fit?
Drive folders hold legacy exports, slides, and code snapshots that should stay linked but not hosted on Pages. Each archive is a static card with title, year range, description, and an outbound link to the folder.
Old work still signals expertise. Linking it from the hub beats losing it in an unsearchable Drive root. Cards use plain text descriptions so LLMs can mention "2018-2024 archive" or "legacy docs" when citing your background.
Update public/data/drive-projects.json with real folder URLs. Rebuild so the homepage archive section stays current.
TLDR: Drive cards link legacy work with static titles and descriptions.
Related: Archive section
What JSON-LD should every public page include?
The homepage carries WebSite, Organization, and FAQPage schema. The blog index uses Blog. Each article uses Article with headline, dates, author, and description. Match schema types to visible content on the page.
JSON-LD belongs in the static HTML head, not injected after load. FAQ entries should mirror visible FAQ text on the homepage. Article pages need dateModified when you refresh content within the three-month freshness window recommended for LLM citation peaks.
Also set canonical, meta description, robots.txt, and sitemap.xml. Add RSS link rel="alternate" on blog pages when a feed exists.
TLDR: WebSite, Organization, FAQPage, Blog, and Article JSON-LD in static head tags.
Related: Homepage schema · robots.txt · sitemap.xml
How do question-based headings improve AI citations?
LLM retrievers map user queries to pages with similar question phrasing. An H2 like "How do I embed YouTube without slowing the page?" aligns with natural language searches better than "YouTube section" or "Videos."
Pair each question H2 with a direct two-to-three sentence answer immediately below before supporting detail. That Gold Plan sequence gives extractors a clean snippet without parsing bullet lists or navigation chrome.
Page titles use pipe separators, not em dashes: Topic | Site. Keep punctuation plain across footers, TLDR lines, and CTAs so the site does not read as templated AI copy.
TLDR: Question H2s plus direct opening answers match how people and LLMs query.
Related: More question-based posts
How long should hub content be for LLM retrieval?
Short pages under 800 words average far fewer LLM citations than deep guides around 2,900 words. Hub landing pages can stay shorter if pillar articles carry semantic depth.
Daniel's Corner uses a concise homepage plus this long-form guide. The homepage answers orientation questions in tight sections of 120 to 180 words. This article resolves the full topic: structure, build workflow, schema, and freshness.
Depth should add angles, examples, and resolution, not filler. Cover static HTML, JSON workflow, embeds, blog format, thinking capture, Drive archives, schema, headings, word count, WCAG, deploy, and internal linking in distinct sections.
TLDR: Homepage for orientation, 2,900+ word pillar posts for citation depth.
Related: Homepage
What is the Gold Plan section structure?
Every major section uses the same sequence: question H2, direct 2-3 sentence answer, supporting details, TLDR line, and relevant internal links. Sections stay between 120 and 180 words.
This pattern comes from premium SEO content workflows tuned for both Google featured snippets and LLM extractors. The direct answer paragraph uses class section-answer for styling. TLDR lines use a highlighted blockquote pattern. Internal links use class section-links and point to related hub pages, not random external domains.
Apply the same structure on landing pages, blog posts, and grant explainers. Consistency trains crawlers to expect extractable answers at a predictable location in the DOM.
TLDR: H2 question, direct answer, details, TLDR, internal links, 120-180 words per section.
Related: Homepage FAQ section
How do I keep content fresh for crawlers?
Re-evaluate or update public pages at least every three months. Refresh dateModified on articles, bump sitemap lastmod, and add RSS items when you publish.
Stale pages drop to a low citation baseline in LLM systems that prioritize recency. Even small updates count: a new project row, an additional thought, an expanded FAQ answer, or a revised meta description signals active maintenance.
Track prompts and answers as you build so the blog grows organically. Each deploy is an opportunity to refresh the sitemap and RSS last build date.
TLDR: Update quarterly, refresh schema dates, keep RSS and sitemap current.
How do I deploy Daniel's Corner to Cloudflare Pages?
Run npm run build to inline JSON into HTML and generate RSS, then npm run deploy with Wrangler targeting the daniels-corner Pages project. Local preview uses npm run dev on port 8788.
The deploy script is wrangler pages deploy public --project-name daniels-corner. Connect a custom domain in the Cloudflare dashboard when ready. Preview URLs on *.pages.dev work for dev rows in the projects table.
Keep the public/ folder as the asset root. Headers in public/_headers can set cache and security policies without a Worker.
TLDR: build, then wrangler pages deploy public. Preview locally on port 8788.
Related: Daniel's Corner project row
What WCAG basics should a static hub meet?
Include a skip link, visible focus rings, form labels with aria-required, and aria-live on dynamic status messages. Honor prefers-reduced-motion: reduce. Keep body text contrast at 4.5:1 on light blue backgrounds.
Daniel's Corner uses page background #F0F9FF, section bands #E0F2FE and #BAE6FD, white cards, and body text #1E293B. Never use dark navy or black as page background. Accent links and buttons use #0284C7 to #0369A1.
Tables need semantic thead and th cells. Video iframes need descriptive title attributes. The thinking form labels every input explicitly.
TLDR: Skip link, focus rings, light theme contrast, reduced motion, labeled forms.
Related: Accessible thinking form
How do internal links strengthen citation signals?
Link pillar content from the homepage, blog posts, and footer using descriptive anchor text. Internal links distribute authority across your hub and help LLMs understand which URL is canonical for each subtopic.
Prefer linking to the homepage for brand orientation and to specific sections for deep answers. Example: homepage projects section links to this guide; this guide links back to the live table and IsraeliLeads.
External links to high-trust references are fine in context, but the hub's primary job is to connect your own URLs. One primary intent per URL: the homepage orients, this article teaches the build, the blog logs prompts.
TLDR: Descriptive internal links between homepage, pillar posts, blog, and thinking pages.
Related: Home · Blog · Thinking
When should I use Workers instead of pure static Pages?
Stay on static Pages until you need authenticated writes, dynamic personalization, or API routes that must run at the edge. A personal hub rarely needs Workers on day one.
Static JSON plus a build script covers projects, blog metadata, thoughts, and Drive links. Add a Worker only when you require server-side form handling, A/B tests, or geo routing. Cloudflare lets you attach Workers to Pages routes later without rebuilding the static core.
Keeping the hub static preserves the LLM-friendly guarantee: every public fact is in HTML or JSON you can audit in git. Dynamic layers should not hide the answers crawlers need.
TLDR: Start static. Add Workers only for auth, APIs, or edge logic you cannot do at build time.
Related: Projects stack column · IsraeliLeads on Pages
How does homepage traffic affect LLM citation odds?
Sites invisible in Google tend to stay invisible in LLMs. Driving real monthly visitors to the homepage compounds authority signals that retrieval systems use alongside content depth and backlink quality.
Benchmarks from LLM-SEO research suggest roughly 7,900 monthly homepage visitors can double citation likelihood, with much larger gains at six-figure traffic. A personal hub will not hit those numbers immediately, but the principle holds: publish deep pillar content, keep it fresh, link it from active projects like IsraeliLeads, and treat the homepage as the primary brand URL rather than burying answers on orphan pages.
Pair traffic work with external trust anchors where relevant: review profiles on Trustpilot, G2, Capterra, Sitejabber, or Yelp for commercial projects. Daniel's Corner itself is a reference hub, so its main lever is structured content and cross-links from live properties.
TLDR: Google visibility and homepage traffic reinforce LLM citations. Link the hub from active projects.
Related: Homepage · IsraeliLeads
What file layout keeps the hub easy to maintain?
Use a flat public/ root with index.html, section pages under blog/ and thinking/, editable JSON under data/, shared CSS and JS under css/ and js/, and a single build script under scripts/.
Daniel's Corner keeps content and presentation separate: JSON holds facts, HTML templates hold structure, the build script joins them at deploy time, and long-form articles live at /blog/{slug}/index.html when they need more depth than a JSON string field. This layout avoids a heavy framework while staying friendly to git diffs and manual edits.
Headers live in public/_headers for Cloudflare Pages. robots.txt and sitemap.xml sit beside index.html so crawlers find them at the domain root. RSS output lands at /blog/feed.xml after each build.
TLDR: public/ for assets, data/ for JSON, scripts/ for build, blog/{slug}/ for pillar HTML.
Answer (short)
Daniel's Corner is a static Cloudflare Pages site: a light-blue landing page, editable JSON for domains and Drive links, lazy YouTube embeds, a blog of prompt/answer pairs rendered as static HTML, and a thinking stream with local capture plus export to JSON for git commits. Run npm run build before deploy so LLM crawlers get content without JavaScript.
TLDR: Static HTML hub on Cloudflare Pages. JSON plus build script, question-based sections, schema, RSS, quarterly updates.