https://github.com/ayokanmi-adejola/dictionary-app
A comprehensive online dictionary delivering instant access to detailed definitions, comprehensive synonym and antonym results, and a diverse range of related language resources, such as audio pronunciations and example sentences.
https://github.com/ayokanmi-adejola/dictionary-app
react18 tailwindcss typescript wikitionary-api
Last synced: 3 months ago
JSON representation
A comprehensive online dictionary delivering instant access to detailed definitions, comprehensive synonym and antonym results, and a diverse range of related language resources, such as audio pronunciations and example sentences.
- Host: GitHub
- URL: https://github.com/ayokanmi-adejola/dictionary-app
- Owner: Ayokanmi-Adejola
- License: mit
- Created: 2025-04-04T17:32:40.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2025-07-15T20:29:35.000Z (6 months ago)
- Last Synced: 2025-09-30T00:00:36.743Z (3 months ago)
- Topics: react18, tailwindcss, typescript, wikitionary-api
- Language: TypeScript
- Homepage: https://ayokanmi-adejola-dictionary.netlify.app/
- Size: 198 KB
- Stars: 13
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Dictionary App
A modern, feature-rich dictionary web application built with React, TypeScript, and Vite. This application provides an intuitive interface for looking up word definitions, managing favorites, and tracking search history.
## ✨ Features
- 📚 Word Definitions: Look up detailed definitions, pronunciations, and examples
- ⭐ Favorites System: Save your favorite words for quick access
- 🕒 Search History: Track and revisit your recent searches
- 📱 Responsive Design: Seamless experience across all devices
- 🎨 Modern UI: Clean and intuitive interface with smooth animations
- 🌟 Word of the Day: Discover new words daily
## 🛠️ Tech Stack
- React 18
- TypeScript
- Vite
- TailwindCSS
- Shadcn/ui
- React Query
- React Router
- Sonner (Toast notifications)
## 🚀 Getting Started
### Prerequisites
- Node.js (v16 or higher)
- npm or yarn
### Installation
1. Clone the repository:
```bash
git clone https://github.com/Ayokanmi-Adejola/Dictionary-App
```
2. Install dependencies:
```bash
npm install
# or
yarn install
```
3. Start the development server:
```bash
npm run dev
# or
yarn dev
```
4. Open your browser and visit `http://localhost:8080`
## 📦 Build
To create a production build:
```bash
npm run build
# or
yarn build
```
## Development
To start the development server with hot reload:
```bash
npm run dev
# or
yarn dev
```
## 📁 Project Structure
```
src/
├── components/ # Reusable UI components
├── pages/ # Page components
├── services/ # API services
├── hooks/ # Custom React hooks
├── utils/ # Utility functions
├── lib/ # Library configurations
└── styles/ # Global styles and CSS
```
## Features in Detail
### Word Search
- Real-time word lookups using the Free Dictionary API
- Phonetic pronunciations with audio support
- Detailed definitions with examples and usage
### Favorites System
- Add/remove words to favorites
- Persistent storage using localStorage
- Quick access to favorite words
### Search History
- Track recent word searches
- Clear history functionality
- Quick navigation to previous searches
## 🤝 Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request
## 👨💻 Author
**Ayokanmi Adejola**
- Portfolio: [https://ayokanmi-adejola-portfolio.netlify.app/]
- LinkedIn: [https://www.linkedin.com/in/ayokanmiadejola/]
## 🙏 Acknowledgments
- [Free Dictionary API](https://dictionaryapi.dev/) for providing the dictionary data
- [Shadcn/ui](https://ui.shadcn.com/) for the beautiful UI components
- [TailwindCSS](https://tailwindcss.com/) for the utility-first CSS framework
- [Netlify](https://www.netlify.com/) for hosting the application