By: Karen Snyder
Cameron explained that Knockout JS uses the MVVM (Model-View-ViewModel) pattern, which consists of the Model (application data such as back-end SQL tables), the View (HTML/CSS files for the web page structure), and the ViewModel (interface between the Model and the View, implemented by Knockout JS functions in this case).
Then it was time for the first project of the week, the Change Calculator that I had already done in C# as a Console and WPF application, but this time implemented as a Web application. It was a good way to become familiar with how to set up the necessary folders and files, and what tools can be used to make the process more efficient.
I learned how to use the Bower tool to automatically download files and place them in the appropriate folders, so I don’t have to manually download the files for each package that I want to use in my application. However after the files are downloaded, I still have to edit the index.html file to include them. There’s probably a way of automating that, I just have to find it!
I became more familiar with using Bootstrap, which provides ready-made components that can be used on a Web page. This enables you to set up a Web page in a lot less time than if you had to write all the HTML/CSS for each element yourself. I was also pointed toBootswatch, which provides themes to enable changing the look of a Bootstrap-built Web page quickly and easily. I think it makes sense to use time-saving tools like these, as they help to get Web pages set up quickly and efficiently with standard components.
Armed with this knowledge, the next project was to build a Movie finder Web application, using the Open Movie Database API. The database includes TV shows in addition to movies, so I built an application that enables searching for only movies, only TV shows, or both. I was starting to get more comfortable working with front-end design, and using Bootstrap and Bootswatch, as well as my own custom CSS file, to improve the look of the Web page.
Then it was finally time to work on the front end for the LargeBank API that I wrote last week, meaning that I would be completing a full-stack Web application and I would be a full-stack Web developer! I learned that it was necessary to make a change to the LargeBank API involving CORS (Cross Origin Request Security), in order to enable the Web application to use the LargeBank API to get access to the LargeBank database.
Our guest speaker this week was Nicholas Head, the Director of Software Development atHireaHelper, a company that helps you to compare prices for moving companies, and book a truck or moving company. He is a self-professed computer nerd/geek, who started programming at a very young age, and has had a rewarding software development career without a college degree, although he was told in high school that was not possible. He gave us an overview of the software system at HireaHelper, explained the daily routine of a software developer, and advised us on how to become awesome software developers!
Then Cameron assigned us the weekend project, a full-stack Web project to implement a Guestbook that displays messages and allows new messages to be added. The project requirements including setting up the SQL database, writing the API for the database, including a unit test for each method, and building the front end with Knockout JS. I decided that my application would be for visitors to Iron Gym to leave comments about their awesome workouts!
I got the SQL database and the API including the unit tests done on Friday, and yesterday I started building the front end. This was the first project where I used images on the Web page, so that was a learning experience too, finding Websites with images that were either not copyrighted, or were licensed in a way that I could legally use them (e.g. Creative Commons licenses). I completed the basic functionality, along with adding some animation with the help of animate.css, but I still need to do some tweaks!