Category: Web Development

Functors and Monads - #30DaysofFP Week 3

September 3, 2019
Functors and monads may sound like some dark secret ingredient from the recesses of functional programming. For our purposes we will begin to approach them as data types that follow a base set of rules. In this post we will dive into working definitions for functors and monads as well as a working example tying them all together. What is a functor A functor is a type which contains a function and adheres to several rules. At their core, they are containers which encapsulate a value. The map function reaches into the container, performs an operation on the inner value, and ultimately returns it back to the container. Arrays in JavaScript are actually functors. Surprise! The array type has a method which accepts a function to perform…
Read More

An intro to Functional Programming - #30DaysofFP Week 1

August 12, 2019
1.5 weeks ago I set out to learn more about Functional Programming with a 30 day challenge. I started knowing little about functional programming, apart from the various array methods within JavaScript. Kyle Simpson's Functional Light JavaScript book, has been a great introduction of concepts and practical application. For those interested, the book can also be read for free on GitHub. In this post, I share some of the practical concepts of functional programming I have learned since starting this challenge, as well as refactor a code example using functional composition. There's lots of code examples and functional goodies along the way. Note: The code snippets include several functional programming helper functions. An example…
Read More

30 Days of Functional Programming

August 1, 2019
I have long had a fascination with learning new things. However, it is generally unstructured and follows whatever the interest of the moment is. I have been and continue to be a proponent of motivation based learning, believing that we learn best when there is an internal vested interest. At least for me, one downside of this approach is a propensity for cursory knowledge on many topics without revisiting them in more depth. This large surface area of topics has resulted in consistently saying, “One day I will get back to exploring topic X in depth”. Anecdotal experience has indicates lower follow through. A Proposed Solution In a desire to explore topics in greater depth, I am engaging on a sort of gamified learning experiment. Over the…
Read More

What is a Side Effect Anyway? - #30DaysofFP Week 2

August 19, 2019
Managing side effects is a core principle of functional programming. The existence of side effects can make a program more volatile, error prone, and harder to reason about. In this post, we'll dive into what side effects (and side causes) are, how to manage them, and functional purity. What is a Side Effect A side effect occurs when a function changes something outside of itself. This could be mutating a global variable, pushing data into an array, tracking application state, and more. An application must have side effects in order to run, or else there would be no feedback that it ran in the first place. Writing to the DOM, emitting a console.log, and making an API call are all side effects. As such they cannot be eliminated entirely…
Read More

Pragmatic uses for React Context

July 24, 2019
The purpose and use case for the React Context API long eluded me. I was familiar with what it did in principle, but struggled to find a use case for it. The Context API can solve some unique problems such as: grouping localized text strings and creating a language provider. In this post I share how the Context API can help solve these problems, as well as some sample code. According to the React docs: Context provides a way to pass data through the component tree without having to pass props down manually at every level Passing Localized String Props Localized applications bring a host of various complexities, one of which being an increase in the amount of props for localized text. The removal of any hard coded text strings can quickly…
Read More