Week 1 (June 10 - June 14)

We started our first day with general good practices at work regarding efficiency, ergonomics, and taking breaks. It is important that I choose a good keyboard that does not hurt my hands and wrists over time, that I make sure the top of the computer screen is at my eye level to avoid neck pain, and that I choose a mouse that will help me perform tasks efficiently and quickly. Although the advice to maintain a good posture when sitting for extended periods and to take breaks is something that is commonly known, I never experienced it until on the first day. Sitting for most of the time during the 8-hour shift in front of the screen strained my eyes, made my mind foggy, and left me exhausted at the end of the day. I also felt like the little breaks that I would take in between actually helped me a lot in reorienting my thoughts and making me feel more awake.

As the week progressed and we were assigned issues inside the CELTS program, we learned about the flow of the system used in the program. The flow of the system used for the Celts Program flows from View to Controller to Model then from Model back to Controller to View, and the Controller step cannot be avoided for security purposes. View is what the user sees and interact with, Model is what holds that data, and since it would be messy and unsafe to allow uses to directly manipulate the database, the Controller is one that take requests made by users, checking for issues in those requests, and bringing that data back from the database for users to view. Later in the week, we also had a mini lesson on front end with HTML, CSS, and JavaScript and learned that while HTML display web pages and is used for content structure, CSSS is for styling, and JavaScript is for the behavior of the website. To execute this in the most efficient way for speed, CSS will be put at the top of the HTML page and JavaScript at the bottom since CSS loads first, and then JavaScript. Inserting JavaScript at the top and CSS at the bottom will make it to where the program will go all the way to the bottom and executing the CSS first, then going back to the top to executing JavaScript next.

The first issue that my partner and I worked on were about buttons on an HTML page, meaning we were dealing with issues related to View. I learned that Bootstrap’s grid system uses 12 columns across page, and deciding how many columns each of those buttons will take up at different screen size will determine how the html page will appear for users on big monitors versus on a cell phone screen. The second issue my partner and I tackled was a pretty easy fix as all we had to do was change the way certain names and titles were displayed on an HTML page. However, we were not able to get the page to display the changes we made, and it seemed like the specific data that we were trying to display was not working since other data were still displaying correctly. We asked for another co-worker for help, and everything was updated as he re-ran flask. This reminded us that before trying to immediately dig deeper, we must first make sure that everything is set up correctly and that the data are up to date. My partner and I also decided that it might also be a good idea to start writing out our ideas and the code that we want to create before typing it in directly inside the program because we usually have to make multiple adjustments from the initial code that we came up with, leading to us having to update the same lines of code over and over again.

Overall, this week taught me a lot of new things about front end and made me realize how long an 8-hour shift is, especially when I am staring at a screen for the majority of the time. It is also comforting to know that we are not on hard deadlines to fix issues in the program like when we are in a classroom setting. This gives us time to really understand the problems and try to come up with the most efficient solutions. I am excited to see how next week will be and what new problems I will get to solve.