QuranIPFS: Streaming Quran over IPFS

QuranIPFS: Streaming Quran over IPFS

·

2 min read

Quranipfs logo

About:

QuranIPFS a PWA web application that allows you to listen to the Holy Quran without the need to download any files, using the Interplanetary File System IPFS.

IPFS is a protocol and peer-to-peer network for storing and sharing data in a distributed file system. IPFS uses content-addressing to uniquely identify each file in a global namespace connecting all computing devices. we are using HTML / CSS / JS for the frontend and Firebase, IPFS on the backend, and we are offering our work for free and open source.

How to get the source code of Quranipfs?

Well, you can get Quranipfs source code from Github (link) Support us by giving a star ⭐

Installation:

Change these parameters:

✓ changethis1 -> Facebook admin ID

✓ changethis2 -> Facebook author name

✓ changethis3 -> twitter

✓ changethis4 -> author name

✓ changethis5 -> Yandex meta tag

✓ changethis6 -> Fontawsome reference

✓ changethis7 -> Feedburner

✓ changethis8 -> Facebook page

✓ changethis9 -> telegram

✓ changethis10 -> Feedburner mailing reference

✓ change 'xxx' in 'firebase.js' with your firebase configuration

Screenshots:

Mobile UI

1.png

2.png Desktop UI

Used technologies:

jQuery

✓ Responsive mobile friendly design

✓ Mobile drop-down menu

✓ Lazy loading

✓ YouTube like preloader progress bar

✓ Back to top icon

✓ Cookies (js-cookie)

✓ SEO meta tags (Google, Facebook, Twitter, Pinterest...)

✓ Structured data and cards

✓ Using IPFS to stream and download mp3

✓ M3U files

✓ Torrent download

✓ Responsive HTML5 media player

✓ Stylish rounded social sharing icons menu

Media Elements ready

HLS: to stream and cache MP3

✓ PWA (Service worker, IOS and Android compatible, manifest file...)

✓ Multilingual website (Google Seo optimized)

Materializecss

✓ Hit counter: to calculate the number of visits to each page using Firebase Firestore. ✓ Favorite: save pages to favorite using localStorage.

✓ Filter receiters with alphabet, number of visit or by favorite.

✓ Search for receiters by name filter.

Application:

We are using PWABuilder to convert our PWA to native application for

✓ Android: (Google play)

✓ Windows: (Microsoft store)

✓ IOS: (not yet published)

Support us ❤️:

Buymeacoffee 3.png

Did you find this article valuable?

Support adelpro by becoming a sponsor. Any amount is appreciated!