Category Archives: Code

Simulating Bicycle Light Using CSS and Vanilla JS

My bicycle’s rear light inspired me to create a pen. In this pen, I’m exploring the LED/neon light effect that CSS can create using simple animation and box-shadow properties. The most challenging bit is to decide what colour the LED circles should be when it’s off. Or how to decorate the box shadows to delineate […]

Implementing Caesars Cipher in Javascript using ES6 Syntaxes

What is Caesars Cipher? The particular constraint for this exercise is ROT13 algorithm (rotate by 13 alphabets), and only use upper case letters. Here is my quick implementation: The numbers inside the if statements of the code above are ASCII codes that correspond to the uppercase letters of the alphabets.

Micro Coding Exercise Using CSS Grid, Web API and Vanilla Javascript

This afternoon I came up with a useful coding challenge after spending some time reading about Web APIs – make a battery status using CSS grid, Web APIs and vanilla javascript. I created this small pen. The idea is to use a grid with fours rows, each row represents a quarter of battery life. Using […]

Check If a Phrase is Palindromic in Javascript

I completed this exercise from Free Code Camp today. In essence, it’s palindrome checker that will return TRUE if a word or a phrase is a palindrome (minus all numbers and special characters), or FALSE if it’s not a palindrome. I applied all the recent Javascript lessons I have revisited recently to check if a […]

Mapping Nav Components into a Navbar Implementing React Router

I was tinkering with a way to map Nav Components into a navigation bar in React by utilising map() function. The original code looks like the following: We can do an abstraction for the following lines of code: To do so, we can create an array of objects with properties of name and path. Let’s […]

Create a New Javascript Object by Destructuring Existing Objects

I learned some new Javascript methods this week which I think are very useful. Imagine a scenario where you have an object of customer and object of a shopping item, in the example below, an Adidas T-shirt. You can deconstruct the properties from the two objects and combine them to create an order object. The […]