This is a simple web application that allows users to search for words and retrieve their definitions. The application uses HTML, CSS, and JavaScript for the front-end and is styled using Bootstrap along with custom CSS.
- Word Search: Users can type a word into the input field and click the "Search" button to look up definitions.
- Sound Pronunciation: Users can listen to the pronunciation of the word.
- Responsive Design: Utilizes Bootstrap for a responsive layout that adapts to different screen sizes.
- Modern UI: Styled with custom CSS and integrated with Google Fonts and Font Awesome for an appealing design.
- Loading Spinner: Displays a spinner while fetching data to indicate loading status.
- HTML5: Structure and markup.
- CSS3: Styling and layout.
- JavaScript: For interactivity and functionality.
- Bootstrap 5: For responsive design and UI components.
- Google Fonts: For typography.
- Font Awesome: For icons.
The application includes error handling to provide feedback to users in case of issues:
- Empty Input Field: If the input field is empty when the "Search" button is clicked, a message prompts the user to enter a word.
- Word Not Found (404): If the word is not found in the dictionary API, a message indicates that the resource was not found (404).
- Other HTTP Errors: For any other HTTP errors, a message displays the error status.
- Network or Other Errors: General errors during the fetch operation are caught and displayed, advising users to try again later.
You can view a live demo of this project here.
Feel free to explore and test the functionality of the application.
