https://github.com/0memo07/quran-web-application
Built with React, TypeScript and styled using Tailwind CSS, this Quran web app allows users to view verses, search for verses and switch between languages. It supports both English and Turkish, includes Dark/Light Mode switching, and provides voiceover functionality in both languages.
https://github.com/0memo07/quran-web-application
kuran mushaf quran quran-app quran-audio quran-search quran-translation quran-web
Last synced: 2 months ago
JSON representation
Built with React, TypeScript and styled using Tailwind CSS, this Quran web app allows users to view verses, search for verses and switch between languages. It supports both English and Turkish, includes Dark/Light Mode switching, and provides voiceover functionality in both languages.
- Host: GitHub
- URL: https://github.com/0memo07/quran-web-application
- Owner: 0MeMo07
- License: mit
- Created: 2024-12-03T14:46:55.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-02-16T12:49:34.000Z (4 months ago)
- Last Synced: 2025-03-24T02:12:43.570Z (3 months ago)
- Topics: kuran, mushaf, quran, quran-app, quran-audio, quran-search, quran-translation, quran-web
- Language: TypeScript
- Homepage: https://deepmushaf.web.app/
- Size: 673 KB
- Stars: 5
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.MD
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
๐ Quran Web Application
A modern, feature-rich Quran application built with React and TypeScript
## โจ Features
๐ **Advanced Search**
- Powerful verse search functionality
- Real-time search results
๐ **Multi-language Support**
- English and Turkish translations
- Seamless language switching
- Complete UI localization
๐จ **Modern UI/UX**
- Elegant dark/light mode
- Responsive design for all devices
- Smooth animations and transitions
๐ **Audio Features**
- High-quality voice-over support
- Audio playback controls
## ๐ ๏ธ Tech Stack
### Frontend
- **React.js** - Modern UI development
- **Redux Toolkit** - State management
- **Tailwind CSS** - Styling and design
- **TypeScript** - Type-safe development
### Backend Integration
- **Aรงฤฑk Quran API** - Comprehensive Quranic data ([API Documentation](https://github.com/acik-kuran/acikkuran-api))
## ๐ Getting Started
### Prerequisites
Before you begin, ensure you have the following installed:
- Node.js (v14 or higher)
- npm or yarn package manager
- Git
### Installation Steps
1. **Clone the Repository**
```bash
git clone https://github.com/0memo07/Quran-Web-Application.git
cd Quran-Web-Application
```
2. **Install Dependencies**
```bash
# Using npm
npm install
# Using yarn
yarn install
```
3. **Start Development Server**
```bash
# Using npm
npm run dev
# Using yarn
yarn dev
```
4. **Build for Production**
```bash
# Using npm
npm run build
# Using yarn
yarn build
```
## ๐ค Contributing
Contributions are always welcome! See [CONTRIBUTING.md](CONTRIBUTING.md) for ways to get started.
## ๐ License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.