Flatiron Phase 4 Project

Megan
2 min readJun 21, 2021

Requirements

We were given four requirements for this project.

  1. It needs to have a JavaScript frontend and a Ruby on Rails API backend.
  2. The frontend must be Object Oriented.
  3. In the backend, there must be at least one has-many relationship.
  4. There must be at least 3 AJAX (async) calls from the frontend to the backend.

My Project

For my project at flatiron, I built a single page application where a user can view or add wine by varietal. The object model relationship is a varietal has many wines. I added the Active Model Serializers gem to serialize the data and make it easier to read.

On DOMContentLoaded, I have two functions (one for wines and one for varietals) that send a fetch request to my APIs. The third AJAX call is a post request that creates new wines.

Wine fetch request

In this project, I struggled the most with appending elements to the page and finding the correct parent elements to make it look the way I want. After a lot of trial and error, everything looks exactly the way I want it to.

--

--