Docs
Ongoing Tasks
ERP Crystal Website Migration

ERP Crystal Website Migration

📄 PRODUCT REQUIREMENTS DOCUMENT (PRD)

ERP Crystal Website Migration

Frontend: Next.js (React) + ShadCN UI
Backend: AWS Lambda (minimal)
Current Platform: Blazor Server
Target Domain: https://erpcrystal.in

1. Overview

1.1 Purpose

Migrate the existing ERP Crystal marketing website from Blazor Server to a modern, performant Next.js (React-based) web application using ShadCN UI, while preserving:

  • All existing pages, blogs, and URLs
  • SEO rankings and metadata
  • Analytics, tracking, and marketing pixels
  • UX behaviors such as scroll-to-section navigation
  • Content structure and hierarchy

The backend will be limited to AWS Lambda, used only for handling contact and demo request forms.

You can check the existing project at
👉 https://erpcrystal.in/

And all pages for reference at the sitemap:
👉 https://erpcrystal.in/sitemap

Local reference path:
👉 E:\homepage

1.2 Goals

  • Zero SEO regression
  • 100% URL and content parity
  • Polished, modern UI with micro-animations
  • Clean, scalable Next.js architecture
  • Minimal backend cost and complexity
  • Future-ready for CMS or content expansion

1.3 Non-Goals

  • No ERP application functionality
  • No authentication or dashboards
  • No CMS in Phase 1
  • No database usage

2. Technology Stack

2.1 Frontend

  • Next.js (App Router)
  • React 18
  • ShadCN UI (primary UI component system)
  • Radix UI (via ShadCN)
  • Tailwind CSS
  • Framer Motion (micro-animations & scroll effects)
  • Next.js Metadata API (SEO & metadata)
  • Swiper (React) (carousels)

❌ Removed:

  • Blazor
  • MudBlazor
  • Radzen
  • Alpine.js

2.2 Backend

  • AWS Lambda
  • API Gateway
  • Email Service (SES or SMTP)
  • Google reCAPTCHA v3 (Mandatory)

2.3 Hosting & Infra

  • Hosting platform supporting SSG/SSR (AWS Amplify)
  • HTTPS enforced
  • CDN caching
  • Edge-optimized delivery
  • No SPA fallback routing (handled natively by Next.js)

Recommended File Structure 

erpcrystal-home/
│
├── app/
│   ├── layout.tsx                 # Root layout (HTML, body, global scripts)
│   ├── page.tsx                   # Home page (SSG)
│   ├── globals.css                # Tailwind + global styles
│   ├── not-found.tsx              # 404 page
│
│   ├── sitemap/
│   │   └── page.tsx               # UI Sitemap page
│
│   ├── aboutus/
│   │   └── page.tsx
│
│   ├── request-demo/
│   │   └── page.tsx
│
│   ├── faq/
│   │   └── page.tsx
│
│   ├── privacy/
│   │   └── page.tsx
│
│   ├── cookies/
│   │   └── page.tsx
│
│   ├── credits/
│   │   └── page.tsx
│
│   ├── symphony-manufacturing-erp/
│   │   └── page.tsx
│   ├── production-management-erp/
│   │   └── page.tsx
│   ├── supply-chain-management-erp/
│   │   └── page.tsx
│   ├── inventory-management-erp/
│   │   └── page.tsx
│   ├── sales-and-order-management-erp/
│   │   └── page.tsx
│   ├── files-and-documents-management-erp/
│   │   └── page.tsx
│   ├── finance-management-erp/
│   │   └── page.tsx
│
│   ├── quantum-erp-for-trading/
│   │   └── page.tsx
│   ├── trading-orders-management-erp/
│   │   └── page.tsx
│   ├── trading-inventory-management-erp/
│   │   └── page.tsx
│   ├── trading-finance-management-erp/
│   │   └── page.tsx
│   ├── trading-vendor-management-erp/
│   │   └── page.tsx
│   ├── trading-cost-monitoring-erp/
│   │   └── page.tsx
│   ├── trading-files-and-docs-management-erp/
│   │   └── page.tsx
│
│   ├── synergy-housing-societies-erp/
│   │   └── page.tsx
│   ├── society-document-management-erp/
│   │   └── page.tsx
│   ├── society-maintenance-billing-erp/
│   │   └── page.tsx
│   ├── society-member-details-erp/
│   │   └── page.tsx
│   ├── society-nomination-register-erp/
│   │   └── page.tsx
│   ├── society-account-management-erp/
│   │   └── page.tsx
│   ├── society-visitor-tracking-erp/
│   │   └── page.tsx
│
│   ├── blogs/
│   │   ├── erp-for-manufacturing-guide/
│   │   │   └── page.tsx
│   │   ├── power-your-manufacturing-business-with-erp-software/
│   │   │   └── page.tsx
│   │   ├── smooth-living-smart-cooperative-society-software/
│   │   │   └── page.tsx
│   │   ├── how-erp-software-boosts-profit-trading-business/
│   │   │   └── page.tsx
│   │   ├── best-erp-software-for-trading-companies/
│   │   │   └── page.tsx
│   │   ├── better-way-run-factory-erp-software/
│   │   │   └── page.tsx
│   │   ├── stop-production-chaos-with-erp/
│   │   │   └── page.tsx
│   │   ├── is-your-warehouse-hiding-money/
│   │   │   └── page.tsx
│   │   ├── improve-manufacturing-workflow-with-erp/
│   │   │   └── page.tsx
│   │   ├── fix-vendor-list-with-quantum-erp/
│   │   │   └── page.tsx
│   │   ├── how-erp-crystal-simplifies-supply-chain-management/
│   │   │   └── page.tsx
│   │   └── simplify-housing-society-management/
│   │       └── page.tsx
│
│   └── api/
│       └── contact/
│           └── route.ts            # AWS Lambda proxy / API Gateway
│
├── components/
│   ├── ui/                         # ShadCN components
│   ├── layout/
│   │   ├── header.tsx
│   │   ├── footer.tsx
│   │   └── navbar.tsx
│   ├── animations/
│   │   ├── fade-in.tsx
│   │   └── slide-in.tsx
│   ├── forms/
│   │   └── contact-form.tsx
│   └── seo/
│       └── jsonld.tsx
│
├── hooks/
│   ├── use-scroll-restore.ts
│   └── use-recaptcha.ts
│
├── lib/
│   ├── constants.ts
│   ├── seo.ts
│   └── analytics.ts
│
├── public/
│   ├── erplogo.png
│   ├── icons/
│   └── images/
│
├── styles/
│   └── animations.css
│
├── .env.local
├── next.config.js
├── tailwind.config.js
├── postcss.config.js
├── tsconfig.json
└── package.json

3. Rendering Strategy & SEO Architecture (CRITICAL)

3.1 Why Next.js (Decision Rationale)

SEO is business-critical for ERP Crystal due to:

  • 25+ SEO-focused landing pages
  • 12 long-form blog articles
  • Heavy dependency on organic search traffic
  • Extensive structured data (JSON-LD)
  • Marketing and lead-generation pages

A pure React SPA (client-side rendering) is NOT sufficient because:

  • HTML content is not present on first load
  • SEO indexing is delayed and unreliable
  • Social previews and metadata may break
  • Core Web Vitals suffer

✅ Decision

The project SHALL use Next.js with Static Site Generation (SSG) as the primary rendering strategy.

This ensures:

  • Pre-rendered HTML for search engines
  • Faster page loads
  • Better crawlability
  • Stable SEO rankings
  • SPA-like navigation experience

3.2 Page Rendering Strategy

Page TypeRendering Mode
HomeStatic Site Generation (SSG)
ERP Vertical PagesStatic Site Generation (SSG)
Blog PagesStatic Site Generation (SSG)
Sitemap PageStatic Site Generation (SSG)
About / FAQ / LegalStatic Site Generation (SSG)
Contact / DemoStatic Site Generation (SSG)
Form SubmissionClient → AWS Lambda

3.3 SEO Acceptance Criteria

  • Page HTML must contain content on first response
  • <title>, <meta>, canonical rendered server-side
  • JSON-LD present in initial HTML
  • Social previews work without JS execution
  • Lighthouse SEO score ≥ 90

4. Information Architecture 

/
├── Home
├── Verticals
│ ├── Symphony ERP (Manufacturing)
│ ├── Quantum ERP (Trading)
│ └── Synergy ERP (Housing Societies)
├── Blogs
├── Resources
├── About
├── Contact / Request Demo
└── Legal Pages

5. Complete Page Inventory (Mandatory)

5.1 Core Pages

  • /
  • /aboutus
  • /request-demo
  • /faq
  • /privacy
  • /cookies
  • /credits
  • /sitemap

5.2 Symphony ERP (Manufacturing)

  1. /symphony-manufacturing-erp
  2. /production-management-erp
  3. /supply-chain-management-erp
  4. /inventory-management-erp
  5. /sales-and-order-management-erp
  6. /files-and-documents-management-erp
  7. /finance-management-erp

5.3 Quantum ERP (Trading)

  1. /quantum-erp-for-trading
  2. /trading-orders-management-erp
  3. /trading-inventory-management-erp
  4. /trading-finance-management-erp
  5. /trading-vendor-management-erp
  6. /trading-cost-monitoring-erp
  7. /trading-files-and-docs-management-erp

5.4 Synergy ERP (Housing Societies)

  1. /synergy-housing-societies-erp
  2. /society-document-management-erp
  3. /society-maintenance-billing-erp
  4. /society-member-details-erp
  5. /society-nomination-register-erp
  6. /society-account-management-erp
  7. /society-visitor-tracking-erp

5.5 Blog Pages (12)

  1. /erp-for-manufacturing-guide
  2. /power-your-manufacturing-business-with-erp-software
  3. /smooth-living-smart-cooperative-society-software
  4. /how-erp-software-boosts-profit-trading-business
  5. /best-erp-software-for-trading-companies
  6. /better-way-run-factory-erp-software
  7. /stop-production-chaos-with-erp
  8. /is-your-warehouse-hiding-money
  9. /improve-manufacturing-workflow-with-erp
  10. /fix-vendor-list-with-quantum-erp
  11. /how-erp-crystal-simplifies-supply-chain-management
  12. /simplify-housing-society-management

6. UI / UX Requirements

6.1 UI System

  • All components must be built using ShadCN UI
  • Tailwind used only for layout and spacing
  • Consistent typography, spacing, and color tokens

6.2 Micro-Animations

  • Button hover & press states
  • Card hover elevation
  • Section reveal animations
  • Subtle icon motion
  • Page transition smoothing

Library: Framer Motion

6.3 Scroll Animations

  • Section fade/slide-in on scroll
  • Parallax-like subtle effects (non-distracting)
  • Performance-first implementation

6.4 Navigation & Scroll-to-Section

Existing behavior must be preserved:

  • Navigation saves target hash in sessionStorage
  • URL does NOT expose hash
  • Scroll happens after route load

Next.js Requirement:

  • Custom client-side scroll restoration hook
  • Works across route transitions

7. SEO & Metadata (CRITICAL)

7.1 Per-Page SEO

Every page MUST define:

  • <title>
  • <meta name="description">
  • <link rel="canonical">
  • Exactly one <h1>

Canonical format:

https://erpcrystal.in/{route}/

7.2 Structured Data (JSON-LD)

Preserve existing schemas exactly:

  • WebSite
  • Organization
  • LocalBusiness
  • Product

Injected globally via <script type="application/ld+json">

7.3 Sitemap

  • UI sitemap page: /sitemap
  • XML sitemap generated separately
  • All pages indexable

8. Analytics & Tracking (No Regression Allowed)

8.1 Google Tag Manager

  • Container ID: GTM-MCFR8ZDB
  • Script + noscript required
  • Loaded once globally

8.2 Google Ads / gtag

  • ID: AW-16843708468
  • PageView fired on route change

8.3 Meta (Facebook) Pixel

  • Pixel ID: 1108986771417965
  • PageView fired on route change

8.4 Tracking Rules

  • Scripts loaded once
  • Manual page_view firing on route change
  • No duplicate events

9. Backend (AWS Lambda)

9.1 Forms Supported

  • Contact Us Form

Fields:

  • Name
  • Email
  • Phone
  • Message
  • Google reCAPTCHA v3 using react-google-recaptcha-v3 (MANDATORY)

9.2 Lambda Responsibilities

  • Input validation
  • reCAPTCHA verification
  • Email notification
  • Success / error response

❌ No database ❌ No user storage

10. Performance Requirements

  • Lighthouse SEO ≥ 90
  • Lighthouse Performance ≥ 85
  • No CLS issues
  • Lazy-load non-critical assets
  • No duplicate scripts

11. Migration Checklist

Pre-Launch

  • All URLs mapped
  • Canonicals verified
  • SEO meta parity confirmed
  • Structured data validated
  • GTM & pixels firing once
  • Scroll behavior tested
  • Blog content parity checked

Post-Launch

  • Submit sitemap to Search Console
  • Monitor 404 errors
  • Validate indexed pages
  • Compare analytics traffic

---

References

alt text https://www.ditiswatt.nl/ https://ventriloc.ca/fr/ https://www.agentvoice.com/ https://maze.co/?ref=landingfolio alt text

CHS Whats App API Setup-OldService Group Import