Built a Super Slick Site + Blog with just Jekyll, Vanilla JS and CSS/Sass hosted on Github Pages

Chris Anatalio — Wed, 06 Aug 2025 00:33:11 +0000

Yes it has a dark mode toggle ;)

Plain old Jekyll, CSS/Sass and a tiny bit of vanilla Javascript can really, really punch above it's weight nowadays. The pure CSS animations, Jekyll handling all the dynamic pagination and templating and then just deploying via a Github Action to GH Pages can actually produce a pretty serious site + blog.

It's honestly really cool and hats off to Mozilla and the OSS community for making this stuff happen and hammering away at this stuff until they just really nail it from a developer experience standpoint.

Such a joy to work with and spin up a cute, animated, responsive site in just a couple days :D

Intro to Reactive Functional Programming

Chris Anatalio — Fri, 27 Dec 2019 01:30:58 +0000

Excerpts from my courses: https://linkedin-learning.pxf.io/reactive-java-8 and https://linkedin-learning.pxf.io/full-stack-reactive-app-java-spring-angular

Intro

In modern web and mobile environments, there are more users with heavier usage patterns and much higher expectations for user experience then ever before. Many applications are deployed on highly distributed cloud servers.

To address these challenges, many engineering teams are turning to the Reactive Functional paradigm of programming.

This article will give you a brief introduction to Reactive Functional Programming.

What is Reactive Programming?

Interactive programs work at their own pace and mostly deal with communication, while reactive programs only work in response to external demands and mostly deal with accurate interrupt handling.
Gérard Berry (Director of Research at INRIA)

Reactive programming is a declarative programming paradigm that entails building asynchronous, non-blocking and event-driven applications that leverage asynchronous data streams and can easily scale across distributed systems.

A Stream can emit three things:

A value
An error
A completed signal

What are Asynchronous Data Streams?

A stream is a sequence of ongoing events ordered in time. Examples of events include variables, user input, properties or click events.

Reactive Streams in Action Marble Diagram

The diagram featured above is called a marble diagram and they are commonly used to explain various aspects about reactive streams.

The Reactive Manifesto

Before you start your journey into building reactive systems you should check out the Reactive Manifesto. The Reactive Manifesto explains various characteristics that Reactive Systems should possess.

Check out and sign the manifesto here: https://www.reactivemanifesto.org/.

Reactive Systems tend to be loosely-coupled, flexible and very scalable. Built the right way and given time for engineering teams to adapt to the new paradigm, these systems will be more adaptable to change as you scale and evolve the system.

Reactive Systems need to be:

Responsive
Resilient
Elastic
Message Driven

Let’s take a look at the interplay of these characteristics:

Reactive Manifesto in Action

We can see that message-driven systems help facilitate elastic and resilient characteristics which in turn help to make the entire system more responsive.

Building responsive systems with a great user experience is the end-goal of the Reactive Manifesto!

Why Reactive Programming?

The transition to Reactive Systems can be a very challenging and time-consuming endeavor.

However, consider the following:

Modern systems need to be robust, resilient and flexible
They are deployed on cloud-based clusters running thousands of multi-core processors
Users expect millisecond response times and ~100% uptime
Data is measured in Petabytes
Modern systems need to be tolerant of failure and to fail gracefully as well as being highly responsive while giving users effective, interactive feedback

Building reactive systems is a great solution for these challenges.

So do yourself a favor and start learning more about the Reactive Functional Paradigm and how it can help systems at your organization become more future-proof and scalable!

Other platforms

Reactive programming is not limited to any one platform.The ReactiveX project provides implementations in many different languages: http://reactivex.io/

Including Javascript: https://www.learnrxjs.io/

Other Reactive Functional Javascript frameworks include:

Frameworks that implement the Reactive Streams specification are interoperable.

Check out my courses on LinkedIn Learning for a deeper dive into these topics:

New personal website using GatsbyJS

Chris Anatalio — Sun, 22 Dec 2019 06:11:45 +0000

Just built my new personal website using GatsbyJS.

Very cool framework that allows a backend services engineer like myself to easily use all the slick, new, front-end tech(react, graphql, webpack, etc) out of the box.

Definitely recommend checking it out if you need to crank out a static website(https://www.gatsbyjs.org/).

https://chris-anatalio.dev 😁

DEV Community: Chris Anatalio