Hakeem Almidan

Problem Do you ever NOT feel like re-writing a command that you wrote some N commands ago? I do! Arrowing up and focusing until you reach what you want can be annoying for an efficient programmer. Although it usually only takes a couple of seconds, it still adds up. Plus, you don’t want to waste your brainpower on such a task (unless you like doing it). One of the best pieces of advice I heard when I first started programming is:

Table of contents What Why The Tools Show me the code What This is post is going to be referring to this custom promotion-code generating CLI’s code, and about useful tools that helped in building it. All the tools mentioned are native to Ruby (no external gems were used) The data generated is going to be stored in a JSON object, and has the following format: "<FirstName LastName>": { "code": "String: Generated code", "activated": "Boolean" } You may think “Wait a minute there, that’s not a scalable solution, isn’t it?

Have you ever noticed that puffins often simultaneously carry multiple fish in their beaks at once? It’d be something like this: Puffin with multiple fish in beak (Source) I thought this was interesting, and I had so many questions, including: Do they catch them all in one scoop? How come the fish are so organized? Do they hide their food while catching other fish? Why do other birds not steal them?

Problem The slightest change in CSS animations (@keyframes) requires a creation of a new animation. Problem Example @keyframes to-yellow { 50% { background-color: yellow; } } @keyframes to-skyblue { 50% { background-color: skyblue; } } Both of the animations pretty much do the same thing, but we had to create two of them. We had to create two of them because their property (background-color) had different values (i.e. yellow and skyblue).

Problem The CSS hover state often gets stuck on mobile (touch screen) browsers. It would be something like this: Hover state getting stuck on-click on mobile Solution Using the ‘hover’ CSS media query, which could be applied either through SCSS or CSS. In the case of SCSS, we’re going to use a mixin. Here is each solution respectively: Option 1: SCSS Mixin The mixin: @mixinhover-supported { @media (hover: hover) { @content; } } Example use:

What are static websites? In simple terms, static websites are a collection of webpages that have fixed content. They are the most basic type of website and are typically considered the easiest to create. These websites are considered the easiest to create because they have a low barrier of entry. They usually are not connected to a backend or a database, so the only thing that you need to manage is the frontend.