Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Dictionary made using Next13 + React + Tailwind

Pablo 550

@ackDeckard

Desktop design screenshot for the Dictionary web app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


So, I finally bit the bullet and got myself Frontend Mentor premium, and man, it's such a game-changer! Having access to the design file has made everything so much easier.

Building this dictionary using React, Tailwind, and NextJS 13 was quite the adventure. I mean, there were a ton of little details to figure out, but the end result is totally worth it. I'm seriously stoked with how it's looking right now.

I generated all the different sections dynamically. Some words have adverbs, nouns, and adjectives, while others barely have anything.

Used a couple of different hooks, also first time that I've used useSound to play the specific word pronunciation.

Overall, I'm just feeling really good about this whole thing.

(Except abusing and adding a bunch of things in layout.jsx which is probably a BIG no to do 🤣).

If you have any feedback, please do so :)

Regards, Pablo

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord