Brian Lonsdorf
Salesforce
Hardcore Functional Architecture Patterns in JavaScript
4 hours, 10 minutes CC
Course Description
Learn patterns to architect your JavaScript programs using functional programming techniques. In this course, you’ll learn to build libraries and applications using functional programming patterns. You’ll also learn new tools to apply, such as Monoids, Monad Transformers, Free Monads, and Lenses. See functional programming in action!
This course and others like it are available as part of our Frontend Masters video subscription.
Preview
CloseLearn Straight from the Experts Who Shape the Modern Web
Your Path to Senior Developer and Beyond
- 200+ In-depth courses
- 18 Learning Paths
- Industry Leading Experts
- Live Interactive Workshops
Table of Contents
Introduction
Section Duration: 17 minutes
Brian introduces the course by explaining that architecture is about grouping things, and gives a refresher on the main functional programming properties.
Brian introduces the identity functor, and explains that it takes a value and returns a value. The identity functor is founded on category theory, which states that functional programming necessitates both composition and identity.
Brian compares working with one big function that does all the work with little functions that represent small functionalities from a given application, and says that this course will focus on composition involving multiple small functions.
Brian explains that normalizing the effect types within the app is a good guiding principle to allow every element within the app to compose, and says that different ways to solve this issue will be reviewed in the next sections.
Semigroups & Monoids
Section Duration: 1 hour, 17 minutes
Brian explains that a semigroup is a structure that contains an associative operation, and that is closed. Explanation is given for why a closed and associative.
Brian explains how to lift an operation through a type to be able to program an interface.
Brian explains that monoids are semigroups with an identity, and live codes examples of monoids.
Brian explains that foldMap takes elements, maps them into a certain type, and then folds them.
Brian explains the main differences between a monoid and a semigroup. A semigroup can have an empty identity.
Brian explains that functors are monoids, and demonstrates the advantages of programming to an interface. Programming to an interface means referring to a more abstract level than a class.
Brian demonstrates how to concat different functors together, and how to use the concat method to join different monoids.
The students are instructed to code different monoid exercises.
Brian live codes the solutions to the monoid exercises.
Brian shares two use cases for monoids to demonstrates how monoids can be used in everyday code and make code cleaner.
Brian gives an example of a homomorphism. A homomorphism takes two elements and combines them then goes through a type transformation. At a high level, when combining a monoid operation and flattening two types, these types become monads.
Brian demonstrates how to architect an app around validation, and builds a validation library that combines different kinds of validations, and provides errors or a final object.
Brian demonstrates how to create success and failure types, and adds a concat method, therefore building two monoids.
Brian continues to develop the validation library, and demonstrates how to create a validation monoid.
Function Modeling
Section Duration: 1 hour, 31 minutes
Brian explains that, instead of modeling data, it is possible to model a function. Functional modelling allows to use different methods.
Brian demonstrates how to use the Reader monad to add dependency connections and thread invisible environments through an entire program.
Brian explain that the endofunctor is called endo because it only works with the same kind of types.
Brian explains that contramap maps over inputs, combines two reducers that were previously contermapped demonstrating that contermap hits arguments before it comes in.
Brian live codes function modeling and demonstrates how to use Endofunction, predicate, and how to use the contramap or contravariant functor. An endofunction is a function that has an equal domain and codomain.
Brian demonstrates how to combine reducer functions, and transform them into an Endo type, and explains that the two are equivalent.
Brian explores different types of functors using the map, extract and fork methods, and explains that functors have different identities, can be composed together, and have a category within which they act like functions.
Brian explores the use of monad transformers with the Task transformer which contains a lift method that will avoid duplicating an inner type. A transformer is a monad that merges two monads together. Transformers are needed because unlike functors, monads do not compose.
Brian introduces monad transformer based libraries, and explains that each transformer is useful for a specific task, and reconstructing code with monad transformers requires understanding which transformer to use at the right place.
Brian covers monad transformer practices, and demonstrates how to use the lift method.
Brian explains that the free monad is a way to treat functions like datatypes, and gives an example of a free monad that takes a url as an argument, returns a datatype, and the content of the argument, in this example, the url.
Brian explains that lenses are built on functors and, compose backwards going left to right, adds that it is possible to write an entire application with lenses, and demonstrates how to treat properties as functors.
Monadic Web Apps
Section Duration: 59 minutes
Brian explores how to build a CLI blog for creating and viewing blogposts by focusing on the architectural decisions to build the app in a functional way.
Brian continues building the CLI blog and uses different forms of function modeling to refactor code, such as the fix type.
Brian continues to refactor the CLI blog app using Free monads to test the different app tasks.
Brian adds interpreters to the different free monads. Interpreters allow developers to log information about how the Free monad runs.
Brian explores a new application and starts building an alternative Redux that is contained in the event loop. Redux is a bare-bones approach to functional UI. The alternative takes advantage of monads, function modeling, monoids, and lenses.
Brian continues to build the application started in the previous section so that state is merged automatically when the ask method runs, uses lenses to alter state in an elegant and immutable way, and builds reducers that compose and are unary functions.
Wrapping Up
Section Duration: 3 minutes
Brian wraps up the course, explains that the purpose of this class was to give examples of functional architecture that can be reused at work, and explains when to use JavaScript vs when to use TypeScript in functional architecture.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops