My Javascript project

For my fourth project at Flatiron, I was tasked with building a Single Page Application (SPA). My front end was built using a combination of HTML, CSS, and JavaScript. It communicated with a backend API that I built with Ruby and Rails. I chose to continue using my “Cannabis Journal” as the base for my project and I’m really happy with how it turned out.

To start I needed to create my backend. I had one has_many and one belongs_to relationship with my growers and strains. A grower has many strains and a strain belongs to a grower. Once I had that figured out I built my models and tables using the resource generates method to get a lot of stuff out of the way quickly. From there, I added my grower and strain serializers and CRUD methods to my controllers. The growers_controller only required an index, whereas in my strains I provided full CRUD.

Now it was time to move onto the front end of things. For my front end, I had a total of six files that I moved in between to get things up and running properly. The first I started with was my HTML file or the skeleton of the application. I added script tags for my other files and a link to my CSS style sheet. From there I added labels and input fields for creating a new strain which included name, category, THC, and CBD. There was also a dropdown provided to allow for picking a grower.

Next, I moved on to the index.js file where I defined variables like my form, dropDown, and various input values. I also added my strainCall and growerCall to retrieve my seed data from the backend. I also provided an event listener for when a user submits a new strain to be added to the backend database. I then moved to my strain.js and grower.js files to add various CRUD actions needed ad well as constructors to show data for strains. The strain_service and grower_service files connected to my backend and handled fetch requests made on the front. I finally added a new background color to my stylesheet to give my application a little more personality.

This was a tough project to complete, especially since I felt like I was just getting to understand Rails, but I’m happy that I completed it and am looking forward to learning more about Javascript in the future.