The JSourney: Learn with projects, not videos!
Tags: writing, javascript, codenewbie, webdev
Published: 2020-09-28 04:14:05

The JSourney: socket.io

# Introduction

Ok, so don't get me wrong, I am not a good developer but let me tell you, the last 4 days has been one of the most interesting & fun 4 days I've had for quite a while. Let me go with a little backstory here. I decided to actually start learning JS instead of lying to myself that I know what's going on. I was living with a big Codepen, Stack Overflow, Google: How to ____ Javascript, lie. Shameful isn't it... Anyway, so I started looking here and there for JS tutorials but not a single one caught my attention. However, I remembered that there's this guy (some of you most probably already know him) that goes by ChrisOnCode. So this guy has a website - [Scotch.io](https://scotch.io). And in this website, there's a 'Learn JavaScript from Scratch' button. The content? Boy, oh boy... was it top 🔥. It was straight to the point, clear, and with real-life examples on the record. It was just what I needed!

# The JSourney

Well now, I am 1 hour in and everything seems pretty much fine. I demolished the 'let' keyword as well as the 'querySelector' method. I'm staying there daydreaming of how many awesome things I can create as soon as I learn more JS. I was always amazed by the superb([this](https://ncase.me/trust/) for example) projects you can create if you are actually good with JS. And here comes the crucial moment that made me leave every project I am currently doing and sell my soul to the JS devil. I got to a lesson called "crazy buttons" where Chris creates a button which, when hovered, moves to a random location within the document. This was it. This is what I want - a button that moves when clicked. FOREVER... And up we go!

# Singleplayer crazy button

I managed to get to the end of Chris's course and I was still feeling insecure about starting my own project but I didn't let that take control over me. I was going to create the crazy button game and upload it to my [website](https://asciinaut.sh)! So I opened my 'crazy buttons' folder and gave the HTML a touch, added some styling to it, and *puff* - it looks cool! Then I started practicing my newly acquired JS skills by changing the style of elements, adding classes, and updating the score when the button gets clicked. A couple of hours in and I finished my little web game. I called it 'Aim Trainer'. You can give the singleplayer version of it a go on my website [here](https://asciinaut.sh/hit-me).

# "Wait, how are .io games made?"

And then a thought entered my mind. A simple thought I never seemed to google before. Okay, I had a single-player game I can play but how are .io games made? How are people seeing the same page and how does this page update realtime? Give me a moment, let me google that. Sockets... real-time... io... express... node... okay, I think I got it. Let's get to work. Google this, watch that... *3 days later* *puff* - [a multiplayer version of my game](https://theinternetbutton.asciinaut.sh/). And more importantly - more JS knowledge! I am not going to fall into details on how I gave my crazy button the ability to replicate itself on a number of screens. At least not in this post. You can read the full tutorial [here](https://dev.to/denislav__/how-to-use-socket-io-not-the-chat-3l21). Oh, and for the record - I tried to build a multiplayer murder mystery game before creating the multiplayer version of the button one. Unfortunately, my skills are not good enough for a big project, and for the time being, I decided to stick with the small ones.

# "I did it. Somehow, it worked!"

In a conclusion, I want to say that these 4 days have been a blast and I am looking forward to more of these. I learned a lot, I finally finished a course from beginning to the end, and most importantly - I applied the knowledge into my own project. A valuable lesson I could share with all of you is to go out there and start a project. Stop stressing about the skill level & knowledge gap. You will finish it, one way or another!

I am grateful to all the people who helped me, even indirectly through posts & comments on forums. As I already stated in one of my posts - if you are active in the tech communities, please continue, we appreciate it!