fix: improve SEO with pre-rendering and dynamic meta tags

Critical SEO improvements to fix Google Search Console indexing:

## Sitemap Updates:
- Added missing Invoice Editor and What's New pages
- Updated all lastmod dates to 2025-10-15
- Increased editor tools priority to 0.9
- Added organizational comments
- Fixed /whats-new route (was /release-notes)

## Pre-rendering Implementation:
- Added react-snap for static HTML generation
- Configured to pre-render all tool pages
- Solves React SPA indexing issue
- Crawlers now see full HTML content

## Dynamic Meta Tags:
- Added react-helmet-async for SEO management
- Created reusable SEO component with:
  - Dynamic titles and descriptions
  - Open Graph tags (Facebook)
  - Twitter Card tags
  - JSON-LD structured data
  - Canonical URLs
- Wrapped App with HelmetProvider
- Added SEO to Home page

## Route Fixes:
- Added /whats-new route (primary)
- Kept /release-notes as fallback
- Consistent routing across app

## Documentation:
- Created comprehensive SEO_FIX_GUIDE.md
- Step-by-step Google Search Console instructions
- Troubleshooting guide
- Timeline expectations
- Testing procedures

These changes will dramatically improve Google indexing and search visibility.
This commit is contained in:
dwindown
2025-10-15 10:01:48 +07:00
parent f60c1d16c8
commit f6c19e855d
7 changed files with 1670 additions and 98 deletions

View File

@@ -1,5 +1,6 @@
import React, { useEffect } from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import { HelmetProvider } from 'react-helmet-async';
import Layout from './components/Layout';
import ErrorBoundary from './components/ErrorBoundary';
import Home from './pages/Home';
@@ -30,31 +31,34 @@ function App() {
}, []);
return (
<ErrorBoundary>
<Router>
<Layout>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/json" element={<JsonTool />} />
<Route path="/serialize" element={<SerializeTool />} />
<Route path="/url" element={<UrlTool />} />
<Route path="/base64" element={<Base64Tool />} />
<Route path="/csv-json" element={<CsvJsonTool />} />
<Route path="/beautifier" element={<BeautifierTool />} />
<Route path="/diff" element={<DiffTool />} />
<Route path="/text-length" element={<TextLengthTool />} />
<Route path="/object-editor" element={<ObjectEditor />} />
<Route path="/table-editor" element={<TableEditor />} />
<Route path="/invoice-editor" element={<InvoiceEditor />} />
<Route path="/invoice-preview" element={<InvoicePreview />} />
<Route path="/invoice-preview-minimal" element={<InvoicePreviewMinimal />} />
<Route path="/release-notes" element={<ReleaseNotes />} />
<Route path="/privacy" element={<PrivacyPolicy />} />
<Route path="/terms" element={<TermsOfService />} />
</Routes>
</Layout>
</Router>
</ErrorBoundary>
<HelmetProvider>
<ErrorBoundary>
<Router>
<Layout>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/json" element={<JsonTool />} />
<Route path="/serialize" element={<SerializeTool />} />
<Route path="/url" element={<UrlTool />} />
<Route path="/base64" element={<Base64Tool />} />
<Route path="/csv-json" element={<CsvJsonTool />} />
<Route path="/beautifier" element={<BeautifierTool />} />
<Route path="/diff" element={<DiffTool />} />
<Route path="/text-length" element={<TextLengthTool />} />
<Route path="/object-editor" element={<ObjectEditor />} />
<Route path="/table-editor" element={<TableEditor />} />
<Route path="/invoice-editor" element={<InvoiceEditor />} />
<Route path="/invoice-preview" element={<InvoicePreview />} />
<Route path="/invoice-preview-minimal" element={<InvoicePreviewMinimal />} />
<Route path="/whats-new" element={<ReleaseNotes />} />
<Route path="/release-notes" element={<ReleaseNotes />} />
<Route path="/privacy" element={<PrivacyPolicy />} />
<Route path="/terms" element={<TermsOfService />} />
</Routes>
</Layout>
</Router>
</ErrorBoundary>
</HelmetProvider>
);
}