An open API service indexing awesome lists of open source software.

https://github.com/pepryan/dzikir-pagi-petang

Aplikasi dzikir pagi dan petang untuk memudahkan umat Muslim
https://github.com/pepryan/dzikir-pagi-petang

dzikir islam islamic-app javascript muslim

Last synced: 11 months ago
JSON representation

Aplikasi dzikir pagi dan petang untuk memudahkan umat Muslim

Awesome Lists containing this project

README

          

# 📿 Dzikir Pagi Petang
# بِسْمِ اللهِ الرَّحْمٰنِ الرَّحِيْمِ
## (Bismillahirrahmanirrahim - Dengan nama Allah Yang Maha Pengasih lagi Maha Penyayang)

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![React](https://img.shields.io/badge/React-20232A?style=flat&logo=react&logoColor=61DAFB)](https://reactjs.org/)
[![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=flat&logo=tailwind-css&logoColor=white)](https://tailwindcss.com/)

Aplikasi web modern untuk dzikir pagi dan petang dengan antarmuka yang bersih dan ramah pengguna.

# أَلَا بِذِكْرِ اللَّهِ تَطْمَئِنُّ الْقُلُوبُ
QS. Ar-Ra'd ayat 28
## (Alaa bidzikrillahi tathma'innul quluub - Ingatlah, hanya dengan mengingat Allah hati menjadi tenang)

[🌐 Lihat Demo](https://dzikirapp.my.id) | [🐛 Laporkan Bug](https://github.com/pepryan/dzikir-pagi-petang/issues) | [✨ Ajukan Fitur](https://github.com/pepryan/dzikir-pagi-petang/issues)

## ✨ Fitur Utama

- 🎨 **Antarmuka Modern**:
- Dibangun dengan Tailwind CSS dan komponen shadcn/ui
- Desain responsif yang elegan dan intuitif
- Tema terang dan gelap yang dapat disesuaikan

- 📱 **Optimasi Mobile**:
- Navigasi dengan gesture geser (swipe)
- Tampilan yang responsif untuk semua ukuran layar
- Pengalaman pengguna yang mulus di perangkat mobile

- 🔄 **Fitur Pelacakan**:
- Progress bar visual untuk memantau kemajuan
- Indikator navigasi yang intuitif
- Penyimpanan progres otomatis

- 💾 **Penyimpanan Data**:
- Menyimpan kemajuan dzikir secara otomatis
- Pengaturan preferensi pengguna yang persisten
- Data tersimpan di penyimpanan lokal browser

## 🛠️ Teknologi

- **Frontend Framework**: [React](https://reactjs.org/) dengan [TypeScript](https://www.typescriptlang.org/)
- **Build Tool**: [Vite](https://vitejs.dev/) untuk pengembangan yang cepat
- **Styling**: [Tailwind CSS](https://tailwindcss.com/) untuk desain yang fleksibel
- **Komponen UI**: [shadcn/ui](https://ui.shadcn.com/) untuk komponen yang konsisten
- **Animasi**: [Framer Motion](https://www.framer.com/motion/) untuk transisi halus
- **Navigasi**: [Swiper](https://swiperjs.com/) untuk gesture swipe

## 🚀 Memulai

### Prasyarat

- Node.js (versi 16 atau lebih baru)
- npm atau yarn

### Instalasi

1. Clone repositori:
```bash
git clone https://github.com/yourusername/dzikir-pagi-petang.git
cd dzikir-pagi-petang
```

2. Install dependensi:
```bash
npm install
# atau
yarn install
```

3. Jalankan server pengembangan:
```bash
npm run dev
# atau
yarn dev
```
Server akan berjalan dengan fitur Hot Module Replacement (HMR) yang memungkinkan pembaruan instan saat kode diubah.

4. Buka browser dan akses `http://localhost:5173/`

### Fitur Development

- 🔥 **Hot Module Replacement (HMR)**: Pembaruan instan tanpa refresh browser
- 📦 **Code Splitting**: Optimasi chunk untuk vendor dan komponen utama
- 🔍 **Path Alias**: Menggunakan `@/` untuk import dari direktori `src`
- 🛠️ **Build Optimization**: Konfigurasi khusus untuk performa optimal

## 📦 Build dan Deployment

Aplikasi ini dikonfigurasi untuk deployment di Cloudflare Pages dengan root path:

1. Build proyek:
```bash
npm run build
# atau
yarn build
```
Proses build akan menghasilkan output teroptimasi dengan:
- Code splitting otomatis
- Minifikasi dan kompresi aset
- Pembagian chunk vendor terpisah
- Optimasi gambar dan aset statis

2. Preview hasil build (opsional):
```bash
npm run preview
# atau
yarn preview
```

3. Deploy ke Cloudflare Pages:
- Hubungkan repositori GitHub ke Cloudflare Pages
- Atur build command: `npm run build`
- Atur build output directory: `dist`
- Konfigurasi custom domain: `dzikirapp.my.id`

## 🤝 Kontribusi

Berikut cara untuk berkontribusi:

1. Fork repositori ini
2. Buat branch fitur (`git checkout -b fitur/AmazingFeature`)
3. Commit perubahan (`git commit -m 'Menambahkan fitur baru'`)
4. Push ke branch (`git push origin fitur/AmazingFeature`)
5. Buat Pull Request

### Panduan Kontribusi

- Pastikan kode mengikuti standar format yang ada
- Tambahkan komentar untuk kode yang kompleks
- Update dokumentasi jika diperlukan
- Pastikan semua test berjalan dengan baik

## 📝 Lisensi

Proyek ini dilisensikan di bawah Lisensi MIT - lihat file [LICENSE](LICENSE) untuk detail.

## 🙏 Thanks to

- Inspirasi UI/UX dari berbagai aplikasi dzikir modern
- Sumber konten dzikir dari literatur Islam yang terpercaya | [Referensi](https://almanhaj.or.id/11518-dzikir-pagi-dan-petang.html)

---

Dibuat dengan ❤️ oleh Febryan Ramadhan untuk Umat Muslim.
(جزاكم الله خيرا - Jazakumullahu khairan)

بَارَكَ اللهُ فِيكُمْ

(Barakallahu fiikum - Semoga Allah memberkahimu)