The Vast Horizon of Discovering Code & The Importance of Event Listeners
By Cal Rhoads
When I began my coding journey less than three months ago, I knew I was in for a challenge. A challenge that would take me through ups and downs, but ultimately give me the tools to progress in an industry that had always captivated me. The ins and outs of JavaScript alone have already shown me the density of what I will need to accomplish to fully understand how to create something great. I eagerly embrace the challenge of utilizing this blog as a platform to document my journey as a novice developer, sharing my advancements and providing insightful explanations about a fundamental concept that has particularly piqued my interest—Event Listeners.
Why Event Listeners?
To me, the most profound piece of the puzzle when learning code has always been the immense possibility of what can be created. Webpages, software, video games and so many more are only the tip of the iceberg once you realize what can be accomplished with code. A good programmer could develop anything from utility software that accomplishes great financial gains in the workforce, to a relaxing video game that allows players to immerse themselves in an entirely new world after a long day. If we think about the users of the software, then we realize that the way they interact with our creation is of utmost importance. Event listeners create a format for something not only to be displayed and browsed through but to be interacted with modified and used for so much more. It has been my favorite topic of study since I began my venture into the world of coding and I'd like to share some examples of what I've learned as well as why I feel so strongly towards it.
My First Event Listener
const dodger = document.getElementById('dodger');
dodger.style.backgroundColor = '#FF69B4'
function moveDodgerLeft() {
const leftNumbers = dodger.style.left.replace("px", "");
const left = parseInt(leftNumbers, 10);
if (left > 0) {
dodger.style.left = `${left - 1}px`;
}
}
document.addEventListener("keydown", function(e){
if (e.key === "ArrowLeft"){
moveDodgerLeft();
}
})
function moveDodgerRight() {
const leftNumbers = dodger.style.left.replace("px","");
const left = parseInt(leftNumbers, 10);
if (left < 360) {
dodger.style.left =`${left + 1}px`;
}
}
document.addEventListener("keydown", function(e){
if (e.key === "ArrowRight"){
moveDodgerRight();
}
})
Although a simple block of code to move a dodger on an HTML page, this lab was my first glimpse at what can be accomplished through event listeners in code. I remember my excitement when I wrote this during my pre-work and realized that I had just created a video game in the simplest of terms. The ability to customize my page via styling only added to my interest, and I saw for the first time a better understanding of how code in some of my favorite video games comes together to create the pieces of art that I hold so dear in my life. Understanding the moveDodger functions and how they are relative to the number of pixels in their environment truly inspired me to continue learning until I can grasp the concept of the code in larger productions. I am very excited about my coding journey and I can't wait to reach the peak of the current mountain so that I can begin my climb onto the next and so forth.
The Continuous Growth of Passion
The concept of coding always struck me as something very intimidating. Throughout my educational career, I always gravitated away from computer science due to simply thinking it would be too difficult, even though I had always been extremely excited about the topic. Now that I have begun learning code and scraped the surface of what can be accomplished, I have realized why I've chosen this path in my life. My origin of interest in code has come from my love of video games. My dream job has always been to learn how to develop video games for myself and to create my version of the games that I loved so much growing up. Not only this, but the knowledge I'm gaining over different software and different ways to develop is creating a brand new passion for me that I never knew existed. The possibilities are endless and I am nervous, yet exuberated over how much progress is still to come.