Easy Implementation

Vue.js Implementation

Implement GEO in Vue.js with Nuxt.js SSR and static generation

Vue.js with Nuxt.js for GEO

Nuxt.js provides excellent support for GEO with server-side rendering and API routes

Nuxt.js Features:

  • • Server-side rendering (SSR)
  • • Static site generation (SSG)
  • • API routes with server/api
  • • Built-in TypeScript support
  • • Automatic optimization

GEO Benefits:

  • • Server-side API endpoints
  • • Static generation for performance
  • • Easy deployment to Vercel/Netlify
  • • Built-in caching and headers
  • • SEO-friendly by default

Step 1: Create GEO Config API Route

Set up the main GEO configuration endpoint

Step 2: Create AI Summary Endpoint

Implement the AI summary endpoint

server/api/ai/summary.json.get.tstypescript💚 Nuxt.js
1export default defineEventHandler(async (event) => {
2 const summary = {
3 version: "1.0",
4 lastModified: new Date().toISOString(),
5 summary: "Your Nuxt.js app provides [services] to [audience] with [benefits]. Built with Nuxt.js 3 and Vue 3 for optimal performance and SEO.",
6 keyFeatures: [
7 "Nuxt.js framework",
8 "Vue 3",
9 "Server API",
10 "Auto-imports",
11 "TypeScript support"
12 ],
13 targetAudience: [
14 "Vue developers",
15 "Full-stack developers",
16 "Progressive web app developers"
17 ],
18 primaryUseCases: [
19 "Progressive web apps",
20 "SSR applications",
21 "Static sites",
22 "E-commerce"
23 ]
24 };
25
26 setHeader(event, 'Content-Type', 'application/json');
27 setHeader(event, 'Cache-Control', 'public, max-age=86400, stale-while-revalidate=604800');
28
29 return summary;
30});

Step 3: Create AI.txt Endpoint

Set up the AI crawler permissions endpoint

server/api/.well-known/ai.txt.get.tstypescript💚 Nuxt.js
1export default defineEventHandler(async (event) => {
2 const aiTxt = `# AI.txt for yoursite.com
3# This file specifies which JSON endpoints are accessible to AI crawlers
4
5User-agent: *
6Allow: /ai/faq.json
7Allow: /ai/service.json
8Allow: /ai/summary.json
9
10# Last updated: ${new Date().toISOString().split('T')[0]}`;
11
12 setHeader(event, 'Content-Type', 'text/plain; charset=utf-8');
13 setHeader(event, 'Cache-Control', 'public, max-age=86400, stale-while-revalidate=604800');
14
15 return aiTxt;
16});

Step 4: Create FAQ Endpoint

Add frequently asked questions for AI systems

server/api/ai/faq.json.get.tstypescript💚 Nuxt.js
1export default defineEventHandler(async (event) => {
2 const faq = {
3 version: "1.0",
4 lastModified: new Date().toISOString(),
5 faqs: [
6 {
7 question: "What is this Nuxt.js app about?",
8 answer: "This is a [service type] built with Nuxt.js that helps [audience] with [benefits]."
9 },
10 {
11 question: "What technologies are used?",
12 answer: "This app is built with Nuxt.js 3, Vue 3, TypeScript, and modern web standards."
13 },
14 {
15 question: "How can I get started?",
16 answer: "Visit our documentation or contact us for more information about our services."
17 }
18 ]
19 };
20
21 setHeader(event, 'Content-Type', 'application/json');
22 setHeader(event, 'Cache-Control', 'public, max-age=86400, stale-while-revalidate=604800');
23
24 return faq;
25});

Step 5: Create Service Endpoint

Define your service capabilities and endpoints

server/api/ai/service.json.get.tstypescript💚 Nuxt.js
1export default defineEventHandler(async (event) => {
2 const service = {
3 version: "1.0",
4 lastModified: new Date().toISOString(),
5 service: {
6 name: "Your Nuxt.js App",
7 type: "web-application",
8 description: "A modern web application built with Nuxt.js",
9 url: "https://yoursite.com",
10 capabilities: [
11 "Server-side rendering",
12 "Static generation",
13 "API routes",
14 "Auto-imports"
15 ],
16 endpoints: {
17 "home": "/",
18 "about": "/about",
19 "contact": "/contact",
20 "api": "/api"
21 },
22 supportedFrameworks: ["Nuxt.js", "Vue 3", "TypeScript"],
23 contact: {
24 "email": "contact@yoursite.com",
25 "documentation": "https://yoursite.com/docs"
26 },
27 pricing: "free",
28 availability: "24/7"
29 }
30 };
31
32 setHeader(event, 'Content-Type', 'application/json');
33 setHeader(event, 'Cache-Control', 'public, max-age=86400, stale-while-revalidate=604800');
34
35 return service;
36});

Step 6: Create Robots.txt Endpoint

Set up general crawler permissions and AI crawler access

server/api/robots.txt.get.tstypescript💚 Nuxt.js
1export default defineEventHandler(async (event) => {
2 const robots = `# Allow legitimate search engines and AI crawlers
3User-agent: Googlebot
4Allow: /
5
6User-agent: Bingbot
7Allow: /
8
9User-agent: Slurp
10Allow: /
11
12User-agent: DuckDuckBot
13Allow: /
14
15User-agent: Baiduspider
16Allow: /
17
18User-agent: YandexBot
19Allow: /
20
21# Allow AI crawlers for GEO content
22User-agent: GPTBot
23Allow: /
24
25User-agent: ChatGPT-User
26Allow: /
27
28User-agent: CCBot
29Allow: /
30
31User-agent: anthropic-ai
32Allow: /
33
34User-agent: Claude-Web
35Allow: /
36
37# Allow social media crawlers
38User-agent: facebookexternalhit
39Allow: /
40
41User-agent: Twitterbot
42Allow: /
43
44User-agent: LinkedInBot
45Allow: /
46
47# Block suspicious bots and scrapers
48User-agent: *
49Disallow: /api/
50Disallow: /_nuxt/
51Disallow: /admin/
52Disallow: /private/
53Disallow: /*.json$
54Disallow: /*?*
55
56# Block common bad bots
57User-agent: AhrefsBot
58Disallow: /
59
60User-agent: MJ12bot
61Disallow: /
62
63User-agent: DotBot
64Disallow: /
65
66User-agent: SemrushBot
67Disallow: /
68
69User-agent: BLEXBot
70Disallow: /
71
72User-agent: DataForSeoBot
73Disallow: /
74
75User-agent: MegaIndex
76Disallow: /
77
78User-agent: PetalBot
79Disallow: /
80
81User-agent: AspiegelBot
82Disallow: /
83
84User-agent: SeoCheckBot
85Disallow: /
86
87User-agent: SeoBot
88Disallow: /
89
90User-agent: SeobilityBot
91Disallow: /
92
93User-agent: SiteAuditBot
94Disallow: /
95
96User-agent: Siteimprove
97Disallow: /
98
99User-agent: SiteLockSpider
100Disallow: /
101
102User-agent: SiteSucker
103Disallow: /
104
105User-agent: Sogou
106Disallow: /
107
108User-agent: spbot
109Disallow: /
110
111User-agent: SurveyBot
112Disallow: /
113
114User-agent: TurnitinBot
115Disallow: /
116
117User-agent: Vagabondo
118Disallow: /
119
120User-agent: VelenPublicWebCrawler
121Disallow: /
122
123User-agent: WebDataStats
124Disallow: /
125
126User-agent: WebEnhancer
127Disallow: /
128
129User-agent: WebStripper
130Disallow: /
131
132User-agent: WebSauger
133Disallow: /
134
135User-agent: WebZIP
136Disallow: /
137
138User-agent: WotBox
139Disallow: /
140
141User-agent: Wprecon
142Disallow: /
143
144User-agent: Xaldon_WebSpider
145Disallow: /
146
147Sitemap: https://yoursite.com/sitemap-llm.xml`;
148
149 setHeader(event, 'Content-Type', 'text/plain');
150 setHeader(event, 'Cache-Control', 'public, max-age=86400, stale-while-revalidate=604800');
151
152 return robots;
153});

Step 7: Create Sitemap-LLM.xml Endpoint

Create an LLM-optimized sitemap that includes all GEO endpoints

server/api/sitemap-llm.xml.get.tstypescript💚 Nuxt.js
1export default defineEventHandler(async (event) => {
2 const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
3<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
4 <!-- Main site pages -->
5 <url>
6 <loc>https://yoursite.com/</loc>
7 <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
8 <changefreq>weekly</changefreq>
9 <priority>1.0</priority>
10 </url>
11
12 <!-- GEO Contract Endpoints -->
13 <url>
14 <loc>https://yoursite.com/.well-known/ai.txt</loc>
15 <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
16 <changefreq>monthly</changefreq>
17 <priority>0.8</priority>
18 </url>
19 <url>
20 <loc>https://yoursite.com/ai/summary.json</loc>
21 <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
22 <changefreq>weekly</changefreq>
23 <priority>0.8</priority>
24 </url>
25 <url>
26 <loc>https://yoursite.com/ai/faq.json</loc>
27 <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
28 <changefreq>monthly</changefreq>
29 <priority>0.7</priority>
30 </url>
31 <url>
32 <loc>https://yoursite.com/ai/service.json</loc>
33 <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
34 <changefreq>monthly</changefreq>
35 <priority>0.7</priority>
36 </url>
37
38 <!-- Other site pages -->
39 <url>
40 <loc>https://yoursite.com/docs</loc>
41 <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
42 <changefreq>weekly</changefreq>
43 <priority>0.9</priority>
44 </url>
45</urlset>`;
46
47 setHeader(event, 'Content-Type', 'application/xml');
48 setHeader(event, 'Cache-Control', 'public, max-age=86400, stale-while-revalidate=604800');
49
50 return sitemap;
51});