DEV Community

Cover image for Sinatra - hold the Frank
Gia Jennings
Gia Jennings

Posted on • Updated on

Sinatra - hold the Frank

Let me start by saying I'm not sure which might have been more challenging, Frank Sinatra producing timeless music or building a Sinatra web application. However, I'd like to say the latter was definitely challenging enough.

Sinatra is a Domain Specific Language used to write web applications. Although it was fairly difficult to build, the architecture was actually fairly simple to follow and that's what I'd like to expand on in this article. Let's jump right in.

MVC

I utilized the MVC design pattern to build this web app; MVC - model, controller, view.

1. Model

Models directly interact with the database. In my app, where a user can track a run, I created models for each. As I said earlier, the models responsibility is to interact with the database. Well to do that, each model must know how it's associated to the other. For example a user has many runs and runs belong to a user. Additionally, each model is responsible for its own validations. For my app, a run must have a date, distance, and duration in order to be tracked.

Alt Text

2. Controller (I know it's MVC, but the controller is the middle man)

Controllers are used to connect the models and the views; the middle man. Here, I used approached each controller on the basis of separation of concerns. For example, the sessions_controller.rb was responsible for the routes related to logging in and logging out. Additionally, you'll see I used .authenticate which is provided by the macro has_secure_password. I also utilized a flash error to assist in guiding a user should he/she make a mistake.

Alt Text

3. View

The views display pages based on the user's input. Essentially, as the user is interacting with the web app, different routes are being accessed and directing the user to different pages.

In the example below, based on the user clicking on the Sign Up button, the /users/signup route is triggered and the signup.html.erb file is accessed to display this page.

Alt Text

The MVC architecture is a great way to stay organized in both planning and building a web app. Feel free to check out my Github Repo to help guide you on your web developing journey as well!

Top comments (0)