Dear devs,
This is an experiment bringing together Hugo and Internet Archive to provide a rock solid, lightweight and ethical solution to serve audio files.
The main objective is to share loads of audio files (hundreds of gigabytes are fine) without the hassle of Youtube / Dropbox / Soundcloud etc
Demo
- Visit the Lou Reed Bootlegs Collection, and see this collection of 2000+ hiphop tracks.
Main features
- unlimited storage and unlimited bandwidth
- Total running cost: $0.91 /month
( It can even be entirely free using a subdomain such as .netlify.app, .gitlab.io, github.io or .frama.io)
- built to scale: media files are served by the non-profit Internet Archive, which handles smoothly more than 5M daily users. The code is hosted by the rock-solid & lightning-fast Netlify CDN.
- careful UX, based on a stack respecting users, creators, and devs (see below for details)
- future-proof: It’s all built just with Hugo, Git and data from archive.org.
No other requirements:
- no database
- no npm
- no security update
- no server maintainance
What makes phoni.es different?
we are users, creators and devs all at the same time. So:
We care about users
- no ads, no trackers
- no account, no dark patterns
- privacy friendly: VPN and Tor users welcome, no JS required
- clean and responsive UI, mindful UX
We care about creators
- no hassle: publish and forget – focus on what matters for you
- upload full-quality WAVE files, automatically share WAVE, MP3 and Flac
- no lock-in: all files & metadata are available for easy export / download.
(both from the browser or from the CLI) - define a license for your content and display it next to the download button
We care about devs
It’s all simple technologies and pure flat files tracked in Git:
- no database, no npm
- no security update, no server maintainance
- batch import / export (i.e upload / download)
- automatic conversion from WAV to Flac and MP3
- built to scale, provides unlimited storage and unlimited bandwidth
- affordable for non-profits:
✨ Total running cost: $0.91 / month ✨
It can even be entirely free using a subdomain such as .netlify.app, .gitlab.io, github.io, .itcouldbewor.se or .frama.io
As devs, we just want to code when we want to, and stay free to postpone when we have better plans
How to use:
You can embed audio files, full audio collections and even videos with the provided Hugo Shortcodes.
Here is a preview:
Embedding audio files
Include audio directly in Markdown with the following Shortcode:
{{< audio "https://archive.org/download/foo/bar.mp3" >}}
An audio player will then be displayed:
This player is elegant, performant, accessible – and fully customizable with CSS variables.
Videos works too!
Here is a demo:
(See the Shortcodes documentation to learn more.)
Let’s speed up things
Automatically generate a complete media library
So far we had to include manually each file.
Let’s learn how to create, in a matter of minutes, a website collecting hundreds of audio files, videos, and PDF.
- Upload your files to Internet Archive
- List the folders to include in your library
It’s a simple bullet list like this one:
- https://archive.org/details/lou-reed-live-and-bootlegs-1975-1977
- https://archive.org/details/lou-reed-acoustic-demos-1971
- https://archive.org/details/youtube-24en0GiOzbs
- https://archive.org/details/youtube-2dlOQxy8nPg
...
- Run Hugo
cd prebuild && hugo && cd .. && hugo serve
- Done!
You can now browse your collection at http://localhost:1313
And next?
Generate unlimited new websites in minutes – upload files, edit the list, build and done!
FAQ
How does the setup look like?
Here is how a local install looks like:
- Get the code
git clone --recurse-submodules https://gitlab.com/Roneo/to-be-announced.git
- Define archive URLs in Yaml. For example:
- https://archive.org/details/laute-jorn
- https://archive.org/details/heya-moli
- https://archive.org/details/erba-d-agram
- Run locally
(Requires Hugo extended > 0.95)
cd prebuild && hugo && cd .. && hugo serve
- Deploy!
Deploying to Netlify works fine, Gitlab CI should not be a problem
(Note: Deploying in
One-click to Netlify is on the roadmap)
How does it work under the hood?
Remember the build command? ("cd prebuild && hugo && cd .. && hugo serve")
Let’s have a closer look:
Hugo automatically run the following steps:
- read URLs from
archives.yml - for each URL, fetch Internet Archive API to get a file list and JSON metadata (like in this example)
- each file listed out there triggers the creation of a local and dedicated Markdown file
- Markdown content is automatically generated from metadata, following a custom template
- Markdown files are converted to HTML with Hugo – HTML templates are also fully customizable
- Hugo then generates a complete website, with Taxonomy, Sitemap, internal search, Blog posts, and automated listings based on filetypes (examples: /audio, /video and /PDF)
Any known limitations?
Yes, here they are:
- There’s no CMS implemented so far. While
Netlify CMS is a good candidate, we wait for
its future to be clarified. (Update: NetlifyCMS
is now “Decap CMS” – let’s see how the situation evolves)
Until then, you have to use an IDE or a web editor like Gitpod, well integrated in Gitlab
- No social network features, like voting, following etc. Comments may be added in the future.
- No content monetization: some platforms provide revenue based on advertisement and viewer profiling. Archive.org doesn’t.
- Archive.org promotes alternatives to traditional copyright and only supports the following licenses:
- Public Domain
- Creative Commons (which are a good pick if you want to share your creations while requiring to be properly credited, or limit usage to non-commercial purposes for example. See this license chooser to get details)
What was the problem with Dropbox / Google Drive / Soundcloud?
In the past I’ve used Myspace, MegaUpload, Dropbox, Google Drive, SoundCloud and . . .
.. that was bad. Really bad.
That was bad:
- for users: invasive cookie banners, ads, trackers, endless ToS, bloatted apps, dark patterns
- for creators: datacenters burn and services close sometime without notice, let aside the inevitable pricing updates, automated (self)censorship, endless migrations, and data loss on the way
- for devs: we don’t want to choose between these services and self-hosting Wordpress / Nextcloud / XYZ (which are all nice but a pain to deploy, secure, maintain, upgrade, backup, etc)
Is it magic?
No. This is possible thanks to
Hugo and
Internet Archive.
This
series of articles by
Regis Philibert was also a precious spark, the
book Hugo in action an awesome reference, the
Hugo and
Archive.org communities were priceless resources along the way
Also contributed to this project: Daniel Saunders, Utkarsh Verma, Sam Potts, ajlkn and the teams and communities around Plyr
Brought to you by Yann Dumoulin ( Gitlab – Blog – Github )
Want to give it a try?
The code is being reviewed and will hopefully get released in march 2023.
You can already join as early tester – or receive a notification only when it’s ready:
Get in touch
You can reach me – in english or in french – at or with the following form:
2023 – Yann Dumoulin ( Gitlab – Github )