ShlinkedIn: A Fun Social Network Built On Open Source

In honor of Open Source Month, I wanted to write about . ShlinkedIn is a parody of a very popular website (I will leave it to the reader to guess which), and it has thousands of users. About a year ago it made the #1 page of . I first heard about them on a British podcast called .

To be completely clear, I am not the one who built it…though I did make a few small contributions that could be characterized as an excuse for writing this blog post. A casual reader might just think that this website is a software engineer’s casual side project - and they would be correct - but here are some reasons I think there is more to ShlinkedIn than meets the eye:

• The tech stack, which you can find on their here, is actually pretty interesting. It uses the relatively new , as Holtz wanted to practice building something with it. The nucleus of ShlinkedIn was
• This is a demonstration of what a social network could be. There are no ads. There is no data harvesting. Instead, it makes money with an optional paid tier
• It critiques LinkedIn and the hustle culture LinkedIn sometimes seems to represent. It also evolves with the platform: On the right-hand side are news headlines anyone can make up, on each post are reaction buttons that are completely meaningless (like “milk” and “hot sauce”), and throughout the site are over-the-top advanced features like NFT generation, profile page animations, and Spotify integration. They even have an AI feature, and I asked in their discord what library they were using. They said they were using “mad libs,” and it took me a while to realize that they were joking

  
  

Why Open Source?

Many of the advantages of open source are obvious: It is free and “let’s everyone play,” in the words of (yes, I felt obligated in a post about open source to quote Linus Torvalds. In context, he was having an argument with someone about whether to let companies use open source software to turn a profit). But it also presents a learning opportunity that is much more realistic and relevant than a tutorial or, dare I say, a LeetCode question.

When you make an account and log in, you have the ability to post. I was curious about the buttons and tried a couple. You can add unnecessary emojis to a post, but it does not specify how many. An “undo” button would be useful because the standard “ctl + z” does not work here.

So how do you do it? Do you look up how people in other applications implement “undo”? Maybe just use a simple data structure, like a stack, to track all changes? Maybe it is much simpler…because these buttons do not incorporate anything random, why not just use some simple counters? These are the kinds of questions you would have to ask yourself to implement a meaningful feature, and they are also the kinds of things you would actually do in the field (albeit on a much larger and more complicated project).

My (Small) Contribution

…But while they were waiting for that, I decided to work on something completely different. There was an “Excessive spacing” button, but it did not seem to do anything. I filed an issue on their GitHub, and the developer clarified that it only did anything if there were paragraph breaks. This seemed like some low-hanging fruit to demonstrate that I was serious.

It ended up not being that complicated, but it was certainly less trivial than I had envisioned. There are two files written in JavaScript and Elixir, respectively, that handle this form above. The developer clarified that Phoenix LiveView is frontend, but on the surface this project seemed to defy the dichotomy by blurring frontend and backend together. The creator of Phoenix LiveView seems to somewhat corroborate this in his blog post: Phoenix LiveView is something completely different.

LiveView strips away layers of abstraction, because it solves both the client and server in a single abstraction. HTTP almost entirely falls away. No more REST. No more JSON. No GraphQL APIs, controllers, serializers, or resolvers. You just write HTML templates, and a stateful process synchronizes it with the browser, updating it only when needed. And there's no JavaScript to write. --

As of a few hours ago, I am now a contributor to ShlinkedIn. At first I made an alert, but that was crummy and did not match the format of a similar error. Instead, I decided to add a new tag, distinguish it with an id, and write a small amount of JavaScript to detect paragraph breaks and only add excessive spaces if a condition was reached.

but please don’t tell them.

There Is Always More To Learn

How do Phoenix LiveView and Elixir work? I thought I would have to learn a lot more about them, but this ended up just being JavaScript. Also, why did I have to use JavaScript? Why does the creator of Phoenix LiveView seem to argue that JavaScript is unnecessary here?

Am I correct in my belief that Phoenix LiveView blurs the line between frontend and backend, or is that incorrect? Lots of people on Medium argue that Phoenix LiveView is extremely efficient, but is it? If so, how do I test that?

Closing Thoughts

ShlinkedIn is creative, it is open source, and it takes advantage of new things and new ideas. It is also a lot of fun…it even has its own in-universe version of .

Follow their Discord, and you can get a first look at how a social media scales. There are also some less fun discussions they have, like whether to moderate a racist comment when the poster is anonymously parodying a famous person. Is her statement actually racist, or is she parodying a racist comment?

The project is new and interesting, which is why I think it deserves HackerNoon’s attention.

(If you liked what you read, please consider )