A collection of duas I try to regularly recite. This is a web application built with Flutter that displays Islamic supplications with their translations and sources.
- Clean, modern interface
- Arabic text with proper font support
- Translations and sources
- Dark theme for better readability
- Responsive design
- Easy to customize and deploy
-
Install Flutter:
- Download Flutter SDK from flutter.dev
- Add Flutter to your PATH
- Run
flutter doctorto verify installation
-
Install Node.js and npm:
- Download from nodejs.org
- Verify installation:
node --version npm --version
-
Install Git:
- Download from git-scm.com
- Verify installation:
git --version
-
Fork this repository
-
Clone your fork:
git clone https://github.com/YOUR_USERNAME/duas.git cd duas -
Install dependencies:
flutter pub get npm install
flutter run -d chrome-
Create a JSON file with your duas following this structure:
[ { "arabic": "Arabic text of the dua", "source": "Source/reference of the dua", "meaning": "Translation/meaning of the dua" } ] -
Host your JSON file using one of these CORS-friendly options:
- Option 1: npoint.io (recommended)
- Go to npoint.io
- Create a new JSON document
- Copy the provided URL
- Option 1: npoint.io (recommended)
-
Update the API endpoint:
- Open
lib/utils/apis.dart - Replace the URL in the
getDuas()method with your JSON URL
- Open
Edit lib/main.dart and modify the ThemeData in the MaterialApp widget.
Edit lib/widgets/dua_item.dart and modify the GoogleFonts widget.
Edit web/index.html and change the <title> tag.
-
Update
package.json:- Change the repository URL to your fork
- Update the base href in the predeploy script if needed
-
Deploy:
npm run deploy
-
Your app will be available at:
https://[your-username].github.io/duas/
-
Build the app:
flutter build web
-
Deploy the contents of the
build/webdirectory to your hosting service
-
CORS Issues:
- Ensure your JSON hosting service allows CORS
- Use a CORS proxy if needed
-
Build Issues:
- Clear build cache:
flutter clean flutter pub get
- Clear build cache:
-
Deployment Issues:
- Check GitHub Pages settings
- Verify repository name matches package.json
- Check base href configuration
If you encounter any issues:
- Check the Flutter documentation
- Open an issue in the repository
- Check the troubleshooting section above
This project is licensed under the MIT License - see the LICENSE file for details.