Personal page in Next.js - Cockpit CMS - No Design, Only Coding
Katarzyna Sosna - massage therapist and trainer from Poland
Meet Katarzyna Sosna, an experienced massage therapist and trainer from Poland with over 14 years of expertise in therapeutic bodywork. Based in Tychy, Silesia, she specializes in Lomi Lomi Nui, face and head massage, and relaxation techniques, combining deep knowledge, intuition, and sensitivity in her practice.
She not only provides massages, but also shares her expertise as an instructor, guiding students through professional training in a safe, mindful, and structured way. Her courses focus on technique, awareness, and the art of touch, helping aspiring therapists refine their skills with confidence.
Her website is available in Polish, reflecting her dedication to local clients and students. Whether you seek a transformative massage experience or want to master the art of healing touch, Katarzyna Sosna welcomes you to explore her world of bodywork and holistic well-being.
My work
I created the website using Next.js production version: server-side rendering (SSR) with a lightweight content management system (Cockpit CMS). This setup allows efficient content management, enabling easy editing of existing pages and adding new subpages directly within the CMS interface. Cockpit CMS provides a structured and flexible way to manage content, ensuring that updates are seamlessly reflected on the website without compromising performance.
Performance & Speed
To ensure fast loading and seamless user experience, I implemented a lightweight booking system that does not process personal data, making it GDPR-friendly while maintaining high efficiency. The production version of the site is highly optimized, weighing only 7.9 MB. Data fetched via the REST API is cached for 5 minutes, reducing server load and improving response times. Additionally, Cloudflare ensures lightning-fast content delivery, optimizing performance worldwide. The site has received top scores in Google Lighthouse, confirming its excellent performance, accessibility, and best practices.
GSAP-Powered Animations
The site features smooth, high-performance animations built with GSAP (GreenSock Animation Platform). Animations are dynamically controlled by ScrollTrigger, allowing elements to react to the user's scroll position, creating an immersive and engaging experience. This approach ensures that animations feel natural, fluid, and precisely timed to user interaction.
Unlike heavy JavaScript-based animations that can strain system resources, this implementation is highly optimized — ensuring that even during intensive interactions, your device stays cool, and the fans remain silent. The animations enhance the overall experience without compromising performance, delivering a visually stunning yet lightweight browsing journey.
No Design, Only Coding
All images are saved in WebP format, and icons, including the logo, are embedded as React functions, ensuring a lightweight and scalable implementation. The site features smooth HTML animations, seamlessly triggered through page scrolling. Instead of following a traditional design process, I took a code-first approach — after designing the logo, I immediately started coding the application, shaping the final look directly in the browser. This method allowed me to refine the UI and UX dynamically, making adjustments on the fly for an optimal user experience 🤓
#UIDesign #UXDesign #UserInterface #WebDesign #AppDesign #HeadlessCMS #WebDeveloper #ReactJSDeveloper #NextJSDeveloper #WordPressDeveloper #JavaScript #RESTAPI #Branding #LogoDesign #HTMLAnimation