Sinatra Web Application:

Welcome! Today, I’m going to tell you a little about the next thing I accomplished as a student at Flatiron and my struggles I had to overcome to get where I am today.

The goal of this project was to build a Sinatra web app that met the following requirements:

• MVC: Model-View-Controller layout
• CRUD: Create-Read-Update-Delete functions
• REST: Representational State Transfer

I thought this project was easier to accomplish than the CLI project, but the concepts and the why behind it all is where the challenge came along. Let me tell you a little about what I had a hard time understanding…. REST and Routes. What happens when you as the client, type in a url and click ‘enter’?

Using the world wide web is something that’s become an everyday occurrence, whether on your phone or a laptop. Let’s say we need to search on www.google.com about plants — we send a GET request! I understand it as “Go get this site and render Google so then I can send another GET request to find plants”.

When you as the user or client sends a request to the server, you are implementing the first part of representational state transfer or REST. Then comes the second part, which is the server responding with a representation.

Here is a chart to help you understand:

Restful Routing by Jason Arnold

This chart really helps you visualize how to connect the dots! It'll even help you connect it to the basic functions of CRUD: Create, Read, Update and Delete. Can you connect that to the HTTP verbs: POST, GET, PUT/PATCH and DELETE?

CRUD => HTTP VERBS:

• CREATE => POST request
• READ => GET request
• UPDATE => PUT/PATCH request
• DELETE => DELETE request

Did you connect the dots? Keep in mind if you fall outside of Restful convention, you can always use a different route that fits your application. The hardest part I couldn’t get past, was naming routes something outside of restful convention and connecting them to the right HTTP verb. YOU can name your route whatever you would like, i.e. ‘/profile’, ‘/signup’ … if it correlates to the action that you were requesting. You just want to keep in mind what the user or client is going to think about when they type in the URL. Ask yourself as the inventor of the web app, what makes sense? The more you practice the better you’ll get at this.

Though we compare the HTTP verbs to REST, know that they are not the same thing.

REST != HTTP

Remember REST is technically just the architectural style that correlates to HTTP. The clients and servers talking to each other like in a similar diagram below we like to call MVC:

See how everything is tied together? Such a tough concept to grasp all 3 at the same time, so give yourself GRACE when making your own project! It’s a learning experience.

QUICK SHOTGUN TIP: I personally ran into this a lot during my experience making my project… If you ever run into a ‘PORT IN USE’ error when trying to run shotgun. All you need to do is run the following:

• Get the PID number from your terminal by running:

lsof -i :9393

NOTE: 9393 is port used when running Sinatra — this could be a different number depending on the program used

• Run kill with your PID number after it:

kill PID-NUM

• If this doesn’t work, you can kill the port more destructively with no exceptions (but this can affect other things — USE CAUTIOUSLY)

kill -9 PID-NUM

Thanks for taking time out of your day to read my blog on some of my struggles while making my Sinatra web application — now it’s time to study and kill that exam!