The Javascript project...

Posted by Erik on April 18, 2020

I daughter is aroud 18 months and is learning new words every day, which is awesome. And with this project I had the idea to create an application that would allow me to record her speaking the words and keep track of when she learned them. And as she grows maybe allow additional recordings to keep track of the progress. I currently have the project at the point where I can start adding the recording and storing of sounds. I plan on doing this as a side project after the project assessment.

As for the project, I felt like this was a really good introduction to JavaScript. I actually feel somewhat comfortable coding a project in OOJS and am confident that the next project I make will be a much smoother experience. I definetly struggled with error handling and organization, both of which will improve with practice. For error handling I feel like my biggest mistake was that it took me a while to realize that often the error isn’t in the code you just wrote but somewhere further up the path leading to that code. What I eventually started to do was leave console.logs in my code at major points so when I came accross a new error I had already narrowed down the starting point. Then I just followed the code from that point, checking to see that the values I wanted passed along were correct.

Organization in OOJS is still a bit of struggle for me. What I ended up doing for the project was to try and break up JS first into sections and then into parts. The sections I chose were models, services, and components. The models files were intended to deal with the frontend’s version of the backends models. In my case I used a User and Child class to handle their logic. The services I used were API, Auth, and DOM. The API handled all contact between the front and backend, the Auth class handled logging in and out and setting the current user, and DOM class was responsible for adding items to the DOM. Lastly the component section was used for the navbar which was for setting up and maintaining the navbar. This seemed to work pretty well but I often found myself writing extra methods to try and keep this structure. I personally feel like I could have gone further and broke out forms and and some other items into their own concerns. Also the service classes seem like a lot of their code made to be used pretty universally and be passed from one project to another (which I think is what React and Redux do). Organization inside each class is still an issue for me and I might start using comments as bookmarks to help navigate the larger files more efficiently.

The Rails API seemed to be a really quick and easy way to set up a backend API. I did use the scaffold generator to get started and feel like it gave me too much extra code so I may try skimming it back a bit in the future. I do like binding.pry and wish that JS had it as well. I am impressed with the amount of info you can pass with custom serializations, including class methods. This allowed me to pass pretty much everything to the current user as they logged in so I only had to make fetch requests when needing to make changes to the database.

Conclusion, JS will take a lot of practice to get comfortable with and being organized and learning how to efficiently fix mistakes will make that journey much more enjoyable. While JS can certainly be frustrating, I really enjoy working with it and look forward to learning React and continuing to work on my project.