Cornix Australia

Arvin • January 13, 2026

Sep - Dec 2025 (3 months) FullStack WorkFlow Analytics Deployment Payment

Premium Split Keyboard Landing Page

A sophisticated e-commerce landing page for premium Cornix split keyboards. Built a fully accessible, high-performance product showcase with integrated payments and real-time analytics.

Tech Stack Details

Frontend: React, TypeScript, Tailwind CSS 4, Inertia.js
Backend: Laravel, MySQL, Redis, Filament (admin)
Infrastructure: Cloudflare CDN, Laraforge deployment
Integrations: Stripe payments, Pan analytics
Tools: GitHub, Slack

The Challenge

Create a conversion-optimized landing page that would:

  • Handle secure payments through Stripe
  • Meet 100% accessibility standards
  • Deliver exceptional performance globally
  • Track user behavior for optimization
  • Scale for international traffic

My Role

Frontend Development
Built the entire React + TypeScript interface with Inertia.js bridging Laravel backend

Performance Engineering
Implemented Cloudflare CDN, optimized asset loading (WebP/AVIF), and lazy loading strategies that reduced load times by 60%

Accessibility Implementation
Achieved 100% WCAG compliance through semantic HTML, ARIA attributes, and comprehensive keyboard navigation

Payment Integration
Integrated Stripe checkout with webhook handling, idempotent design, and multi-state payment processing

Analytics Setup
Configured Pan analytics to track conversion funnels and user engagement patterns

The Solution

Leveraged Inertia.js to seamlessly connect React's component architecture with Laravel's backend, eliminating the complexity of traditional API development. This allowed rapid iteration while maintaining type safety through TypeScript.

Implemented a multi-layered performance strategy: Cloudflare's edge network for global delivery, Redis for database caching, and modern image formats with lazy loading for optimal initial paint times.

Built accessibility from the ground up rather than retrofitting—semantic HTML structure, proper heading hierarchy, and full keyboard navigation ensured the experience worked for all users.

Results

✅ 100% WCAG Accessibility - Full compliance with proper semantic HTML and ARIA support
✅ 60% Faster Load Times - Through combined CDN, caching, and asset optimization
✅ Seamless Payments - Zero failed transactions with proper webhook error handling
✅ Production Ready - Launched on schedule with comprehensive admin tools

Key Takeaway

Modern full-stack development doesn't require separate frontend/backend teams. Inertia.js proved that React + Laravel can deliver production-ready applications faster than traditional architectures. Building accessibility and performance from the start, not as afterthoughts, saves time and delivers better results.