This is a solution to the Dictionary web app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- Search for words using the input field
- See the Free Dictionary API's response for the searched word
- See a form validation message when trying to submit a blank form
- Play the audio file for a word when it's available
- Switch between serif, sans serif, and monospace fonts
- Switch between light and dark themes
- View the optimal layout for the interface depending on their device's screen size
- See hover and focus states for all interactive elements on the page
- Bonus: Have the correct color scheme chosen for them based on their computer preferences.
- HTML5
- CSS3
- TypeScript
- TailwindCSS - For Styles
- React - UI library
- Vite - For Development & Project Bundling
- Zustand - Global State Management
- @tanstack/react-query - Asynchronous State Management
- React-Icons
- Shivangam Soni
- Frontend Mentor - @ShivangamSoni
- GitHub - @ShivangamSoni