# QuranIPFS: Streaming Quran over IPFS

![Quranipfs logo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/npyrow82q2a7n40xwfrk.png)

## About:
[QuranIPFS](https://www.quranipfs.com) 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](https://github.com/adelpro/Quranipfs))
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](https://cdn.hashnode.com/res/hashnode/image/upload/v1649171578172/D3GZt2lD2.png)

![2.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1649171588800/kdXOf6rG_.png)
Desktop UI

## Used technologies:
✓ [jQuery](https://jquery.com/)

✓ 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](https://ipfs.io) to stream and download mp3

✓ M3U files

✓ Torrent download

✓ Responsive HTML5 media player

✓ Stylish rounded social sharing icons menu

✓ [Media Elements](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement) ready

✓ [HLS](https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Live_streaming_web_audio_and_video): to stream and cache MP3

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

✓ Multilingual website (Google Seo optimized)

✓ [Materializecss](https://materializecss.com)

✓ Hit counter: to calculate the number of visits to each page using [Firebase](https://firebase.com) 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](https://www.pwabuilder.com) to convert our PWA to native application for

✓ Android: ([Google play](https://play.google.com/store/apps/details?id=app.web.quranipfs.twa))

✓ Windows: ([Microsoft store](https://www.microsoft.com/en-bs/p/quranipfs/9nk92vvvpb8b))

✓ IOS: (not yet published)

## Support us ❤️:
[Buymeacoffee](https://www.buymeacoffee.com/Adel.benyahia)
![3.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1649171597212/8PmcTrHi0.png)