https://github.com/kapilsinghnegi/word-search
A modern, responsive React dictionary app supporting word definitions, synonyms, antonyms, audio pronunciation, light/dark mode, and local storage. Uses Tailwind CSS, Material UI, and Dictionary API.
https://github.com/kapilsinghnegi/word-search
dictionary-api material-ui react-dictionary reactjs tailwindcss vitejs
Last synced: 3 months ago
JSON representation
A modern, responsive React dictionary app supporting word definitions, synonyms, antonyms, audio pronunciation, light/dark mode, and local storage. Uses Tailwind CSS, Material UI, and Dictionary API.
- Host: GitHub
- URL: https://github.com/kapilsinghnegi/word-search
- Owner: kapilsinghnegi
- Created: 2025-08-15T19:49:04.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-08-16T07:40:11.000Z (11 months ago)
- Last Synced: 2025-08-16T09:19:33.653Z (11 months ago)
- Topics: dictionary-api, material-ui, react-dictionary, reactjs, tailwindcss, vitejs
- Language: JavaScript
- Homepage: https://kapilsinghnegi.github.io/word-search/
- Size: 4.43 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Dictionary App
A modern, responsive dictionary web app built with React, Tailwind CSS, and Material UI.
It supports light/dark mode, and provides word definitions, examples, synonyms, antonyms and audio pronunciation.
## Features
- 🔍 **Search** for word definitions in English
- 🎧 **Audio pronunciation** for English words
- 🌙 **Light/Dark mode** toggle with smooth transitions
- 🖥️ **Responsive design** for all devices
- 🧑💻 **Debounced search** for better performance
- 📦 **Local storage** for dark mode preference
### Installation
1. **Clone the repository:**
```bash
git clone https://github.com/kapilsinghnegi/word-search.git
cd dictionary-app
```
2. **Install dependencies:**
```bash
npm install
```
3. **Start the development server:**
```bash
npm run dev
```
## Usage
- Type a word in the search box.
- For English words, click the audio icon to hear pronunciation.
- Toggle light/dark mode using the switch in the top-right corner.
## Technologies Used
- **React** for building the UI
- **Tailwind CSS** for styling
- **Material UI** for additional components
- **Axios** for API requests
- **Vite** for development server and build tool
- **Dictionary API** for fetching word data