Forem: darrendube

Airline Recovery Post-COVID: What the Data Says

darrendube — Sun, 29 Jun 2025 21:14:03 +0000

The aviation industry was hit severely by COVID-19 in 2020 and 2021, with demand falling to about a third of what it was pre-pandemic. In my analysis of airline performance in the post-recovery period of 2022/23, I found that load factor (how full planes were) and aircraft utilisation (how much each plane flew per day) were very strong drivers of profit as measured by Earnings Before Interest and Taxes (EBIT). Additionally, full-service and legacy airlines earned more profit coming out of the pandemic than less established or low-cost airlines. However, this does not imply that full-service or legacy airlines recovered to pre-pandemic profit levels faster than low-cost airlines, as pre-pandemic profit was not controlled for in this analysis.

For the more statistically inclined, you may read my full analysis here.

Big profits for full-service airlines - with a caveat

Low-cost carriers earned less profit, on average, than full-service carriers – about $462 million less.

It is important to note that this does not imply that full-service carriers recovered faster than low-cost carriers – this analysis only considered absolute profit levels and did not control for pre-pandemic profit levels. It also does not imply that low-cost airlines were less profitable than full-service airlines – again, because absolute profit levels, not a ratio, were used.

Experience Pays

Older airlines earned higher profit: each additional year of age resulted in an airline earning $7 million more. This is after controlling for the airline’s size as measured by the number of routes, and whether the airline was a low-cost carrier.

More routes, more profit?

A 1% increase in an airline’s number of routes was found to decrease profit by a couple of millions of dollars (keeping the other factors in the model constant). In fact, an initially positive relationship (before accounting for any other factors) was found to change to a negative one after controlling for these factors. Factors in the model that may have confounded the initial relationship are load factor (indicating that airlines with more routes may have lower average load factors), and aircraft utilisation (indicating that airlines that overutilised their aircraft may have experienced lower average load factors). As the world was still recovering from COVID in FY 2022/23, it was perhaps the case that certain destinations (e.g. more "ourdoorsy" vacation destinations) were more popular than others, and airlines that better capitalised on this by focusing on those routes could overcome the disadvantage of maintaining a smaller route network than larger airlines.

The results of this analysis suggest that, overall, operational efficiency (particularly in how often planes flew and how full they were) may have been more important than airline size or type in determining profit. However, this analysis was based on a non-random sample of 100 airlines, restricting the number of statistical tools available in this analysis.

For a more comprehensive explanation and walkthrough of my analysis, click here.

Darren Dube - Data Science student at Stellenbosch University. Catch me on LinkedIn.

Data will never be clean

darrendube — Sat, 18 Jun 2022 22:44:12 +0000

In 2016, Microsoft released Tay, an AI chatbot designed to interact with Twitter users, answering their questions, and learning from users' replies. Unlike the other chatbots of the time, however, Tay was meant to have a personality, and to have a sense of humour, engaging in “casual and playful conversation”.

Yet, in a few hours of release, the conversations were somewhat less “playful”:

By 4 am the next day Microsoft had shut down Tay – only 16 hours after it had launched.

Microsoft may have had a great idea. Tay was meant to learn from its interactions, becoming more advanced with each interaction with a user. But they seemingly didn’t account for one crucial thing – the data itself may be bad.

But dirty data is not just hate speech, or outliers. It’s more than that. And understanding how to clean data is essential to ensure your data tells an accurate story

What is dirty data

Microsoft’s chatbot fell prey to data bias, a problem most AI and predictive systems are affected by. If the dataset used to train an AI excludes certain groups, or has inherent societal biases, these systems may exacerbate societal biases.

Think of the infamous Titanic dataset. Within a few minutes of Exploratory Data Analysis, you would realise that females were vastly more likely to survive than men. If a travel insurance firm trained its system using the Titanic dataset, it would charge men markedly higher premiums than women. With that, a system meant to assess risk based on the destination of travel and number of people travelling, instead assesses risk based on gender.

This may sound hypothetical, but banks have been charging, on average, higher interest rates to people of colour. This may have been caused, in part, by AI systems that consider black borrowers riskier.

How to (try) clean dirty data

It’s true that data will never be clean – it will always have some level of bias and error, but by systematically evaluating the source, freshness, and attributes of the data being collected, bias and error can be reduced considerably.

But how can this be done? To borrow from Kathy Baxter’s very good article: We can evaluate the correctness of data by asking 4 W’s – Where, When, Who, and What?

WHERE – Is your data source credible?

The quality of your data is very important, and so it is crucial to consider where your data comes from. Could that source have a vested interest in having the data be a certain way? Might they have tweaked the data? It is very important that you get your data from a trusted, credible source.

If you’re collecting the data yourself: have you followed the proper procedures for collecting data systematically? Could the sample you collected the data from introduce bias into the data? These are all very key considerations to make your data credible.

If you’re starting out in Data Science and are looking for credible, real-world datasets, public datasets from The World Bank, Google, and the US Census Bureau will do the job.

WHEN – Is your data source recent?

You’ve probably heard that the total amount of data in the world doubles every two years. It’s an incredible statistic, but one of the problems with this is that there is way more data about the recent past than the more distant past.

For example, a stock trading bot maker would have way more information about the movements in the stock market in the last month, than they would have of 5 years ago.

This phenomenon is called recency bias, and while it can make your AI system good at finding short-term trends, it may falter on the more long-term, bigger-picture trends.

However, the opposite is also true: a medical insurance firm making decisions based on data collected 5 years ago may not take into consideration the COVID-19 pandemic we’re still in the midst of.

You will need to take into account the recency of your data, and decide if it is appropriate for your particular use case.

WHO – Is your data source representative?

Your dataset needs to be representative of your target users/customers. For example, if an insurance firm was targeting European clients, it would not make sense to train their system with a dataset of American customers.

But it’s not often that easy to know if your dataset is representative:

People of colour have historically been underrepresented in clinical trials. While the COVID-19 vaccine trials were markedly more diverse, this was still observable. This was not intentional – hospitals typically found in POC neighbourhoods tend to be underfunded and therefore unable to conduct trials. Pharmaceutical companies also accounted for age in these trials. Even though people over the age of 65 make up just 9% of the US population, they are vastly more likely to die of COVID-19. Pharmaceutical companies have therefore included a disproportionate amount of older people in vaccine trials.

WHAT – Could the data categories you are analysing have an inherent bias?

Data categories are the different pieces of information or variables you are analysing - things like name, age, or location. Choosing what data categories to include is important because the presence of certain variables could introduce bias into your dataset.

Due to certain laws, or organizational values, certain attributes are restricted:

Age
Race
Gender
National origin
Sexual orientation

These variables are prohibited in certain contexts like employing people or providing government services. Organisations tend to avoid them because they tend to introduce unwanted bias. It is generally advisable to stay away from these attributes unless your use case is specifically linked to them (e.g. for research purposes).

It is true that data will never be clean, but that doesn’t mean it can’t still be useful.

To quote Dean Abbott, “No data is clean, but most is useful.”

So, go on and make your data useful! (after cleaning it)

The Normal and Binomial distributions, explained with Python

darrendube — Mon, 16 May 2022 19:25:40 +0000

(Originally published on darrendube.com).

The Binomial and Normal (or Gaussian) distributions are some of the most common distributions in Statistics. They are used anywhere from predicting movements in stock prices, to grading SAT tests. As an introduction to data visualisation in python, we will be plotting a binomial distribution, then plotting a normal estimation to the binomial.

(If you've only come for the visualisation part, skip to this point)

What are the Normal and Binomial Distributions

Even if you didn’t take a high school statistics class, you’ve probably still encountered the Gaussian (or normal) distribution in a math or science class.

If you created a histogram to represent the heights of people in a class, it would likely create a bell curve, with the more common heights in the middle, and the less common ones on the sides.

If you increased the number of subjects in your sample, the graph would more and more closely resemble the shape of a normal distribution:

The probability distribution function of a normal distribution is :

\frac{1}{\sigma\sqrt{2\pi}} e^{ -\frac{1}{2}\left(\frac{x-\mu}{\sigma}\right)^{!2}\,}

The shape of the graph is determined by its mean and standard deviation. The graph is centred around the mean, and the standard deviation determines how stretched it is in the x-direction.

Besides the heights of people in a class, many other random variables follow the normal distributions, including measurement error, SAT scores, and shoe sizes. The area under two points on the graph, divided by the area of the whole graph, gives the probability of a value between those two points.

Closely related is the binomial distribution. Even if you haven’t heard of it, it is very intuitive to understand.

Consider a coin toss: the probability of hitting either heads or tails is $0.5$ . If there is a fixed number of trials, the binomial distribution is used to calculate the probability of, e.g., getting $2$ heads in $10$ tries. It is represented by the probability density function:

P_{x}=(nCr) p^{x} (1-p)^{n-x}

meaning, in $n$ trials, each with a probability $p$ of success, the probability of getting $x$ successes is $P_{x}$ . In the coin toss example, $n = 10$ , $p = 0.5$ , and success means getting heads. While it is possible that there will be no heads in all 10 trials, it is unlikely, hence $P_{0}$ will be extremely low. Likewise, it is unlikely all 10 tosses will be heads, hence $P_{10}$ will likely be low too. The more likely number of successes would be in the middle, with the most likely being $n×p(=10)n\times p (=10)$ .

If you increase the number of trials, the shape of the graph starts to look very familiar...

If the number of attempts is large enough, the binomial distribution resembles a normal distribution. This means a normal distribution can be used to estimate the binomial by using $μ=np\mu=np$ and $σ=np(1−p)\sigma=np(1-p)$ . This is very useful when, for instance, you're trying to find the probability it takes more than 30 tries when $n = 100$ (which would normally require you to find $P_{x}$ for every number from 31-100).

However, there's a catch: the binomial distribution deals with discrete variables (i.e. there is no $P_{8.443}$ or $P_{3.142}$ , only whole numbers), whereas the normal distribution deals with continuous variables. This means the normal distribution is only an approximation to the binomial.

I realise this is by no means an exhaustive introduction. If you're still confused, this and this are more in-depth explanations.

Plotting the binomial distribution

We can plot a graph of the probabilities associated with each number of tries. In this example, I’ll be using Python and matplotlib.

If you do not have matplotlib installed on Python yet, install it by typing pip install matplotlib.

Begin by importing matplotlib and math. We'll need math to get the value of $e$ , and the $n C x$ function.

import math
import matplotlib.pyplot as pyplot

Firstly, we need to define the probability density function of the binomial distribution. To recall:

P_{x}=(nCr) p^{x} (1-p)^{n-x}

In python:

def binomial(x, n, p):
    return math.comb(n, x) * (p ** x) * ((1 - p) ** (n - x))

In this case, to make the binomial distribution more clearly resemble a normal distribution, I will make $n$ equal to $50$ . $p$ will be 0.5. We also need to initialise a list to store the 50 values we get from the binomial p.d.f for each value of $x$ , and another list to store keys (that basically number each value of $x$ in the previous list).

n = 50
p = 0.5
binomial_list = []
keys = []

Now that we have initialised all the variables we need, we can now iterate over each number from $1$ to $50$ to get values of $P_{x}$ for each, and we need to fill the keys[] list with numbers from $1$ to $50$ :

for x in range(50):
    binomial_list.append(binomial(x, n, p))

for y in range(50):
    keys.append(y)

All that's left is to plot the graph!

pyplot.bar(x=keys, height=binomial_list)
pyplot.show()

And voila!

As you can see, it clearly resembles a normal distribution. To see if it actually has the shape of a normal distribution, we can superimpose the normal curve by inserting this code (before the pyplot.show() expression:

def normal_distribution(x, mu, sigma):
    return (math.exp(-0.5 * ((x - mu) / sigma) ** 2)) / (sigma * math.sqrt(2 * math.pi))

pyplot.plot(keys, [normal_distribution(y, n*p, math.sqrt(n*p*(1-p))) for y in range(50)])

(Originally published on darrendube.com).

Jamstack comments suck - but they don't have to

darrendube — Mon, 24 May 2021 21:34:23 +0000

Let's face it - Jamstack websites have many advantages, but adding comments easily isn't one of them.

And for those of us with blogs, we know that a blog is never fully complete without comments. Blogging is meant to be a two way exchange, a way to build a community.

Jamstack's static nature means that comments don't come natively, but there is no shortage of third party comments providers - Disqus, Commentbox, Facebook Comments, among others.

The problem is that most of them are either not free, or they have ads and privacy concerns.

This is why I was excited when I discovered a comments app that's free, open source, and has no privacy issues.

What is Utterances

Utterances is a free, open source application that essentially acts as a widget on your blog post, storing comments on Github Issues. It creates a GitHub Issue for every blog post on your blog, then stores the blog comments as comments on that issue. You can moderate comments by editing those issues. To see how it looks like on an actual page, head to my original post and scroll down to the end!

Who is Utterances for

Because Utterances runs on Github Issues, it requires commenters to have a GitHub account, and to sign in everytime they want to comment. Therefore, Utterances is more suited towards developer/tech blogs, where the majority of readers would have Github accounts already.

How to set Utterances up

This tutorial is geared towards GatsbyJS websites, but will work for any react-based website.

First, you have to install Utterances to the GitHub repo that your website is hosted on. The repo has to be public. Click here to install the app.

Then, if you follow the instructions on Utterances' website, it gives you a simple script to insert into your HTML:

<script
  src="https://utteranc.es/client.js"
  repo="[ENTER REPO HERE]"
  issue-term="pathname"
  theme="github-light"
  crossorigin="anonymous"
  async></script>

However, this solution only works for simple Static HTML websites, and will not work for react-based Jamstack websites like GatsbyJS and Next.js.

Instead, make a Comments components:

//comments.js

import React from "react";

const Comment = ({ commentBox }) => (
  <div className="comments-section-wrapper">
    <div className="inner-section">
      <h2>Comments</h2>
      <div ref={commentBox} className="comments"></div>
    </div>
  </div>
);

export default Comment;

In your blog post template, create a ref that is attached to the commentBox prop on the Comments component

//blogTemplate.js
const commentBox = createRef();

Use the useEffects hook to add the script tag to the Comments Component using the ref:

//blogTemplate.js
...
  useEffect(() => {
    const commentScript = document.createElement("script");
    commentScript.async = true;
    commentScript.src = "https://utteranc.es/client.js";
    commentScript.setAttribute("repo", "darrendube/website"); // PLEASE CHANGE THIS TO YOUR REPO
    commentScript.setAttribute("issue-term", "pathname");
    commentScript.setAttribute("id", "utterances");
    commentScript.setAttribute("theme", "preferred-color-scheme");
    commentScript.setAttribute("crossorigin", "anonymous");
    if (commentBox && commentBox.current) {
      commentBox.current.appendChild(commentScript);
    } else {
      console.log(`Error adding utterances comments on: ${commentBox}`);
    }
  }, [commentBox]);
...

You can now insert this Comments component anywhere on your website:

//blogTemplate.js
return (
  ...
  <Comments commentBox={commentBox} />
  ...
);

Utterances provides a selection of 7 themes which you can find here. You can change the theme by changing the theme value in the useEffect hook. The widget is an iFrame so you can't use CSS to customise the comments - you are limited to the seven themes.

And that's it! If you want to see this in action, head to my original post and leave a comment there!

Introduction to the Jamstack - the New Frontier in Web Development

darrendube — Sat, 15 May 2021 17:33:49 +0000

As a Web Developer, you've probably heard of the Jamstack. It's the buzzword in web development. But what exactly is it?

Jamstack is an abbreviation that stands for JavaScript, APIs, and Mark-up. It is an architecture that promises, among other things, faster, cheaper, and more secure sites. And, increasingly, more and more websites are switching over.

To be clear, JAMstack is not a specific technology, nor is it driven or controlled by any single entity. It's a community-led movement, an architecture with a collection of standards and best practices that gives faster and more secure websites.

But to understand why it's so revolutionary, we have to understand what stacks are, what technologies traditional websites use, and why they are becoming more and more obsolete.

Legacy websites

There are many Web Development stacks out there: LAMPstack, MEANstack, WAMPstack, among others. These refer to the technologies used such as Linux, MySQL, and PHP. While they have their different technologies and applications, they all pretty much work in the same way: legacy websites are programs that run on a server, and query data from a database, building each page every time a user loads a page. WordPress websites follow this architecture.

This approach has its advantages - they tend to be easier for the average person to run, they can be highly dynamic because the page is only built at load time, and they are less reliant on third-party providers for dynamic functionality - since they run on a literal server!

However, legacy websites tend to be slow (especially for those on unstable internet connections), harder and more expensive to scale, and less secure. So, in 2015, Mathias Biilmann, the CEO of Netlify, coined the term JAMstack, which was later renamed Jamstack, referring to a new Web architecture that he and Chris Bach, a co-founder, were working on at Netlify, and that other Web developers were starting to explore.

The Jamstack

Instead of a server processing a request, a pre-built HTML page is served from a Content Delivery Network (CDN) and delivered to the user. No server involved.

However, just because no server is involved in the serving of webpages doesn't mean no servers are involved in the process at all. To understand why this is, we have to delve into the three component parts of Jamstack:

J is for JavaScript

Introduced to the world in 1995 by Netscape, JavaScript has become synonymous with the web. It provides a way to code logic into websites, allowing them to respond to users actions (for example: checkboxes, form submissions, calls to action) - every time a websites does something more than just display static information, you have JavaScript to thank for it!

Jamstack uses client-side JavaScript, with libraries like React and Vue, to design and make web apps that feel and act like mobile apps.

You might already be familiar with popular JavaScript UI libraries like React, Vue, and Angular.

A is for APIs

Application Programming Interfaces (APIs) are what allow two or more programs to talk to each other. They are how things like cryptocurrency trading bots can communicate with cryptocurrency exchanges without a human in the mix.

Just because we've decoupled the website's frontend from its backend doesn't mean we can't make use of any server functionality. Third-party services can provide dynamic functionality like database access, payments, and authentication. Jamstack takes the microservices approach, which is different from the monolithic approach (I go through this in more detail below).

Headless CMSs are another example of APIs. Normal Content Management Services (CMSs) (like WordPress) deal with both the website content and the frontend. Jamstack decouples this, meaning Headless CMSs deal only with the content, leaving the frontend to Static Site Generators.

The decoupling of these services from the actual websites gives greater portability, increased speed, and a lower risk of attack.

M is for Mark-up

The M part of Jamstack is probably its most important part. It stands for Mark-up. This means that Static HTML files are served to the user.

But this not only includes how the website is served to the user - almost all websites have JavaScript, APIs, and Mark-up in some form - M also includes how the pages are made in the first place. There are generally two approaches to generating Static HTML files:

Hand typing: You can type out the HTML files yourself. This is more suited to small, simple websites.
Static Site Generators: This is the most popular approach for Jamstack websites. An SSG generates Static HTML files from raw data (usually written in a lightweight mark-up language like Markdown) and templates. I go into this in more detail in another article.

Because of the functionality and advantages that dynamic websites have over conventional static ones, static websites often get a bad rap for being too basic. While Jamstack sites are static in the sense that Static HTML files are served to the end user, APIs and Mark-up also make Jamstack websites comparably dynamic.

CDNs

Unlike traditional web servers, which are usually in one place and serve dynamic, server-generated pages, Content Delivery Networks (CDNs) are geographically distributed, storing website data on several servers around the world so requests can be serviced from the server geographically closest to the user. CDNs are still servers, but because they are distributed, you can't really pinpoint the exact physical server your website is hosted on.

CDNs themselves can't generate web pages, but since Jamstack web pages are pre-built, they can be served from CDNs.

Because CDNs host static sites, they don't have bandwidth and processing limitations, so this lowers the risk of your website going down. It also makes CDNs cheaper - in fact, most provide free hosting!

Examples of serverless hosting providers are Netlify and Vercel.

The Microservices vs. Monolithic Architecture

Traditional websites are, simply put, built as a unit. They have all their functionality - comments, contact forms, authentication - built in. This functionality can still be in the form of plugins (like in the case of WordPress) but they are still a part of the overall website structure, and not external. This model is called a monolithic architecture.

The Jamstack takes the microservices approach where parts of a website are broken up and outsourced to third parties through APIs. Examples can be using a payments provider like Square or Paypal to process payments, or using Auth0 for authentication.

A useful analogy created by The New Stack is that of an air ticket booking website. The process of booking a ticket contains many sub-steps which, in this scenario, are reserving the ticket, billing the customer, and sending a confirmation email that the ticket is booked. In a monolithic architecture, all three processes would be built into a single application. In a microservices architecture, however, each stage works independently of the other and can be outsourced to third parties. The core function of the website might be to book the ticket, but billing could be outsourced to a payments company like Stripe, and emailing could be outsourced to an email company like Mailchimp, all through APIs.

Conclusion

Jamstack websites are usually called Static Sites because of how they are served to the user, but this sometimes gives the misconception that they can't have dynamic functionality when in fact they can through the use of APIs and Headless CMSs.

The Jamstack is a movement that's spreading across the web development world. Many established Web Developers are switching over. Maybe it's time you switched over too, don't you think?

Resources

Static Site Generators - A WordPress alternative

WTF is Jamstack?

Netlify's Blog

INFOGRAPHIC - The Jamstack, in a nutshell

Static Site Generators - the WordPress alternative no one's talking about

darrendube — Sun, 28 Mar 2021 00:33:43 +0000

We've all experienced it.

Websites suddenly becoming slow for no reason, loading times in the double digits, or even the dreaded "Error establishing a database connection". It may come down to the hosting provider you are using, the size of your website, or even the complexity of your aesthetic design, but the crux of the matter is that:

WordPress is ageing.

Running on code first written in 2003, it was designed for a time in the evolution of the internet when waiting minutes for a website to load was not uncommon. We weren't as dependent on the internet then. But now? As a tech generation becomes more and more impatient, website loading times are becoming a crucial factor in the design process of a website, even being factored in by search engines when ranking.

So what's the solution to this problem? Static Site Generators! (surprise, surprise).

But to understand how SSGs work and how they solve WordPress' problems, we first need to understand how WordPress works, and why this is causing slow websites.

How WordPress Works

A typical, barebones website consists of HTML (for the content and structure), CSS (for the design), and JS (for any logic or processing). For anyone starting out in Web Development, the normal inclination would be to write a separate HTML file for every page on your website. We would call this a static website.

Simple enough: you get easy customisation, no complex scripts to slow your site down, and a compact website that doesn't take up much space. Sure, this works for a simple website with 5 pages. But what about a blog with 50 posts? Or an e-commerce website with hundreds of products? I'm sure you can see where I'm going with this. With all these examples, sure, you can copy and paste a blog post template and edit the contents each time you want to write a new blog post, but that's taking away precious time. Time you could be spending writing blog posts.

WordPress solves this problem by (and I'm massively oversimplifying here) storing page and blog post data in a database, separate from the styles. When a user visits a page on the website, WordPress executes PHP code, retrieving data from a database, and assembling this data into HTML and CSS. This is an example of what we call a dynamic website.

All this code has to execute before the website has been rendered, while the user is waiting for the page to load, in a context where 40% of people will abandon a website that takes more than 3 seconds to load.

An optimised WordPress website with the best hosting and minimal assets will take about 1-2 seconds to load. But a website with cheap, low-cost hosting (the type most of us bloggers/portfolio owners will probably use) will take about 4-5 seconds!

Static Site Generators

Now, instead of retrieving data from a database and assembling HTML and CSS each time a website loads, imagine if we just prebuilt this HTML and CSS before the user visited the website, and stored this instead. Instead of executing code, we deliver these files as-is when a person visits our site. This processing happens before the user visits the site, meaning the files are ready to be served as soon as a request is made.

Think of an SSG as an application that inputs website data and outputs a folder with all the HTML, CSS, and assets.

Therefore, while with WordPress we speak of load time, with Static Site Generators, this becomes almost negligible, and we shift our focus to build time.

Static Site Generators are relatively new - below is the growth in popularity of the search term "Static Site Generator":

PROS

Performance

Because Static Site Generators prebuild websites before they are requested by users, load times are cut from several seconds to mere milliseconds!

In-site navigation is also unbelievably fast. In fact, navigating from one page to another is almost instantaneous (Try it now! This website is powered by an SSG). This is because the SSG I use (GatsbyJS) prefetches the files and assets of other pages on the website so that by the time you want to go to another page, it has everything ready!

Security

Databases, servers, and outdated software running on them are a hacker's dream. A study found that about 70% of WordPress websites had a security vulnerability!

The reason is simple - the more servers involved and the more processes and executions done by a server, the more loopholes and vulnerabilities can be found.

But by preloading our pages, we eliminate the need for any logic and work to be performed, thereby eliminating the risk of hackers injecting malicious code into these processes.

Cost

To run a self-hosted WordPress website, you need to spend on average $5-10 a month on hosting plus about $10 annually for a domain. All in all, you could easily spend over $100 a year. With Static Site Generators, this goes down to $0 (or \$10 a year for a custom domain).

Because no processing power is needed, you can host your website on free hosting providers like Netlify and GitHub Pages.

Version Control

Most Static Site Generator websites are published by pushing code to a remote git repository, where it is automatically built and deployed. Apart from making the deployment process easy, this makes it easy to revert to a previous version of your site should the need arise.

But, as with anything, Static Site Generators also have some:

CONS

Pretty steep learning curve

(Unless you are already a programmer).

One of the reasons WordPress is so popular is its relatively shallow learning curve. You get a GUI, a dashboard, and a text editor - literally everything short of a WYSIWYG editor.

Static Site Generators require writing content in Markdown - not very intuitive for the average person.

Add to this their relatively small community compared to WordPress, and this makes the learning curve that much steeper.

No built-in commenting

One of the many side-effects of not running on a server is that you don't get any services out of the box that require processing. That means comments, search, and most forms of contact forms will need third party services. A popular free third-party commenting service is Disqus.

Updating and Publishing the site requires tools on your computer

This means that you can only update your website from a computer that has that particular Static Site Generator installed - plus other dependencies. A WordPress site, however, can be edited from any computer with a browser and an internet connection.

Common Static Site Generators out there

Gatsby

Based on react and running on Javascript, GatsbyJS is very easy to transition to for existing web-developers who have already been working with Javascript. What makes it a popular choice is that it can be used to make Progressive Web Apps (PWAs), and its websites are designed to be very fast for users. The gatsby-plugin-image plugin (and its predecessor, gatsby-image) give GatsbyJS image-optimisation out of the box, with features such as resizing, blurring, and preoptimisation. GatsbyJS also has a very rich ecosystem with clear and comprehensive documentation, and a fast growing community on GitHub. This all helps make GatsbyJS sites (like this one) faster for users than websites made by other Static Site Generators.

Examples of websites powered by GatsbyJS are: Airbnb's Engineering and Data Science website, Figma, ReactJS, Hopper.

To get started with GatsbyJS, head to Sitepoint's tutorial, Scott Spence's tutorial, and GatsbyJS' official Quick Start page
Hugo

Hugo's strong point is that it is fast. Built with Go, Hugo websites often take milliseconds to build (compared to 30-60s for GatsbyJS). This is good for deployment and hosting services like Netlify, which allots 200 free build minutes a month and charges for minutes over this. Go, however, is not as ubiquitous in the Web Development space as Javascript, so this may be a turn off for some.

Examples of websites powered by Hugo are: Bootstrap, Kubernetes, Ghost,and CoreUI.

To get started with Hugo, head to The New Stack's Hugo tutorial, and Hugo's quick start page.
Jekyll

Being one of the earlier ones (made in 2008), Jekyll popularised the concept of a Static Site Generator. Running on Ruby, its shallow learning curve and its relative maturity make it a popular choice for many web developers. While other Static Site Generators have come on the scene, Jekyll remains widely used in the Web Development space.

Examples of websites powered by Jekyll are: Ruby on Rails, and Frame AI.

To get started with Jekyll, head to Open Source's Jekyll tutorials, Tania Rascia's tutorial, and Jekyll's official tutorials.
Eleventy

Billing itself as a simpler Static Site Generator, Eleventy is a Static Site Generator for those that just want the job done. Eleventy improved on the main problems with other Static Site Generators like Hugo and Jekyll. Jekyll has been around for some time, but it is viewed as too slow for some. Hugo is fast, but it requires using Go, a programming language that is unfamiliar for most Web Developers. Eleventy is fast, and uses Javascript, a language that most Web Developers already know.

An example of a website powered by eleventy is their website.

To get started with Eleventy, head to Craig Buckler's tutorial, Tatiana Mac's tutorial, and Eleventy's official getting started page.

Conclusion

You can find a more exhaustive list of Static Site Generators at staticgen.com. If you are interested in adapting your website to Static Site Generators or making a new one altogether, visit this page which talks about JAMstack, the greater movement behind Static Site Generators, and a new approach to web development that creates faster and more secure websites.

Subscribe at darrendube.com for more posts like this

The Importance of Having a Personal Website

darrendube — Tue, 02 Mar 2021 10:10:57 +0000

Not long ago, the internet was a luxury, reserved for the select few. Today, anyone can establish an online presence with under US$10. And nowadays, with tools like WordPress and Wix, you don’t even have to know how to code. But do you really need your own website?

Here are four reasons to have a personal website:

1. You get to control your personal brand

77% of employers say they google candidate’s names as part of the hiring process. For most of us, they won’t find anything meaningful – probably a few tweets, or articles you’ve written. By having a personal website, you get to control your narrative, and what others see when they search you. You get to show recruiters the REAL you, and I think that’s a very powerful thing to be able to do.

2. It’s a useful way to show your creativity

The thing with a CV/resume is that, while you can add some design to it, you are somewhat limited in the amount of creativity you can show. They have to be straight to the point. Websites give you the opportunity to show your creative side, and this could give you a competitive advantage. If you are in the art or design industry, your personal website would be the place to show off your portfolio.

3. Not to mention the money you could earn

This is probably the main reason people set up personal websites. Blogs are increasingly becoming a source of income. An example is Neil Patel (neilpatel.com), who earns more than US$300000 a month from one of his blogs. You may not earn that much, but imagine if you earned $2000 a month, just from writing a few blog posts a week! Other ways to monetize your website are affiliate marketing, sponsorships, and ads, the intricacies of which are beyond the scope of this post.

4. Contact

You’ve probably experienced this – you suddenly think of an old friend you last spoke to years ago, so you google them, but you can’t seem to find their contact details. If only they had a personal website with all their contact details!

5. Stand out

Self-explanatory: most people don’t have a personal website.

So what should you put on your website? You could start a blog about yourself or anything you have expertise in. If you are in the creativity field, it could be where you keep your portfolio of work you have done. If you want, your personal website could also double as an extension of your CV. You could describe your work experience in more detail, with images and infographics. For some inspiration, see some personal websites below:

Sean Halpin – https://seanhalpin.design
Joshua McCartney – https://joshuamccartney.com
Roxine Kee – https://roxinekee.com

So, how do you go about making your website?

Head to darrendube.com to read my other posts 😊.

We should be teaching our kids how to code. Or should we?

darrendube — Tue, 16 Feb 2021 13:21:09 +0000

The debate over whether children should be taught to code in school has been going on for quite a while now. One side says that coding is the new literacy, and everyone should know how to. The other side rejects this claim.

First of all, though the idea that coding will be beneficial to children is still under debate, I do not envisage it ever being at the same level as indispensable skills like reading or writing. Coding is not a skill needed by everyone. An actuary may benefit from knowing how to code, but a nurse wouldn't. Coding is beneficial only if it solves a problem. People should not learn how to code just because. Jeff Atwood said about this argument in an article of his:

It assumes that coding is the goal. Software developers tend to be software addicts who think their job is to write code. But it's not. Their job is to solve problems.

Some people say coding could make our kids get better at problem-solving. But so could chess. And maths. And sports. My point is that there are many other skills that would be beneficial to kids. Coding is a practical subject, and if schools started teaching it, they might probably take away all the practicalness from it and teach it just like every other subject.

We could instead introduce kids to code and get them to know how it looks like. Then it would be their choice to continue, either in a club or in their own time on platforms such as Codecademy and SoloLearn. Coding should not be forced on children in any way, as by doing so, we risk sucking the creativity out of it, the very skill we are trying to grow.

What do you think about teaching kids to code? Leave a comment below!