Making a Sinatra backend

Making a Sinatra backend project for Halloween.

Jonathan Villanueva
3 min readOct 17, 2021

In the spirit of Halloween, I wanted to make a Daily Prophet-esque website using Sinatra. With that said, I forked and cloned the project from Flatiron GitHub and seeded and migrate my database.

For my project, I created a react front end and a Sinatra back end, and I’ve worked and cloned both ends of my project; with that said I wanted to create a comment section for my project. So I forked and cloned both ends and ended up creating an API for both my articles and my comment section and so for the majority of this project I am going to talk about my back end for my front end and so what I did was that I migrated and seated both the article model and the comment model and put them in an active record bass for both and since we are since I’m doing Sinatra I decided to put the routes in the application_controller.rb with that said again how this works is that this server allows the user to fetch from the back end and be able to refresh and create a new comment.

From there what I did was that I wanted to update the API — or at least my backend server — in a way that allowed the client or the user to see the comments that they’re making with that said I created my routes and I made a model called comment and I made it belong to articles and one of the reasons why I was because I wanted to make sure that I saw these articles and be able to comment on said articles or the very least the page.

Even though I had active record with both of my models, I wanted to make sure I was able to go into my console in the backend and see if there were any objects in my arrays.

I made one of the models belong to articles. I then made three instances the first one is about comment count so that way when I go into the back end I can see how much the user has made and then I did find comment with ID so that way the users were able to see the comment by ID and then to in order for us to be able to see the comments that the user was making.

In my react repository I made three different components called one is called DP card one the other one is called comments and the other is called Apple so in my Apple this is where you’re supposed to see the new comments pop up. And so in apple.js I made a use State and then I made a fetch request and then I returned it all in an input.

And that was how I made my project! This was very challenging, but a very interesting project overall.

--

--