When I first saw the Final Projects for the object orientation section of my program, I was intimidated. OO was hard! And creating a CLI gem just sounded like a lot at the time. I felt differently upon reaching the Sinatra assessment. The project requirements seemed simple enough: create a CRUD app using Sinatra and ActiveRecord. As the labs building up to this project had made me do this several times over, I felt ready to create my own. Actually pulling it together wasn’t simple by any stretch, but it was certainly not as intimidating as the CLI gem (which I’m still working on!).
Specific Project Requirements:
- * Build an MVC Sinatra Application
- * Use ActiveRecord with Sinatra
- * Use Multiple Models
- * Use at least one has_many relationship
- * Must have user accounts. The user that created the content should be the only person who can modify that content
- * Models must have validations to ensure that bad data isn’t created
- * Any validation failures must be shown to user with an error message
First off, here’s a video walkthrough of me using the finished app (~ 3 min). I used the free versions of Screencastify & WeVideo, so pardon the multiple watermarks. I am into the free WeVideo jingle though – reminds me of the intro to Frasier!
In it I run through:
- * New user signup
- * Adding a new pattern
- * Editing a pattern
- * Deleting a pattern
- * Logging out
- * Logging in as another user
- * Trying to see someone else’s pattern
- * Trying to edit someone else’s pattern
I tried to use the app realistically, so in it I’m kinda slow and you’ll see the cursor go to the upper right a few times so that I can copy and paste the pattern URLs. For the last parts, where the user tries to see and change someone else’s pattern, you can’t see the URL in the screen.
Sooooooo…unlike the first assessment, which was a CLI gem data scraping project, I felt like it didn’t really matter what I chose my Sinatra project to be. Whatever I chose, building a Sinatra CRUD app would involve similar setup and follow through, give or take some naming. I mean, I think the point of working on Sinatra CRUD apps over and over again was to see the patterns (setting us up for Rails…). Still, I wanted my project to be meaningful to me, so I decided that I would create an app to track my knitting. Yarn was the first thing that came to mind, as I have an extensive and expensive collection, but really what I’ve needed lately is a place to track my patterns. I know, I know, I should be using Ravelry, but whatever.
Anyways, I decided to track the following major pattern details. I also wrote notes about what I would like the input form to look like.
- * Name of Pattern – text field
- * Item Type or Category – checkboxes?
- * Free or Paid pattern? – checkboxes? Free/Paid? Or Paid? Yes/No?
- * Pattern URL – text
- * Suggested Yarn – text <– maybe add an option for link to yarn
- * Yarn weight – checkboxes
- * Guage – text
- * Needle Size – text? There might be too many options to list.
- * Yardage – text
- * Pattern Notes – perhaps a larger open text area?
Getting started with a brand new project is always tricky. In the past I’ve tried to wing it, building files as I needed them, but I tried to be more deliberate this time. In Google Docs I sketched out the files that I thought I would need, which ultimately turned out to look like this:
And a closeup on the models, views and controllers:
Models: I knew that I would have users, and that users would have many patterns. So there would be a pattern & a user model.
Controllers: Likewise with controllers, I would have a user controller and a pattern controller, both inheriting from application controller.
Views: In each Sinatra project, views is where I have to think a bit more carefully. I knew that I would have an initial landing page, where you would go when you are not logged in (index.rb). I also wanted a layout.erb template, just so that I wasn’t copying over basic HTML on every erb file. There would have to be views for patterns- viewing, creating, and editing. And for user, a sign up page and a log in page. I could have also made some failure pages as well, but decided to keep it simple.
Issues I ran into
- * I added in two methods that gave me some info about the user- is_logged_in? and current_user. However, I ended up getting confused about where would be best to put them. To get things working, I copied and pasted both methods into both User & Pattern controllers. Later I moved them around, ultimately settling on having them as a separate module which was included in the user & pattern controllers. Actually, if I think about it further, I could have just put the methods in application controller. EDITED TO ADD: I went ahead and made this change.
- * I’m not great at HTML forms, so I spent a bit of time brushing up on forms & all the cool things that you can do with them. I ended up changing my checkboxes to drop-down menus, which lead to a cleaner look, which I think was important since there was so much on the page. Also, checkboxes didn’t really make sense since I didn’t want a pattern to have more than one category.
- * Not really an issue, but as I set up my form, I found myself seriously questioning whether each detail I was tracking was really necessary in order for my app to be useful. In the end, I threw out “guage” since I couldn’t imagine myself actually typing in guage, or needing to sort by guage in the future.
- * I had a bit of trouble figuring out how to add specific error messages. After doing some googling, the Sinatra Flash gem seemed like a simple solution. However once I’d decided on using it, actually implementing the gem took me a while. The gem documentation pointed out that when using Sinatra::Base for my controllers, I needed to also register Sinatra Flash. Duhhh. Always read the documentation. Once I added “register Sinatra::Flash” into my Application Controller under configure, it was on! Yay! Then I worked through all the routes in my controllers and added relevant messages for each, such as “Your pattern has been deleted” or “Sorry! Your username or password were not recognized. Please try again”. Riveting stuff, I know.
Thoughts
- * I enjoyed the iterative process of creating this app, going down each rabbit hole that the user might encounter. I think that I “enjoyed” it so much because Sinatra gave such descriptive error messages. So helpful.
- * I cleaned up the initially very plain looking app with a little CSS and by adding a cute cat image (covered by watermarks in the video), but making pretty user interfaces is not my strength (or interest!). I’m trying to remedy that by learning a bit more about basic design principles, using TreeHouse’s design fundamentals workshop.
- * As far as next steps, I would like to update my app so that I can edit an entry without refilling out ALL of the entry.
- * I’d like to have the option to search through my patterns by project type and yardage.
- * It might be nice to go ahead and incorporate yarn inventory tracking into this existing app so that it’s more useful to me.