skills.rest
JohannesKonings
JohannesKoningsCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

tanstack-website

Configure TanStack websites and blogs with official documentation and tooling.

1|Updated Aug 1, 2020
Search Tags:#tanstack#devtools#website development#documentation search#seo optimization#static site generation#app scaffolding
One-click install
npx skills add https://github.com/JohannesKonings/JohannesKonings.github.io --skill tanstack-website
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-website
Source: https://github.com/JohannesKonings/JohannesKonings.github.io/tree/main/.cursor/skills/tanstack-website
Command: npx skills add https://github.com/JohannesKonings/JohannesKonings.github.io --skill tanstack-website

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill eliminates the risk of inaccurate TanStack implementation and misconfigured TanStack website/blog setups, which often lead to broken builds, poor search visibility, and incorrect use of TanStack APIs and tooling.

Core Features & Use Cases

  • Official TanStack Docs & Tooling Access: Use the dedicated TanStack MCP to accurately search documentation, fetch full API pages, list available libraries, and scaffold new TanStack applications without relying on generic, potentially outdated web search results.
  • TanStack Website & Blog Configuration: Properly set up static content routes, SSG/static export for blog posts, and content source configuration for TanStack-powered blogs and websites.
  • SEO & Agent Access Optimization: Implement required SEO elements (meta tags, structured data, sitemaps, canonical URLs) and machine-readable metadata to improve search engine ranking and AI agent accessibility.
  • TanStack DevTools Integration: Correctly add applicable development tools (like Router DevTools) for local debugging, while properly gating or stripping them from production builds to avoid performance overhead.
  • Use Case Example: If you are building a TanStack Start blog, use this skill to fetch the correct routing API documentation, set up static post routes, add SEO meta tags for each blog post, and enable Router DevTools for local route debugging.

Quick Start

Use the tanstack-website skill to build a new TanStack Start blog with optimized SEO, static post exports, and Router DevTools enabled for local development.

Frequently Asked Questions about tanstack-website

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a TanStack Start blog with static site generation?▼

To scaffold a TanStack Start blog with static site generation, you configure static content routes and set up SSG static export for blog posts. This ensures your TanStack website serves pre-rendered content efficiently without server overhead.

How do I add SEO meta tags and structured data to a TanStack website?▼

Adding SEO meta tags to a TanStack website involves implementing required SEO elements like canonical URLs and sitemaps. This optimizes your TanStack website content for search engine ranking and AI agent accessibility.

What is the best way to access official TanStack documentation during development?▼

The best way to access official TanStack documentation is using dedicated tooling to search docs and fetch full API pages directly. This avoids outdated web search results and ensures accurate TanStack API implementation.

How do I configure TanStack Router DevTools for local debugging without affecting production builds?▼

To configure TanStack Router DevTools without impacting production, you add the tools for development while gating or stripping them from production builds. This avoids performance overhead in your TanStack app.

Why does my TanStack implementation use outdated API references and how can I prevent it?▼

Your TanStack implementation uses outdated API references when relying on generic web searches instead of official sources. Prevent this by fetching up-to-date TanStack API references directly through dedicated documentation tooling.

Does this approach work for optimizing machine-readable metadata on static TanStack blogs?▼

Yes, this approach optimizes machine-readable metadata on static TanStack blogs by implementing required SEO elements and structured data. This improves AI agent accessibility and search engine visibility for your content.

Related Skills

Explore More Software Engineering Skills→
cdrgurucdrguru
1

gemini-cli-init

Initialize Gemini CLI configuration and auditor persona for the PACK workflow.

Community
Intermediate
coopersimson96coopersimson96
12

seo-sitemap

Validate or generate XML sitemaps for SEO compliance and indexing.

Community
Intermediate
leejayhsuleejayhsu

TanStack Router

Implement type-safe, file-based React routing with TanStack Router.

Community
Advanced
resetreset

seo-audit

Audit and fix technical and content SEO for Zola, Hugo, 11ty, and Astro sites.

Community
Intermediate