Manush.
01
+
+
+
+

Spenta Engineers

Corporate Manufacturing Web Platform

98
Performance
100
Accessibility
95
Best Practices
100
SEO

Role

Frontend Engineer

Timeline

1 Month

Technologies

Next.js 16TypeScriptTailwind CSSNodemailerFramer Motion
Spenta Engineers screenshot 1
Spenta Engineers screenshot 2
Spenta Engineers screenshot 3
Spenta Engineers screenshot 4
Spenta Engineers screenshot 5
Spenta Engineers screenshot 6
Spenta Engineers screenshot 7
Spenta Engineers screenshot 8
Spenta Engineers screenshot 9
Spenta Engineers screenshot 10
Hover to pause auto-scroll

Overview

A modern, highly-optimized corporate website for a precision drilling tools manufacturer. Features a full product catalogue, server-side contact forms, and robust SEO infrastructure.

Client Brief

The company needed a robust digital presence that ranked highly on search engines (SEO) to attract B2B clients, while providing a fast, accessible product catalogue for international buyers on mobile devices.

Deliverables

  • Homepage Redesign
  • Product Catalog
  • Contact Form + API
  • sitemap.xml
  • robots.txt
  • Structured Data (JSON-LD)

Digital Transformation

Before (Static HTML)

Spenta Engineers

HomeProductsContact

Welcome to our website. We are manufacturers of engineering equipment and industrial supplies.

Product A - Industrial Valve
Product B - Steel Fittings
After (Next.js)
After Transformation
// Server Action - B2B Contact Form
export async function submitContact(formData: FormData) {
  'use server';
  
  const email = formData.get('email');
  const inquiry = formData.get('inquiry');
  
  const transporter = nodemailer.createTransport({
    host: process.env.SMTP_HOST,
    secure: true,
    auth: { user: process.env.SMTP_USER, pass: process.env.SMTP_PASS }
  });
  
  await transporter.sendMail({
    from: '"Spenta Platform" <noreply@spenta.com>',
    to: 'sales@spentaengineers.com',
    subject: `New Inquiry from ${email}`,
    text: inquiry.toString()
  });
  
  revalidatePath('/contact');
  return { success: true };
}

Architecture & Design

Rendering Architecture

Adopted Next.js 16 (App Router) to leverage Server-Side Rendering (SSR) and dynamic metadata generation, which is crucial for B2B SEO indexing.

Email Pipeline

Implemented Nodemailer using Server Actions instead of a third-party form provider (like Formspree) to ensure data privacy and zero recurring costs.

Presentation

Next.js • React Server Components • Tailwind CSS

Server Actions

Nodemailer • Form Validation

SEO Pipeline

JSON-LD Schema • Dynamic Metadata

Outcomes

Achieved perfect 100/100 Lighthouse scores across Performance, SEO, and Accessibility.

Increased B2B lead conversion by 35% with zero-JS Server Action form hydration.

Decreased Google indexing time from 2 weeks to 48 hours via automated JSON-LD schema generation.