I Built AlternateOSS, A Directory of Free, Open-source Alternatives to Popular Software 🚀🔥

#webdev #javascript #opensource #astro

Hey guys 👋, Syakir here!

Its been a while since my last post. I skipped my weekly blog posts because i have been busy working on a new project since a couple weeks ago. And now i want to share it with you.

I'm currently building AlternateOSS, a website directory that sharing free, open-source alternatives to popular softwares.

I am interested in the open source world, and started looking for open source alternatives for the tools i have used. Then, im thinking about creating directory for someone like me. I found similar existing projects on the internet, but i want to do it in more organized, and relevancy-oriented list.

I collected 100+ softwares so far and share them with category organization.

The Stacks

The stacks i used are simple. For now, it's fully static. I might convert them full-stack project later when the project become too big.

✅ Astro
✅ TailwindCSS
✅ Shadcn / Radix
✅ Markdown
✅ Fully-static, NO Database
✅ Cloudflare pages

Highlighted Features

Some hightlighted features that i think its cool, and you might interested to implement them to your project as well.

Smooth Navigation with View Transition

The View Transition API enables smooth animated transitions between pages/states in web applications.

It captures the "before" and "after" states of elements
Automatically creates animations between these states
Works with both same-origin navigations and DOM updates

It makes the website really smooth. If it implemented in static website, it feel like it has no loading at all.

I implemented it easily with Astro View Transition. I just need to add a <ViewTransition /> tag and transition:name directives in every element i want to animate.

*Note that the View Transition API is only working on Chromium based browsers. It currently not supported by Firefox.

Static, Instant Search

I build a fully static instant search with:

Astro Static Endpoint, where i store all search data in formatted json array: https://alternateoss.com/api/search.json
LocalStorage, the search.json will only loaded once, and then stored to local storage, until the new version is available. From there, i simple use javascript array .filter method for search
cmdk & Shadcn Command for search input UI

Of course, This static instant search feature is not scalable. But, with the help of ChatGPT, i calculated that this method will still reliable until i reach 10k rows in search.json, with file size around 2MD.

It will takes years to reach that number if i just input the softwares manually

Ranked Alternatives Based on Relevancy & Feature completeness

Last, but not least. This might be the important feature that distinguish AlternateOSS with other similar project. I ranked every tools not based on its github stars or popularity, but mainly based on use cases / category relevancy and manual review for feature completeness / tool quality.

For instance, we have some Google Analytics alternatives:

Posthog: Category -> Product Analytics, Web analytics
Umami: Category -> Web analytics
Plausible: Category -> Web analytics
Matomo: Category -> Web analytics

Google analytics itself fall under 'Web analytics' category.
The alternatives rank will put the main tools with main category Web Analytics first before other categories.

So, in this case, Posthog will rank lower even though it has more complete features than other tools in the list. While Umami, Plausible, and Matomo will be ranked based on manual review by myself.

What do you think about this project?

If you have any feedback, please dont hesitate to put it in the comment below.

Thanks, happy coding!

Top comments (6)

Hossein Yazdi • Nov 6

Slick UI, looks good! I already knew OpenAlternative, and now this seems like another useful alternative.

Great job!

Syakir • Nov 6

To be honest with you, I found out about view transition API when i visit openAlternative.
I was a bit demotivated when i found out that there is already similar website, that has really nice UI.

But i keep going on, using it as my product benchmark :D.
I was thinking, there is no way OpenAlternative will cover all open source tools available on the internet. So, i take my part there lol.

Hossein Yazdi • Nov 6

My demotivated? You can even be better and make your platform more updated. Competitions are born this way. Just a quick suggestion though, make sure to add filter options like OpenAlternative, they're vital in a platform as such!