DEV Community

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

Posted on • Originally published at devaradise.com

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

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

View Transition

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

  1. It captures the "before" and "after" states of elements
  2. Automatically creates animations between these states
  3. 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

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

Ranked alternative list

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 (23)

Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
syakirurahman profile image
Syakir

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.

Collapse
 
hosseinyazdi profile image
Hossein Yazdi

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!

Thread Thread
 
syakirurahman profile image
Syakir

Yes, of course.

Filter is on the roadmap. But for now, you can use search box or go to categories page.

Collapse
 
anmolbaranwal profile image
Anmol Baranwal

That's exactly what I thought.. OpenAlternative is the most useful one out there.
Anyway, great work Syakir 🔥

Collapse
 
syakirurahman profile image
Syakir

Thanks Anmol.

Its been a while i didn't hangout here :D

Collapse
 
ccbikai profile image
MT

I am glad to see similar competitive products, the page is very smooth.

However, OpenAlternative has been open-sourced. Since you have collected alternatives to open-source software, is your project itself also an open-source alternative?

Also recommend an open-source project of mine sink.cool/, it is an alternative to Bitly.

Collapse
 
syakirurahman profile image
Syakir

I want to open-source it. But now the repo is still combined with the contents, because it fully statics with markdown.

I want to at least separate the contents first into submodule, before i make it open source.

Collapse
 
syakirurahman profile image
Syakir

Hi, Just want to let you know that Sink is now listed on AlternateOSS

Collapse
 
xwiki profile image
XWiki

Hi, would you care adding XWiki as well?
We have created the only dedicated Confluence Migrator Toolkit on the market and were also preparing a free webinar this November with a live demo. Here's the registration link for the webinar.

Collapse
 
the-me profile image
Axel Bock

nice directory!

maybe consider splitting "open source" (which is usually associated with "free software") into "source available" and "open source".

"source available" for example would be n8n, which is definitely not free, and that would be something at least i would like to know.

Collapse
 
syakirurahman profile image
Syakir

Thanks for the suggestion.

I actually did that but only in alternative list page like this:
alternateoss.com/alternatives-to/g...

Collapse
 
rhbrolo profile image
RH Brolo

Here is some constructive criticism (no hard feelings or any bad vibes)

  • overall, site looks and feels nice, with a few visual inconsistencies here and there, for example the content is not centered when I click a subcategory page
  • the correct title is "AlternateOSS, A Directory of Open-source, Fremium and Paid Tools.
  • the "alternatives" part is not so well emphasized in the UI/UX like the categories part is. And if you state free, open-source tools, then it's a turn-off to see the first item as Paid or Freemium when you click a category. Also, categories should also be shown on the front page

But from a technical point of view, it's an achievement and you should be proud of it ! I am sure you learned a lot when building it and the only way is up from this point. Cheers✌️

Collapse
 
syakirurahman profile image
Syakir • Edited

Thank you very much to spent your time to write this. I appreciate it :)

  1. I just deployed new changes to sub category page. It supposed to have right sidebar. Yesterday, i shipped without it

  2. I know, the title might not 100% matched with contents. But i use "Alternate universe of software" to make it easy to remember. I do want to emphasize the OSS part though, like the domain name imply. But i cant ignore the free and paid tools content because thats where the high search volume are. So, i'm still trying to find a balance by highlighting more OSS than freemium / paid tools in the home page.

  3. The "alternatives" is actually supposed to list "Popular softwares where people look the alternatives for". But it seems misleading. What do you think the best menu label for this?

Collapse
 
debojyotichatterjee9 profile image
Debojyoti Chatterjee

Good work!! Can you add APIDog as another Postman or any API Testing GUI client alternative? @syakirurahman Or maybe you can have a suggestion form kind of a thing where dev can suggest the alternative they might know you can review and add them to the list as required?

Collapse
 
syakirurahman profile image
Syakir

is APIDog open source?

the suggestion form is in the roadmap for next feature. I still focus on enriching the database first for now

Collapse
 
thexdev profile image
M. Akbar Nugroho

Well done, Syakir 🙌

Collapse
 
khuongduybui profile image
Duy K. Bui
Collapse
 
syakirurahman profile image
Syakir

Yes, its good as well

Collapse
 
isanjayjoshi profile image
Sanjay Joshi

How i can add mine open source project here

Collapse
 
syakirurahman profile image
Syakir

Theres still no submission form yet. If you want to add yours, just put it here

Collapse
 
karishmashukla profile image
Karishma Shukla

How can one add their project to the list? @syakirurahman

Collapse
 
syakirurahman profile image
Syakir

For now, i manually add the projects. But a form submission is in the feature roadmap.

If you have any open source project to submit, just contact me or reply it here 😄