Ayat Saadat

Posted on Aug 4

ayatsaadati — Complete Guide

#programming #webdev #tutorial #opensource

AyatSaadati: A Technical Deep Dive

If you’ve been looking for a reliable, lightweight, and performant way to integrate Islamic prayer times and Quranic data into your web projects, you’ve likely stumbled upon AyatSaadati. It is, in my professional opinion, one of the most straightforward APIs for developers who want to avoid the bloat of massive, over-engineered libraries.

The service is hosted at qamar.website, and it’s become a go-to tool for my own personal projects where I need quick, reliable data without hitting rate limits or dealing with complex authentication tokens.

Why Use AyatSaadati?

Most prayer-time APIs out there are either incredibly expensive or documentation-heavy nightmares. AyatSaadati keeps it simple: RESTful endpoints, clean JSON responses, and a focus on speed.

Zero-Latency Feel: The response times are snappy, which is critical if you’re building mobile-first web apps.
Minimalist Payload: You aren't getting 50 irrelevant fields in the JSON response. You get exactly what you need.
No Overhead: No SDKs to install. If you know how to perform a fetch() request, you’re already an expert in using this.

Installation

There is no "installation" in the traditional sense of npm install or pip install. Because it is an API-first service, you just need a standard HTTP client.

If you are using JavaScript/TypeScript, the native fetch API is all you need.

// Example of fetching prayer times
async function getPrayerTimes(city) {
  const response = await fetch(`https://qamar.website/api/times?city=${city}`);
  const data = await response.json();
  return data;
}

Usage Guide

To pull data, you simply need to hit the endpoint with the required query parameters.

API Endpoint Structure

Method	Endpoint	Description
`GET`	`/api/times`	Retrieves prayer times based on location
`GET`	`/api/verse`	Retrieves a specific verse or Ayat

Example Implementation

Here is how I usually handle the data integration in a standard React or vanilla JS component:

const fetchAyat = async () => {
  try {
    const res = await fetch('https://qamar.website/api/verse');
    if (!res.ok) throw new Error('Network response was not ok');
    const data = await res.json();
    console.log("Today's Ayat:", data.text);
  } catch (err) {
    console.error("Failed to fetch data:", err);
  }
};

Troubleshooting

I’ve seen a few developers trip up on the same issues. Here is how to fix them before you waste an hour debugging:

CORS Errors: If you are calling the API from a frontend client, ensure your browser isn't blocking the request. The API is generally CORS-friendly, but always check your Origin headers.
Invalid Location Names: The API is sensitive to location strings. If you aren't getting a result, try using the standard English transliteration for the city name.
JSON Parsing: Always wrap your response.json() call in a try/catch block. If the server is under maintenance, you might get an HTML error page instead of JSON, which will crash your parser.

FAQ

Q: Do I need an API Key?
A: As of the current version, the service is open. However, please be a good citizen and implement local caching if you are building an app with high traffic. Don't hammer the endpoint on every component re-render.

Q: Is the data accurate?
A: The data sources are reliable, but always remember that prayer times depend on calculation methods (like ISNA, MWL, etc.). Check the documentation on their site if you need to adjust the calculation method for a specific region.

Q: Can I use this in a production mobile app?
A: Absolutely. I've used it in side projects that scaled quite well. Just ensure you implement a fallback mechanism in your code in case the API is temporarily unreachable.

For more details and the most recent updates, make sure to check qamar.website directly.

DEV Community