Creating A Social Media For All Your Social Media’s. Sinatra & Active Record.

Yehuda Bortz
5 min readJan 7, 2021

--

I’ve always imagined a social media of sorts where a user didn’t have pictures, posts, or videos but rather a profile that contained everything that connected them to the web and allowed them to display that to the world.

Well, turns out my idea wasn’t so original. Some notable companies doing this already are, Linktree, and Bytesize. But this didn’t stop me from doing it myself.

Setting Everything Up

First, I had to set up my database with the correct tables to host both the users, their links, as well as a join table to allow users to follow each other. I could achieve this rather easily using the ruby gem Rake and creating migration files for each table from the terminal.

After creating my schema I created my tables by running rake db:migrate and voila my database was ready.

Now it was on to connecting the models and creating relationships between users and their links and the users they follow. In total I created 3 models. User , Link, and Follow.

Users have many links, and links belong to one user. Active Record handles all of these connections for us. So by just defining the relationship in each model, their relationship to each other was created for us and we were ready to go.

This all went rather smoothly for the Link model.

The Follow and User model was not as simple. I was lucky enough to get a hold of a great Medium article by Esmery Corniel that guided me in creating the relationships needed for a user to follow another user and vice versa.

Using Active Record

Active Record has many built in methods one in particular will be auto generated for the has_many relationship and will automatically define the name of the method as the pluralized name of the model. This will allow us to look at all of a users link’s associated with a user like User.links , along with many others. To see all the methods available to our User class, we can simply run User.methods .

Sinatra

Once our models are set up and associated I defined my routes in my controllers folder and then created all my views that would be needed to render different pages.

Most of the heavy lifting of this application is done dynamically and is set up for us with Sinatra. Meaning, for each user that signs up, there are template pages ready to serve the user content specific to that user. This is done by associating a logged in user with a sessions id and only retrieving data from the database where the ids match. This integration between Sinatra and Active Record works almost like magic.

This is the most fundamental part of creating an application with users. Without it we would not be able to authenticate a user and restrict content accordingly.

Using Bcrypt

On the authentication side of things it’s important to store users data in a responsible fashion. This means encryption. Lucky for us there is a Ruby Gem for this too. It’s called bcrypt and it hashes our user’s password. Meaning it takes in our simple password e.g., “Password123” and will spit out a string of characters e.g., $2a$12$8Es0KPgzQXA6vzu1ec0bhugLQcgLCwIaIsU3O87yL.ZNsQJx4ugZu which we then store in the database.

However in order to make sure that “hackers” can’t reverse engineer the encryption, randomized “salts” are added to the end of every hash in order to increase the security.

Bcrypt comes with built in methods to authenticate users, using their plain text password and matching it against the encrypted version.

More on bcrypt here.

Linking everything together.

Once everything was in place. I needed to create the logic and front end that would allow everything to integrate seamlessly together, this part came with much trial and error.

Specifically when a user would go to the dashboard. Information will only be displayed to them if they are logged in. Once they are determined to be logged in, content relevant to them will be displayed, otherwise they will be redirected to login.

HTTP

The main page, the Dashboard, is designed so that a user can add and edit links to their profile, which then gets updated immediately and associated with said user. But before a user adds a link I wanted to make sure that the link was legitimate. So, I constructed the logic to take in the URL from the form and send an HTTP request to that URL. If there is a 200 response code then the link would be added, otherwise not. The same is done for links that are being modified in the dashboard.

User Dashboard

In Conclusion

This all came together better than I anticipated and I’m proud of the little social app I created. Working with Sinatra and Active Record is a blast!

GitHub Repo: Here

Project Link: www.mysocialinks.com

--

--