Arratech AB
End-to-end design-to-code development of a high-performance enterprise website for Arratech, a Swedish B2B SaaS company connecting businesses to the Peppol e-invoicing network. Built as a decoupled architecture – a server-rendered Next.js 16 frontend paired with a fully custom Sanity Studio CMS – deployed on AWS serverless infrastructure.
Corporate Website • Figma-to-Code Development • CMS Architecture
Arratech AB is a certified Peppol Authority providing Access Point and SMP services to governments, enterprises, and software vendors across Europe. They needed a website that matched the caliber of their infrastructure – fast, secure, enterprise-grade, and fully manageable by their content team without developer intervention.
I architected and built their entire web platform from the ground up: a Next.js 16 application powered by React 19 Server Components, a fully decoupled Sanity Studio CMS with 19 reusable section types, a custom GDPR consent management system, structured data for SEO, and a serverless deployment pipeline on AWS Amplify Gen 2 with CloudFront CDN delivery.
The project demanded an intersection of strict technical constraints rarely found together: enterprise-grade security with nonce-based Content Security Policy headers, GDPR-compliant cookie consent that gates all analytics before any tracking pixel fires, structured SEO metadata with JSON-LD schemas meeting Google’s rich-result requirements, and a content model flexible enough for 19 distinct section types that non-technical editors could compose freely – all deployed as a serverless Lambda function on AWS infrastructure where Next.js 16 standalone mode required undocumented workarounds for environment variable injection.
Performance was non-negotiable. The site needed to render in under two seconds on mobile while loading Google Tag Manager, HubSpot tracking, reCAPTCHA, and a full consent management layer – without sacrificing any Core Web Vitals score.
I adopted a strict Server Components-first architecture – every page, layout, and data-fetching layer renders on the server.
Client-side JavaScript is isolated to interactive islands only: forms, consent dialogs, and analytics scripts. This approach slashes bundle size and delivers near-instant page loads.
< 1s
Cache Refresh
19+
Reusable Sections
50+
Schema Definitions
Performance
100%
Best Practices
100%
SEO
100%
Full-stack frontend built with Next.js 16 and React 19 Server Components. 19 section types, Zod-validated data layer, tag-based ISR caching, and serverless AWS Lambda deployment.
Custom GDPR consent manager with server-side cookie enforcement. Nonce-based CSP headers via proxy. reCAPTCHA-protected forms with consent-aware marketing tracking.
Designed and built a complete Sanity Studio content platform with structured schemas, reusable sections, blog system with filtering and pagination, and webhook cache revalidation.
Automated metadata with 3-tier fallback extraction. JSON-LD structured data for Organization, WebPage, and BlogPosting. Dynamic sitemap, image optimization with AVIF/WebP, and CloudFront edge delivery.
Let’s discuss requirements, timelines, and technical direction to determine the right approach for building a reliable, high-performance solution.