My first phase of the software engineering program at FlatIron School was mostly not easy. Much of phase 1 entailed reviewing the prep course involving HTML, CSS, JavaScript, event listeners, and the Document Object Model (DOM). But that is as far as it goes. Few additional lessons were added to the previously mentioned, such as in-depth lessons in data structures, iterations, and methods.
The most "frustrating" lessons involved servers, APIs, and db.json databases, especially the fetch commands and asynchronous JavaScript. Understanding what an Application Program Interface (API) was—a sort of online database used to provide data to other apps and services—was a challenging concept for me at first. I thought of it as an outside repository full of detailed information that supplies data to your app or website. This understanding didn't come easily; it took me a while to grasp the full picture.
I started to look at the phase 1 guidelines, which made me even more confused. This confusion led me to mimic YouTubers who created simple websites using APIs and db.json. After a lot of research, tinkering, and experimenting, I began to understand APIs, db.json, fetch, and asynchronous JavaScript. I felt like a partial madman during this process, but I persevered.
Feelings aside, phase 1 focused primarily on building upon what was learned during the prep phase, cultivating in-depth knowledge and skills for HTML, CSS, and JavaScript (mostly JavaScript). The phase added new lessons on algorithms and servers (including APIs, db.json, fetch, and asynchronous JavaScript).
One of the key takeaways from phase 1 was understanding the importance of solidifying foundational knowledge before diving into more complex topics. The progression from HTML and CSS to JavaScript, and then to asynchronous operations and APIs, felt logical but required persistence and practice.
Detailed Lessons Learned
JavaScript Fundamentals: JavaScript was the star of phase 1. We delved deep into JavaScript's core concepts, including functions, variable scope, and data structures like arrays and objects. One of the key areas we explored was the Document Object Model (DOM), where we learned how to interact with and manipulate HTML elements programmatically. This phase also introduced us to JavaScript events and how to handle them effectively to create interactive web pages. Additionally, we covered essential topics such as asynchronous programming, working with APIs, and understanding the execution context in JavaScript. This comprehensive introduction laid a strong foundation for my journey into front-end development.
Event Listeners and DOM Manipulation: Learning to control the behavior of a web page in response to user interactions was fascinating. Event listeners opened up a world of possibilities, allowing me to create dynamic and interactive web pages. I spent hours experimenting with different events and DOM manipulation techniques, making my projects come alive.
Working with Data Structures in JavaScript: We focused extensively on understanding and manipulating data structures. Starting with arrays and their methods, we learned to efficiently handle data using functions like map, filter, and reduce. We also explored objects, covering creation, modification, and iteration techniques. These lessons were reinforced through various assignments and labs, including the Arrays Lab, Objects Lab, and Looping Lab. Additionally, we tackled advanced topics like traversing nested objects and object iteration, all of which were crucial for managing data in our projects.
APIs and Asynchronous JavaScript: This was the most challenging part of phase 1. Learning to fetch data from external sources and handle asynchronous operations required a significant shift in thinking. Understanding promises, async/await, and handling errors in asynchronous code were key skills I developed. By the end of the phase, I could confidently fetch data from APIs, process it, and display it on my web pages.
Project-Based Learning: The culmination of phase 1 was a project that brought together everything we had learned. I built a web application that fetched data from a db.json file and displayed it dynamically. This project was a test of my understanding and a chance to apply all the skills I had acquired. It was incredibly satisfying to see my hard work come to life in a functional web application.
Here's a repo link to phase 1 project:
https://github.com/xyzed3k1ah/phase-1-project
Top comments (0)