Phase 3 Final Exam for Flatiron School

Nate McGraw
3 min readDec 3, 2021

For the final project of phase 3, we were tasked to create a webapp that fit the following requirements:

  • Use Active Record to interact with a database.
  • Have a minimum of two models with a one-to-many relationship.
  • Create API routes in Sinatra that handles at least three different CRUD actions for at least one of your Active Record models.
  • Build a separate React frontend application that interacts with the API to perform CRUD actions.
  • Use good OO design patterns. You should have separate classes for each of your models, and create instance and class methods as necessary.

For the models, I had initially thought to do customers of a store and orders that need to be filled. Then I realized that the orders would need items so that was going to be another table, then I would need one more for the contents of the order. Needless to say, i went a little over the top on this assignment.

When the user first opens the app, they are presented with all of the items in the database. Clicking the add an item item brings the customer to a form to add a new item and clicking on one of the items brings up a webpage that presents a user to page that displays the image, name and price of the item and gives the user an option to edit or delete the item.

Going to the users section displays a list of the users in the data base by name and address. When one of the users are clicked, it brings the user of the webapp to a page displaying the user’s information as well as a list of orders that they’ve made.

From this page, users can delete the user or update their contact information as well as access the orders that that user has made.

When accessing the orders page from the navigation panel, the customer is brought to a page displaying a list of all of the orders and clicking an order brings you to the same page as if they’re accessed from a user page.

On the order page, the user is able to select who the order should ship to as well as adding, modifying or deleting the items in the order or deleting the order entirely

--

--

Nate McGraw

Software Engineering student at Flatiron School by night, Help Desk Analyst by day