My Daily Journal — A Sinatra Project

Jenny Kim
5 min readJun 12, 2021

For my second project at Flatiron, I decided to make a journal app, utilizing the knowledge we had accumulated in our lessons over the past couple of weeks.

The core requirements of this project were the following:

  • Build an MVC Sinatra app and use ActiveRecord
  • Use multiple models, of which the User model has to have a has_many relationship and another model belongs_to the User model
  • Users must be able to sign-up/login and validate the uniqueness of their username
  • Users can Create, Read, Update, or Destroy only their entries

In the beginning, I was completely lost as to where to start. My initial project idea was to make a productivity tracker app (I had even named it “Tracktivity”). But after mapping out its flow chart, I realized it wouldn’t have been possible with the amount of knowledge and time I had. Therefore, I turned to my secondary idea and a personal woe for me: journaling.

I always try to remind myself as much as possible to journal and write my thoughts at the end of the day as a way to wind down and introspect, but let’s be real. Who really has the time and motivation when you’re tired, to whip out your pen and notebook, when all you want to do is turn on Netflix and watch Tiger King? Using my laziness as a catalyst, I decided I should at least try to make it easy for me to journal.

App’s flow chart

Truthfully, the hardest part of the project was planning out all the logistics of the app, since I didn’t want a situation where I was knee-deep into coding and realize that what I had envisioned wouldn’t work. After having decided on which/how many models I was going to do, which attributes for each model, and the general layout of my app, I was able to finally get started on my project!

Rather than having trouble with one big part of my project, I had trouble with little bits and pieces of my code here and there. Whenever I’d make a change here, something else would happen there. Other times, I’d forget that I made a change on a certain section and didn’t implement that change on my other views. This obviously pointed to a disorganized, chaotic process and not only was my project all over the place, but I was as well. This was a stark difference from my previous experience with my first project, where albeit my initial worries, my code and mental state felt very much organized.

As uncomfortable as this muddled state of mind was, it truly was a learning experience. Despite all this, I must admit I was quite proud of my work at the end of the day, as I showed off my accomplishment to my family and friends.

Sign Up Page
User’s Home Page
User’s Entries Page

As you can see, as I finished up completing the backend portion of my code, I focused a lot (okay, maybe a little too much…) of my remaining time on the frontend and visuals.

Rack-Flash

One seemingly easy task that I for some reason kept struggling with throughout my project was how to get Rack::Flash working. There were times when the flash message would appear as I expected, and other times when it didn’t. But what is programming without debugging? 🤷🏻‍♀️

I wanted my flash messages to look like error messages. So with the power of CSS, I made it look like the following:

Can you see that tiny little yellow highlighted text on the top?

“You don’t have access to that user’s entries.”

Yup, that’s the flash message! This message would only appear if a user were to try to access another user’s entries. The code behind the message essentially blocks them from being able to hack that user’s account.

Line 53 — the code behind the flash message in my User Controller

While I was able to find out the reasons behind why flash wasn’t working as expected, the process of debugging was a headache itself. The reason I continuously had issues with my flash messages was due to the if/else statements they were sandwiched between. Since the RESTFUL and redirect routes were intertwined with each other, if the user was NOT logged_in, my app would signal flash[:signed_out] (on line 57) and redirect the user to the login page. However, if the login page had a separate flash message (such as “Please log in” for users who were not logged_in?, then the message of “Please log in” would appear, rather than “You’ve been logged out. Please log back in.”

My Overall Thoughts

Having been jostled mentally and emotionally left and right from this project, I’m very much looking forward to our week of break before we begin our next phase. As I’ve stated previously, this project truly was a learning experience for me, both in terms of programming and wrestling with my inner chaos. Going forward, I’ve learned that consistent organization throughout the entire project is a must. I previously believed that as long as I carefully planned out my project in the beginning, continued organization would follow. Oh, how wrong I was. In my haste to fix their respective bugs, I found myself jumping from one controller to an index view and then to a show view and then to the other controller. As this was only my second project, I have yet to understand if this is very normal or if my programming process is simply disorganized. I guess only time will tell. 🤡

--

--

Jenny Kim

I’m a recent graduate from Carnegie Mellon University with a business degree, currently attending Flatiron School for Software Engineering!