React makes great interfaces. Left at its defaults, though, a client-rendered app can send search engines an almost empty HTML page. Google can render JavaScript, but its own documentation describes a crawl, render and index process where rendering may be queued. Other crawlers and social preview bots often don't run JavaScript at all.
1. Choose the right rendering strategy
| Strategy | What the crawler gets | Good for |
|---|---|---|
| Client-side rendering (CSR) | Empty shell, content after JS runs | Dashboards behind login |
| Server-side rendering (SSR) | Full HTML on each request | Dynamic, public pages |
| Static generation (SSG) | Pre-built HTML | Blogs, docs, landing pages |
| Incremental / hybrid | Static + periodic refresh | Large catalogs |
Frameworks like Next.js, Remix and TanStack Start make SSR and SSG straightforward. For public content, aim to put meaningful HTML in the first response.
2. Get the metadata right on every page
- A unique
</code> and meta description per route.</li> <li>A canonical URL to avoid duplicate content.</li> <li>Open Graph and Twitter tags for link previews.</li> <li>Correct <code>lang</code> attribute and <code>hreflang</code> for multilingual sites.</li> </ul> <h2 id="3-use-real-links">3. Use real links</h2> <p>Google's guidelines say it follows <code><a href></code> links. A <code>div</code> with an <code>onClick</code> handler isn't a link to a crawler. Use your router's <code>Link</code> component, which renders a proper anchor.</p> <h2 id="4-add-structured-data">4. Add structured data</h2> <p>JSON-LD using schema.org types (Article, Product, FAQPage, BreadcrumbList) helps search engines understand your content and can qualify pages for rich results. Validate with Google's Rich Results Test.</p> <h2 id="5-treat-core-web-vitals-as-a-feature">5. Treat Core Web Vitals as a feature</h2> <p>Google uses page experience signals, including Core Web Vitals: <strong>LCP</strong> (loading), <strong>INP</strong> (responsiveness, which replaced FID in March 2024) and <strong>CLS</strong> (visual stability). For React apps that means:</p> <ul> <li>Code-split routes and lazy-load heavy components.</li> <li>Set image dimensions and use modern formats.</li> <li>Avoid long main-thread tasks during hydration.</li> </ul> <p>Steve Souders' <em>High Performance Web Sites</em> (O'Reilly, 2007) made the point years ago that most load time is spent on the front end, and it still applies.</p> <h2 id="6-handle-status-codes-properly">6. Handle status codes properly</h2> <p>Single-page apps often return <code>200</code> for missing pages ("soft 404s"). Return real <code>404</code> and <code>301</code> responses from the server where you can.</p> <h2 id="7-sitemaps-and-robotstxt">7. Sitemaps and robots.txt</h2> <p>Generate an XML sitemap from your routes, reference it in <code>robots.txt</code>, and don't block the JS and CSS files Google needs to render.</p> <h2 id="testing-toolkit">Testing toolkit</h2> <ul> <li>Google Search Console: URL Inspection</li> <li>Lighthouse and PageSpeed Insights</li> <li>Rich Results Test</li> <li>View source vs. inspect element (compare raw and rendered HTML)</li> </ul> <h2 id="final-thought">Final thought</h2> <p>JavaScript SEO is mostly about one idea: make sure crawlers see what users see, quickly. If your React site isn't getting the visibility it deserves, <a href="https://devaigo.com/">DevAiGo</a> can audit and fix it.</p> <h3 id="sources">Sources</h3> <ul> <li>Google Search Central, "Understand JavaScript SEO basics" (developers.google.com/search).</li> <li>Google, Core Web Vitals and INP documentation (web.dev).</li> <li>schema.org vocabulary.</li> <li>Steve Souders, <em>High Performance Web Sites</em>, O'Reilly, 2007.</li> </ul></div><section class="mt-14 pt-10 border-t border-border"><div class="flex items-center gap-2 mb-3"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles text-primary"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span class="text-xs font-mono font-bold uppercase tracking-wider text-primary">[ FAQ ACCORDION ]</span></div><h2 class="font-heading font-extrabold text-2xl sm:text-3xl text-foreground mb-6">Frequently Asked Questions</h2><div class="space-y-3"><div class="rounded-2xl border border-border/80 bg-card/70 overflow-hidden transition-all duration-200"><button type="button" class="w-full flex items-center justify-between p-4 sm:p-5 text-left font-heading font-bold text-sm sm:text-base text-foreground hover:bg-muted/30 transition-colors"><span>Can Google crawl and index client-side rendered (CSR) React apps?</span><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-primary shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="rounded-2xl border border-border/80 bg-card/70 overflow-hidden transition-all duration-200"><button type="button" class="w-full flex items-center justify-between p-4 sm:p-5 text-left font-heading font-bold text-sm sm:text-base text-foreground hover:bg-muted/30 transition-colors"><span>What is the best rendering method for React SEO?</span><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-primary shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="rounded-2xl border border-border/80 bg-card/70 overflow-hidden transition-all duration-200"><button type="button" class="w-full flex items-center justify-between p-4 sm:p-5 text-left font-heading font-bold text-sm sm:text-base text-foreground hover:bg-muted/30 transition-colors"><span>What Core Web Vitals matter most for React applications?</span><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-primary shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="rounded-2xl border border-border/80 bg-card/70 overflow-hidden transition-all duration-200"><button type="button" class="w-full flex items-center justify-between p-4 sm:p-5 text-left font-heading font-bold text-sm sm:text-base text-foreground hover:bg-muted/30 transition-colors"><span>Why should developers avoid soft 404s in SPAs?</span><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-primary shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div></div></section><div class="mt-14 p-6 sm:p-8 rounded-3xl border border-border/80 bg-gradient-to-br from-card/90 via-background to-card/90 backdrop-blur shadow-lg"><div class="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-6"><div class="flex items-center gap-4"><div class="w-16 h-16 rounded-2xl bg-gradient-to-tr from-primary via-blue-600 to-cyan text-primary-foreground flex items-center justify-center font-heading font-extrabold text-xl shadow-md">D</div><div><div class="text-[10px] font-mono font-bold uppercase tracking-widest text-primary mb-0.5">[ AUTHOR PROFILE ]</div><h3 class="font-heading font-bold text-base sm:text-lg text-foreground">Devaigo Editorial</h3><p class="text-xs sm:text-sm text-muted-foreground">AI & Software Architecture Desk</p></div></div><a class="inline-flex items-center gap-2 px-5 py-2.5 rounded-xl border border-border bg-card/80 hover:border-primary/50 hover:bg-primary/5 text-xs font-heading font-bold text-primary transition-all whitespace-nowrap" href="/roles"><span>Browse Engineering Roles</span><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div></div></div><aside class="hidden lg:block"><div class="sticky top-28 space-y-6"><nav class="rounded-2xl border border-border/80 bg-card/70 backdrop-blur p-5 shadow-sm" aria-label="Table of Contents"><p class="mb-3.5 flex items-center gap-2 text-xs font-mono font-bold uppercase tracking-wider text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-list-tree text-primary"><path d="M21 12h-8"></path><path d="M21 6H8"></path><path d="M21 18h-8"></path><path d="M3 6v4c0 1.1.9 2 2 2h3"></path><path d="M3 10v6c0 1.1.9 2 2 2h3"></path></svg>Table of Contents</p><ol class="max-h-[45vh] space-y-1.5 overflow-y-auto pr-1 text-xs scrollbar-thin"><li><a href="#1-choose-the-right-rendering-strategy" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">1. Choose the right rendering strategy</a></li><li><a href="#2-get-the-metadata-right-on-every-page" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">2. Get the metadata right on every page</a></li><li><a href="#3-use-real-links" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">3. Use real links</a></li><li><a href="#4-add-structured-data" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">4. Add structured data</a></li><li><a href="#5-treat-core-web-vitals-as-a-feature" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">5. Treat Core Web Vitals as a feature</a></li><li><a href="#6-handle-status-codes-properly" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">6. Handle status codes properly</a></li><li><a href="#7-sitemaps-and-robotstxt" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">7. Sitemaps and robots.txt</a></li><li><a href="#testing-toolkit" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">Testing toolkit</a></li><li><a href="#final-thought" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">Final thought</a></li><li><a href="#sources" class="block border-l-2 py-1 pl-3 leading-snug transition-colors border-transparent text-muted-foreground hover:border-border hover:text-foreground">Sources</a></li></ol><div class="mt-4 flex items-center justify-between border-t border-border/60 pt-3 text-[11px] font-mono text-muted-foreground"><span>0<!-- -->% READ</span><button type="button" class="inline-flex items-center gap-1 hover:text-primary transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg> Top</button></div></nav><div class="rounded-2xl border border-primary/30 bg-gradient-to-br from-primary/15 via-primary/5 to-cyan/10 p-5 shadow-lg relative overflow-hidden group"><div class="absolute top-0 right-0 w-28 h-28 bg-primary/20 rounded-full blur-2xl pointer-events-none"></div><div class="inline-flex items-center gap-1.5 text-[10px] font-mono font-bold uppercase tracking-wider text-primary mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg>Senior AI & Cloud Squads</div><h4 class="font-heading font-extrabold text-base text-foreground leading-snug mb-2">Building With This Architecture?</h4><p class="text-xs text-muted-foreground leading-relaxed mb-4">Devaigo matches you with vetted senior engineers (TypeScript, Python, Cloud & AI) in 48 hours. 30-day risk-free trial.</p><a class="w-full inline-flex items-center justify-center gap-2 py-2.5 px-4 rounded-xl bg-primary text-primary-foreground font-heading font-bold text-xs uppercase tracking-wider shadow-md hover:opacity-95 transition-all" href="/contact"><span>Request Squad Brief</span><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div><div class="p-4 rounded-2xl border border-border/80 bg-card/50 text-center"><span class="text-[11px] font-mono text-muted-foreground font-medium block mb-2.5">Share this engineering guide</span><div class="flex items-center justify-center gap-2"><button type="button" class="p-2 rounded-lg border border-border hover:border-primary/40 text-muted-foreground hover:text-primary transition-colors" aria-label="Share on LinkedIn"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-linkedin"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect width="4" height="12" x="2" y="9"></rect><circle cx="4" cy="4" r="2"></circle></svg></button><button type="button" class="p-2 rounded-lg border border-border hover:border-primary/40 text-muted-foreground hover:text-primary transition-colors" aria-label="Share on Twitter"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-twitter"><path d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z"></path></svg></button><button type="button" class="p-2 rounded-lg border border-border hover:border-primary/40 text-muted-foreground hover:text-primary transition-colors" aria-label="Copy Link"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link2"><path d="M9 17H7A5 5 0 0 1 7 7h2"></path><path d="M15 7h2a5 5 0 1 1 0 10h-2"></path><line x1="8" x2="16" y1="12" y2="12"></line></svg></button></div></div></div></aside></div></div><section class="mt-20 sm:mt-28 py-16 bg-muted/20 border-t border-border"><div class="container mx-auto px-4 sm:px-6 max-w-5xl"><div class="flex items-center justify-between mb-8 sm:mb-10"><div class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-open text-primary"><path d="M12 7v14"></path><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"></path></svg><h2 class="font-heading font-extrabold text-xl sm:text-2xl text-foreground">Related Engineering Articles</h2></div><a class="text-primary font-heading font-bold text-xs uppercase tracking-wider hover:underline inline-flex items-center gap-1" href="/blog"><span>All Articles</span><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div><div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6"><a class="group bg-card rounded-2xl border border-border/80 overflow-hidden hover:border-primary/40 hover:-translate-y-1 hover:shadow-xl transition-all duration-300 flex flex-col justify-between" href="/blog/how-to-earn-on-upwork-as-a-react-developer-a-practical-2024-guide"><div><div class="aspect-video w-full overflow-hidden bg-muted/40"><img src="/blog/freelance-3.jpg" alt="How to Earn on Upwork as a React Developer: A Practical 2024 Guide" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500" loading="lazy"/></div><div class="p-5"><div class="flex items-center justify-between gap-2 mb-2.5"><span class="text-[10px] font-mono uppercase px-2 py-0.5 rounded-full bg-primary/10 text-primary font-bold">Freelancing</span><span class="text-[11px] font-mono text-muted-foreground">9<!-- --> min</span></div><h3 class="font-heading font-bold text-sm sm:text-base text-foreground group-hover:text-primary transition-colors leading-snug">How to Earn on Upwork as a React Developer: A Practical 2024 Guide</h3></div></div><div class="p-5 pt-0 text-xs font-mono font-bold text-primary inline-flex items-center gap-1"><span>READ GUIDE</span><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right group-hover:translate-x-1 transition-transform"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></div></a><a class="group bg-card rounded-2xl border border-border/80 overflow-hidden hover:border-primary/40 hover:-translate-y-1 hover:shadow-xl transition-all duration-300 flex flex-col justify-between" href="/blog/how-to-hire-remote-react-developers-without-risk"><div><div class="aspect-video w-full overflow-hidden bg-muted/40"><img src="/blog/hiring-2.jpg" alt="How to Hire Remote React Developers Without Risk" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500" loading="lazy"/></div><div class="p-5"><div class="flex items-center justify-between gap-2 mb-2.5"><span class="text-[10px] font-mono uppercase px-2 py-0.5 rounded-full bg-primary/10 text-primary font-bold">Hiring</span><span class="text-[11px] font-mono text-muted-foreground">9<!-- --> min</span></div><h3 class="font-heading font-bold text-sm sm:text-base text-foreground group-hover:text-primary transition-colors leading-snug">How to Hire Remote React Developers Without Risk</h3></div></div><div class="p-5 pt-0 text-xs font-mono font-bold text-primary inline-flex items-center gap-1"><span>READ GUIDE</span><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right group-hover:translate-x-1 transition-transform"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></div></a><a class="group bg-card rounded-2xl border border-border/80 overflow-hidden hover:border-primary/40 hover:-translate-y-1 hover:shadow-xl transition-all duration-300 flex flex-col justify-between" href="/blog/how-to-earn-in-dollars-from-india-through-freelancing-a-strategic-guide"><div><div class="aspect-video w-full overflow-hidden bg-muted/40"><img src="/blog/freelance-1.jpg" alt="How to Earn in Dollars from India Through Freelancing: A Strategic Guide" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500" loading="lazy"/></div><div class="p-5"><div class="flex items-center justify-between gap-2 mb-2.5"><span class="text-[10px] font-mono uppercase px-2 py-0.5 rounded-full bg-primary/10 text-primary font-bold">Freelancing</span><span class="text-[11px] font-mono text-muted-foreground">8<!-- --> min</span></div><h3 class="font-heading font-bold text-sm sm:text-base text-foreground group-hover:text-primary transition-colors leading-snug">How to Earn in Dollars from India Through Freelancing: A Strategic Guide</h3></div></div><div class="p-5 pt-0 text-xs font-mono font-bold text-primary inline-flex items-center gap-1"><span>READ GUIDE</span><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right group-hover:translate-x-1 transition-transform"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></div></a></div></div></section><div class="mt-16"><section class="bg-background py-16 sm:py-20"><div class="container mx-auto px-4 sm:px-6"><div class="relative overflow-hidden rounded-[2rem] border border-border bg-gradient-to-br from-primary/5 via-background to-accent/70 px-6 py-10 shadow-sm sm:px-10 sm:py-14 animate-gradient-x" style="opacity:0;transform:translateY(30px)"><div class="absolute inset-0 overflow-hidden pointer-events-none "><div class="absolute -top-20 -right-20 w-[400px] h-[400px] rounded-full bg-gradient-to-br from-primary/8 to-cyan/5 blur-3xl"></div><div class="absolute -bottom-32 -left-20 w-[350px] h-[350px] rounded-full bg-gradient-to-tr from-cyan/6 to-primary/4 blur-3xl"></div><div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[500px] h-[500px] rounded-full bg-primary/[0.03] blur-3xl"></div><div class="absolute inset-0 opacity-[0.015] dark:opacity-[0.03]" style="background-image:linear-gradient(hsl(var(--primary)) 1px, transparent 1px), linear-gradient(90deg, hsl(var(--primary)) 1px, transparent 1px);background-size:80px 80px"></div></div><div class="relative z-10 mx-auto max-w-2xl text-center"><p class="mb-4 text-xs font-semibold uppercase tracking-[0.18em] text-primary">READY TO BUILD?</p><h2 class="font-heading text-3xl font-extrabold leading-tight text-foreground sm:text-4xl">Assemble Your Dedicated AI & Engineering Squad in 48 Hours</h2><p class="mt-4 text-sm leading-relaxed text-muted-foreground sm:text-base">Receive 3 pre-vetted senior profiles matched precisely to your technical requirements. 30-day risk-free trial.</p><div class="mt-8 flex flex-col justify-center gap-3 sm:flex-row"><a class="group inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-7 py-3.5 text-sm font-semibold text-primary-foreground transition-all hover:-translate-y-0.5 hover:opacity-95 hover:shadow-glow" href="/contact">Request Squad Proposal<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right transition-transform group-hover:translate-x-1"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a><a class="inline-flex items-center justify-center rounded-xl border border-border bg-background/80 px-7 py-3.5 text-sm font-semibold text-foreground transition-all hover:-translate-y-0.5 hover:border-primary/30 hover:text-primary" href="/services">Explore Delivery Models</a></div></div></div></div></section></div></main><footer class="relative overflow-hidden border-t border-primary-foreground/10 bg-navy-mesh text-primary-foreground"><div class="container relative z-10 mx-auto px-4 pb-[calc(6rem+env(safe-area-inset-bottom))] pt-12 sm:px-6 sm:pb-12 sm:pt-16"><div class="mb-12 grid items-center gap-7 border-b border-primary-foreground/15 pb-10 lg:grid-cols-[0.8fr_1.2fr] lg:gap-14"><div><p class="mb-2 text-xs font-bold uppercase tracking-[0.18em] text-primary">Stay ahead</p><h2 class="font-heading text-2xl font-extrabold leading-tight sm:text-3xl">Ideas, engineering insights, and practical AI.</h2><p class="mt-3 max-w-lg text-sm leading-relaxed text-primary-foreground/65">One useful update each month. No noise, and you can unsubscribe anytime.</p></div><div class="lg:justify-self-end lg:w-full lg:max-w-xl"><form class="flex flex-col sm:flex-row gap-2 max-w-md"><input type="email" required="" placeholder="Your email address" class="flex-1 px-4 py-2.5 rounded-lg border border-border bg-background text-sm focus:outline-none focus:ring-2 focus:ring-primary/40" value=""/><button type="submit" class="inline-flex items-center justify-center gap-1.5 px-4 py-2.5 rounded-lg bg-primary text-primary-foreground text-sm font-semibold hover:opacity-90 disabled:opacity-60">Subscribe<!-- --> <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></button></form><a class="mt-4 inline-flex items-center gap-2 text-sm font-bold text-primary hover:opacity-80" href="/contact">Or discuss your project <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div></div><div class="grid grid-cols-2 gap-x-7 gap-y-10 lg:grid-cols-[1.35fr_repeat(3,1fr)] lg:gap-12"><div class="col-span-2 lg:col-span-1"><a class="mb-5 inline-flex rounded-lg bg-primary-foreground p-2" aria-label="Devaigo home" href="/"><img src="/_next/static/media/devaigo-logo.e087aeaf.webp" alt="Devaigo" width="133" height="36" class="h-9 w-auto"/></a><p class="max-w-sm text-sm leading-relaxed text-primary-foreground/65">Devaigo helps startups and businesses design, build, launch, and scale reliable websites, web applications, and mobile apps with modern technology and transparent engineering.</p><ul class="mt-6 space-y-3 text-sm text-primary-foreground/70"></ul></div><nav aria-label="Services footer links"><h3 class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-primary-foreground/50">Services</h3><ul class="space-y-3"><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services/web-app-development">Website Development</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services/mobile-app-development">Mobile App Development</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services/custom-software-development">Web Applications & SaaS</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services/ui-ux-design">UI/UX Design & Prototyping</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services/cloud-devops">Cloud & DevOps Solutions</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services">All Services</a></li></ul></nav><nav aria-label="Solutions footer links"><h3 class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-primary-foreground/50">Solutions</h3><ul class="space-y-3"><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/portfolio">Portfolio Showcase</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/services/custom-software-development">MVP for Startups</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/hire-developers">Hire Developers</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/industries">Industries</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/technology-partners">Technology Partners</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/resources">Case Studies</a></li></ul></nav><nav aria-label="Company footer links"><h3 class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-primary-foreground/50">Company</h3><ul class="space-y-3"><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/about">About Us</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/why-devaigo">Why Devaigo</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/careers">Careers</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/blog">Blog</a></li><li><a class="text-sm leading-relaxed text-primary-foreground/70 transition-colors hover:text-primary" href="/contact">Contact Us</a></li></ul></nav></div><div class="mt-12 flex flex-col items-center justify-between gap-4 border-t border-primary-foreground/15 pt-7 text-center text-xs text-primary-foreground/50 sm:flex-row sm:text-left"><p>© 2026 Devaigo. All rights reserved.</p><div class="flex flex-wrap items-center justify-center gap-5"><a class="hover:text-primary-foreground" href="/privacy">Privacy Policy</a><a class="hover:text-primary-foreground" href="/terms">Terms of Service</a><a class="hover:text-primary-foreground" href="/cookies">Cookies</a><a href="/llms.txt" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 font-mono text-[11px] text-cyan hover:underline"><span class="inline-block w-1.5 h-1.5 rounded-full bg-cyan animate-pulse"></span>GEO llms.txt</a><a href="/sitemap.xml" target="_blank" rel="noopener noreferrer" class="font-mono text-[11px] text-primary-foreground/60 hover:text-primary-foreground">sitemap.xml</a></div></div></div></footer></div></div><script>$RS=function(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};$RS("S:1","P:1")</script><script>$RB=[];$RV=function(a){$RT=performance.now();for(var b=0;b<a.length;b+=2){var c=a[b],e=a[b+1];null!==e.parentNode&&e.parentNode.removeChild(e);var f=c.parentNode;if(f){var g=c.previousSibling,h=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d||"/&"===d)if(0===h)break;else h--;else"$"!==d&&"$?"!==d&&"$~"!==d&&"$!"!==d&&"&"!==d||h++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;e.firstChild;)f.insertBefore(e.firstChild,c);g.data="$";g._reactRetry&&requestAnimationFrame(g._reactRetry)}}a.length=0}; $RC=function(a,b){if(b=document.getElementById(b))(a=document.getElementById(a))?(a.previousSibling.data="$~",$RB.push(a,b),2===$RB.length&&("number"!==typeof $RT?requestAnimationFrame($RV.bind(null,$RB)):(a=performance.now(),setTimeout($RV.bind(null,$RB),2300>a&&2E3<a?2300-a:$RT+300-a)))):b.parentNode.removeChild(b)};$RC("B:0","S:0")</script></body></html>