JavaScript, alongside HTML and CSS is one of the three legs of web development. HTML defines the content, CSS the styling/layout and JavaScript defines the behaviour of a webpage. Recently I have realised that my web development tripod is a bit wonky. I studied JavaScript at university, I have barely used it since, only occasionally in frameworks, such as Bootstrap. I also used Flash ActionScript, which is a similar language, in my day job developing automotive touch screen interfaces, but even that was ten years ago. Instead I have kept all the logic of my websites server side, using PHP to control the behaviour, which is still a valid way of doing things, but I should not be relying on it.

JavaScript has evolved since I used it – frameworks such, as Vue and React, have become the mainstay, the “ES6” has come along – replacing “var” with “let” or “const”, and you can even run it server side with Node.js. JSON (JavaScript Object Notation) also seems to have largely replaced XML. Basically JavaScript has matured and seems to be here to stay! Therefore I decided it was about time brush up my skills. Before I tackle frameworks I wanted to get get the basics right, and refresh my vanilla JavaScript knowledge. Whilst looking for inspiration I came across 30 days of JavaScript, which seemed to be pitched at my level – knowing the basics, but needing to improve. I learn best by working on projects, so the thought of thirty small projects to work on really appealed to me.

You may be able to tell from recent posts (HKT Winter Defiance Handbook and Godiva Trail Riders Lockdown Challenge) that I like to set myself a challenge. So as April has thirty days, and there are thirty exercises, I am going to try to get them all done in April! I am aiming for one per day, but I may have to catch up/get ahead of myself depending on other commitments. I will post again at the end of the month, with my progress, what I have learned and which exercises have been my favourite.

I have completed the first challenge, the JavaScript drum kit at the top of the page. The content and structure were cloned from GitHub and the challenge/tutorial was write the JavaScript to capture the keyboard presses and assign them to the corresponding sound file, then play it and add the animation. It was definitely at the right sort of level for me, I needed to look up a couple of things to understand what they were doing, but learning is the main goal behind this challenge. Possibly the hardest thing was getting my Visual Studio Code set up for debugging JavaScript – switching to Chrome, after reading this guide, seemed to do the job. Hopefully over the course of the month I will be able to see if I can get debugging working in Firefox or even Edge.