I recently made my first investment in Bitcoin; A minuscule sum in comparison to the sums retail and institutional investors have been putting forward.
My plan is to grow my position slowly and hold it for many years. I doubt anyone can confidently say what the price of Bitcoin and other cryptocurrencies will be in the short term. It is always hard to time the market, which is why I am dollar-cost averaging.
The first time I became aware of Bitcoin and the blockchain technology was during the 2017 Bitcoin bull run. …
Once I decided to introduce dark mode to my website, I realized I had to have a light mode and a dark mode style for the same component in many instances throughout my code.
Instead of duplicating the same CSS for both the light and dark mode styles, I utilized Sass mixins to define styles that could be re-used throughout my stylesheet.
I added an argument to the mixin that specified the theme (dark or light mode) and based on that the corresponding background and font colours were applied.
The mixin was defined with the general properties for both…
I used the flow-grow property to align the last item at the end of a flexbox with respect to the preceding flex items.
If you need to align some elements within a relative container, it is more likely than not that you are using the CSS flexbox module. It’s amazing how flexible and neat this module is. I remember when I used to align items using
Let’s say you have a couple of tabs in a navigation bar, and you want all but the last item to be on the left of the navigation bar, while the last…
When you think about electric cars, the very first thing that comes to mind is Tesla. It has singlehandedly revolutionized the auto industry. The inevitable switch to electric vehicles and huge potential growth of the market is giving rise to many new auto companies.
One such distinct example was Nikola, and until very recently it was heralded as an up and coming pioneer in zero-emission vehicles.
Founded in 2014 by Trevor Milton, Nikola was deemed as the next big thing in the electric and hydrogen vehicle market, boldly promising to bring breakthrough hydrogen and battery cell technology to power its…
As part of a personal project, I was working on a page where the user could add new posts about beers they tried. And in the form for the new post, I added the option to rate the beer via star rating.
useEffect is to functional components what
componentDidUpdate , and
componentWillUnmount are, combined, to class components. It is a method responsible for all the so-called side effects that occur during the lifecycle of a React component.
Whether you want to make a call to an API, manipulate the DOM, or set up a subscription to sockets, useEffect is where all of that should take place.
Every single time your component re-renders, the useEffect hook is invoked anew. But what if you don’t want that to happen? What if you want to skip effects?
You can achieve that by…
If you’ve ever set up a Github Actions workflow on a repository, you will recognize the YAML file that executes steps upon any code you push to the repository.
These steps could entail building and deploying your code for production, for instance.
Above we define the steps for Github Actions to build the code in a node environment and deploy it to Netlify. This workflow is for my Gatsby code for my website. But what happens if I want to trigger the steps above on events other than pushing code?
I used Strapi CMS to manage content for my…
I wanted to build my website and have some semblance of a CI/CD pipeline in place to push changes from local development to production easily. I wanted to have a frontend and a backend deployed separately, communicating with each other.
I set up the Gatsby frontend site on Netlify, while the content was managed by Strapi deployed on Heroku. I also added customized webhooks to Strapi to trigger builds of the site via Github Actions workflows. …
I maintain this view as a beginner to intermediate programmer. Senior programmers, or programmers that are more gifted, are more in shape to design a solid code architecture before they proceed with any line of code, due to their sheer experience or talent. I am writing this for us average programmers.
I really believe that getting a minimum viable piece of code working quickly, despite being ridden with some flaws, is invaluable and preferable to thoroughly planning your code structure at the outset. There is an immediate sense of gratification. …
Memoization is the technique of storing the results of computationally expensive operations. When the operation is invoked again with similar inputs, the stored/cached results are returned, rather than executing the function anew.
In React, memoization can be utilized to optimize calculations every time a component is updated and re-rendered.
UseMemo is a React hook that was made exactly for that.
const memoizedValue = React.useMemo(() => computeSomething(a,b),[a,b]);
useMemo receives two arguments.
The first is the expensive function to be executed, and the second is an array of dependencies. …