Everything you need to know to setup Dark Mode for your site.

I recently finally implemented Dark Mode for my blog, so it seemed appropriate to publish a short walkthrough for anyone else wanting to do the same thing. This post will use a Gatsby.js site as an example, but the concepts here apply to really any server-side rendered site (e.g. using Next.js, too).

Let’s get started!

Note: this post assumes working React.js knowledge and basic understanding of web development in general.

1. Picking the Initial Theme

The first question we have to answer is: when a user starts loading your site, what theme (light or dark) will you show them initially? Here’s how we’ll do it:


A hands-on beginner’s guide to what XSS attacks are and how to prevent them.

Cross-Site Scripting (XSS) vulnerabilities are one of the most dangerous web security holes that exist. In this post, we’ll see an interactive demo of XSS and learn how to protect against it.

This is the second post in my Web Security 101 series. If you’ve read my introduction to CSRF, some of the preamble below might look familiar… feel free to skip ahead a bit.

Setting the Scene

Picture this: you’re a responsible, hardworking person. You’ve saved up your money over the years at Definitely Secure Bank®.

You love Definitely Secure Bank — they’ve always been good to you, plus they make it…


A gentle introduction to Visual Question Answering (VQA) using neural networks.

Quick — what sport is depicted in this image?

Image from the CloudCV VQA Demo

You probably immediately knew the answer: baseball. Easy, right?

Now imagine you’re a computer. You’re given that same image and the text “ what sport is depicted in this image? “ and asked to produce the answer. Not so easy anymore, is it?

This problem is known as Visual Question Answering (VQA): answering open-ended questions about images. VQA is interesting because it requires combining visual and language understanding. …


A beginner-friendly guide on using Keras to implement a simple Neural Network in Python.

Keras is a simple-to-use but powerful deep learning library for Python. In this post, we’ll see how easy it is to build a feedforward neural network and train it to solve a real problem with Keras.

This post is intended for complete beginners to Keras but does assume a basic background knowledge of neural networks. My introduction to Neural Networks covers everything you need to know (and more) for this post — read that first if necessary.

Let’s get started!

Just want the code? Here’s the full source code.

The Problem: MNIST digit classification

We’re going to tackle a classic machine learning problem: MNIST handwritten…


A quick, easy introduction to the Bag-of-Words model and how to implement it in Python.

Photo by Patrick Tomasso on Unsplash

The bag-of-words (BOW) model is a representation that turns arbitrary text into fixed-length vectors by counting how many times each word appears. This process is often referred to as vectorization.

Let’s understand this with an example. Suppose we wanted to vectorize the following:

  • the cat sat
  • the cat sat in the hat
  • the cat with the hat

We’ll refer to each of these as a text document.

Step 1: Determine the Vocabulary

We first define our vocabulary, which is the set of all words found in our document set. …


Sendy’s reCAPTCHA implementation doesn’t do anything.

EDIT: We did it — Sendy has released a patch (v4.0.3.3) for this issue! I recommend upgrading if you’re affected. Thanks to Sendy for the quick response to this blog post, and thanks to every reader who helped make this happen.

A few months ago, I switched from Mailchimp to Sendy, a self-hosted email newsletter alternative. I wrote a whole post about why I switched from Mailchimp to Sendy, but the gist is that Mailchimp got too expensive too fast.

Since then, I’ve been generally satisfied with Sendy. Until one day, this happened:


How I fell into the trap of premature optimization, the root of all evil.

Donald Knuth once famously said:

The real problem is that programmers have spent far too much time worrying about efficiency in the wrong places and at the wrong times; premature optimization is the root of all evil (or at least most of it) in programming.

Here’s my story of learning to avoid premature optimization the hard way…

GeoArena Online

A few years ago, I was working on a web game called GeoArena Online (I’ve since sold it, and the new owners rebranded to geoarena.io). It was a multiplayer game where players controlled ships in last-man-standing style 1v1 battles:


How I optimize SVGs for my blog and why you probably should, too.

This post is best read in its original form at https://victorzhou.com.

I use a lot of SVGs in my blog posts. They’re great for simple diagrams or illustrations, like this one:

From my Neural Networks From Scratch Series.

I use Inkscape, a free and open-source vector graphics editor, to make my SVGs. In the beginning, I just saved my SVGs using the default Inkscape format, something called Inkscape SVG. That turned out to be not ideal…

Let’s use this SVG of a circle as an example:


A simple walkthrough of what RNNs are, how they work, and how to build one from scratch in Python.

Recurrent Neural Networks (RNNs) are a kind of neural network that specialize in processing sequences. They’re often used in Natural Language Processing (NLP) tasks because of their effectiveness in handling text. In this post, we’ll explore what RNNs are, understand how they work, and build a real one from scratch (using only numpy) in Python.

This post assumes a basic knowledge of neural networks. My introduction to Neural Networks covers everything you’ll need to know, so I’d recommend reading that first.

Let’s get into it!

1. The Why

One issue with vanilla neural nets (and also CNNs) is that they only work with…


A simple walkthrough of deriving backpropagation for CNNs and implementing it from scratch in Python.

In this post, we’re going to do a deep-dive on something most introductions to Convolutional Neural Networks (CNNs) lack: how to train a CNN, including deriving gradients, implementing backprop from scratch (using only numpy), and ultimately building a full training pipeline!

This post assumes a basic knowledge of CNNs. My introduction to CNNs covers everything you need to know, so I’d highly recommend reading that first. If you’re here because you’ve already read that, welcome back!

Parts of this post also assume a basic knowledge of multivariable calculus. You can skip those sections if you want, but I recommend reading…

Victor Zhou

CS @ Princeton University. I write about web development, machine learning, and more at https://victorzhou.com.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store