Screenshot of Designo's hero section


Transformed a Figma design into a responsive, self-managed site.

  • Sanity
  • Next.js
  • Development
  • Design to code

What's a Frontend Mentor challenge?

It's a platform that provides front-end challenges with professional web designs to help people starting out web developing practice their skills in a realistic workflow.

I still do some from time to time but I can now design myself so I create my own challenges.

Screenshot of Designo's hero section

Why bother doing 'em?

Well at the time I didn't have much design skills, mostly just developing skills but small single paged projects.

This opened up eyes to actually working with a design piece of software and precisely type it out in code.

Don't believe me? Look below, no different between the design and mine.

Frontend Mentor Designo Guru challenge solution and design comparison
Solution design comparison

Perks of Next.js

It's everything you want from an actual site which I can create for you, including the instant loading, responsiveness, and SEO setup.

100 performance on mobile based on Google PageSpeed
Mobile Google PageSpeed results
Google PageSpeed desktop results, all green with performance with a near perfect 99
Desktop Google PageSpeed results

Tech stack

  • Frontend development

    • TypeScript logo


    • React Logo


    • TailwindCSS logo


    • Next.js logo


  • CMS

    • Sanity logo


  • Deployment & version control

    • Vercel logo


    • Github logo


  • Design

    • Framer logo


  • Development tools

    • VSCode logo


Got a design needing translation to code?