[DAY 18-20] I Built A Game & A Calorie Counter In Javascript

#beginners #learning #javascript #webdev

Hi everyone! Welcome back to my blog where I document the things I learned in web development. I do this because it helps retain the information and concepts as it is some sort of an active recall.

On days 18-20, I built a text-based role-playing game and a calorie counter to learn basic Javascript concepts and form validation.

10 things I learned:

JavaScript interacts with HTML using the syntax document.querySelector() and document.getElementById().
Initialize buttons with object properties such as .onclick (e.g. button.onclick = myFunction)
The use of arrays [] and objects {} in building my role playing game.
- Utilizing key-value pairs within objects.
Refactoring such as using compound assignments for clean code.
Adding newlines in Javascript using \n.
Block scoping where I put a variable inside a code to only be accessible inside that block.
Regular expressions to avoid non-alphanumeric characters in building my calorie counter.
More method calls like .replace(), .Number(), .toLowerCase(),.addEventListener(), etc.
Template literal syntax (e.g. string string string ${variable} ), this is a great alternative to concatenations.
To use ternary operators (e.g. const variableName = condition ? ‘if true statement’ : ‘if false statement’;)

Comparing my progress when I was learning HTML and CSS, previously, I was able to build 1-2 projects per day. But now in Javascript, I can only build 1 or complete half a project per day.

The reason why it takes longer than before is because for me, Javascript is harder to digest than HTML and CSS. Also, I’m taking more time to understand its concepts and learn the purpose of every syntax that freecodecamp is teaching me. Additionally, I take the time to understand the why behind every line of code that I write.

Overall, I'm having fun with my coding progress and day by day I feel the improvement and it helps a lot in maintaining momentum to keep being consistent in learning.

That’s all for now, thank you for reading. I’ll see you all next blog!