Italy UMA AcademyOnline Learning Platform
A modern, scalable online education platform for Italy UMA Academy, built with Next.js, React, and TypeScript. Features include course browsing, user authentication, account management, newsletter subscription, and secure payment integration.
Category
Full Stack
My Role
Full Stack Developer – designed the architecture
Core Stack
Next.js 14, TypeScript +4
Status
Live
Problem & Goal
Italy UMA Academy needed a robust, user-friendly platform to deliver online courses, manage user accounts, and handle secure payments. Existing solutions lacked the flexibility for custom course structures and seamless integration with local payment providers.
What I Built
Key features and functionality implemented in this project
Course catalog with dynamic routing and filtering
User registration, login, and account management
Newsletter subscription with backend integration
Secure payment flow with PayHere integration
Responsive design and image optimization
SEO enhancements (sitemap, robots.txt, metadata)
Contact form and testimonials
Privacy policy and terms pages
UI Gallery
A square-format gallery with layered details and progressive loading, tuned to stay sharp across mobile, tablet, and desktop viewing experiences.
Built to Perform
High Performance
Optimized with lazy loading, code splitting, and image optimization for 95+ Lighthouse performance scores.
SEO Optimized
Structured metadata, Open Graph tags, schema markup, and canonical URLs for maximum search engine visibility.
Fully Responsive
Pixel-perfect layout from 320px mobile screens to 4K displays, with accessible UI patterns throughout.
Challenges & Solutions
Technical obstacles encountered and how they were overcome
Implementing secure, seamless payment processing for course purchases.
Integrated PayHere payment gateway with custom backend logic to handle payment success/cancellation and user enrollment.
Managing dynamic course and lesson routing with SEO-friendly URLs.
Utilized Next.js dynamic routing and static generation for course and lesson pages, ensuring fast load times and optimal SEO.
Results & Impact
My Role
Full Stack Developer
Full StackFull Stack Developer – designed the architecture, implemented the Next.js frontend, integrated payment and newsletter APIs, and handled deployment.
Explore Italy UMA Academy
Check out the live deployment or explore the full source code on GitHub.