https://github.com/basmasalim/duabox
Allows users to write, save, and manage their favorite Duas (supplications) — all in one place. Built with HTML, CSS, JavaScript, and powered by a local JSON server for backend functionality.
https://github.com/basmasalim/duabox
bootstrap5 css3 html5 json masonry-layout sweetalert2
Last synced: 3 months ago
JSON representation
Allows users to write, save, and manage their favorite Duas (supplications) — all in one place. Built with HTML, CSS, JavaScript, and powered by a local JSON server for backend functionality.
- Host: GitHub
- URL: https://github.com/basmasalim/duabox
- Owner: basmasalim
- Created: 2025-05-04T19:36:07.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-05T13:51:54.000Z (about 1 year ago)
- Last Synced: 2025-05-05T19:22:29.745Z (about 1 year ago)
- Topics: bootstrap5, css3, html5, json, masonry-layout, sweetalert2
- Language: JavaScript
- Homepage:
- Size: 931 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
**DuaBox** is a simple and elegant web app that allows users to write, save, and manage their favorite Duas (supplications) — all in one place. Built with HTML, CSS, JavaScript, and powered by a local JSON server for backend functionality.
## 📸 Preview

## ✨ Features
- 📝 Add your favorite Duas
- 📂 View all saved Duas in a clean layout
- 🗑️ Delete any Dua you no longer need
- 🖊️ (Coming Soon) Edit saved Duas
- 🌙 RTL (Right-to-Left) Arabic support
- ❤️ Clean and responsive Bootstrap 5 design
## 🛠️ Built With
- HTML5
- CSS3
- Bootstrap 5.3
- JavaScript (Vanilla)
- [JSON Server](https://github.com/typicode/json-server) (for local development)
## 🚀 Getting Started (Local Setup)
To run the project locally with full functionality including saving/deleting:
### 1. Clone the repository
```bash
git clone https://github.com/basmasalim/DuaBox.git
cd DuaBox
````
### 2. Install JSON Server
```bash
npm install -g json-server
```
### 3. Start the server
```bash
json-server --watch db.json --port 3000
```
This will create a local REST API at: `http://localhost:3000/DuaBox`
### 4. Open the `index.html` file in your browser
## 📁 Project Structure
```
DuaBox/
│
├── assets/
│ ├── icon/ # Favicon files
│ ├── style.css # Custom styling
│ └── script.js # JavaScript logic
│ └── db.json # JSON Server database
│
├── index.html # Main HTML file
└── README.md # Project documentation
```
---
## 🤝 Contributing
Feel free to fork the repository, create a pull request, or suggest new features via issues.
---
## 📧 Contact
Made with 💚 by **[Basma Salim](https://github.com/basmasalim)**
For any feedback or ideas, feel free to reach out!
---
## 🕌 A Note of Gratitude
> *"Whoever guides someone to goodness will have a reward like one who did it."*
> — Prophet Muhammad (peace be upon him)