import React, { useEffect, useState } from 'react';
import './App.css';
const App = () => {
const [prayerTimes, setPrayerTimes] = useState(null);
const [location, setLocation] = useState({ lat: null, lon: null });
useEffect(() => {
// Get user's location
navigator.geolocation.getCurrentPosition((pos) => {
const { latitude, longitude } = pos.coords;
setLocation({ lat: latitude, lon: longitude });
});
}, []);
useEffect(() => {
if (location.lat && location.lon) {
fetch(`https://api.aladhan.com/v1/timings?latitude=${location.lat}&longitude=${location.lon}&method=2`)
.then(res => res.json())
.then(data => {
setPrayerTimes(data.data.timings);
});
}
}, [location]);
return (
{/* Header */}
Masjid Al-Hikmah
Aplikasi Informasi Masjid Satu Halaman
{/* Jadwal Salat */}
Jadwal Salat Hari Ini
{prayerTimes ? (
{Object.entries(prayerTimes).map(([name, time]) => (
-
{name}: {time}
))}
) : (
Mengambil lokasi dan jadwal salat...
)}
{/* Kegiatan Masjid */}
Kegiatan Masjid
- 📖 Kajian Rutin - Setiap Jumat malam
- 🕌 Sholat Subuh Berjamaah & Sarapan
- 👨🏫 Belajar Al-Qur'an Anak - Senin & Rabu
{/* Kajian Video */}
{/* Donasi */}
{/* Kontak */}
Kontak & Lokasi
📍 Jl. Contoh No.123, Jakarta
☎️ 0812-3456-7890
);
};
export default App;