Frontend Development: Elm Basics

Deterministic code, predictable experience

@Programming #beginner #free

Elm is a programming language for frontend applications that uses pure functions to compile into highly-optimized and safe JavaScript.

Elm uses functional programming, meaning all data passing through are immutable, and contains no side-effect. Data must be passed from one function to the other without the concept of sharing states in different scopes. The functions have no impurities, they are purely what they seem to be, the same input guarantees the same output.

What this really means is that the program is 100% predictable within the scope of the entire Elm application. This is incredible because with only one built-in function, Elm can render your entire HTML DOM using lazy diff comparison. If there are no changes to most of the page, there was never a need to refresh 99% of DOM elements for that 1% difference! The result is a lightweight and fast interface that can run anywhere.

What's more, all these features comes without putting together a whole list of frameworks and plugins, which eventually becomes a burden to maintain.

Video coming soon.

Elm sounds hard, why should we use it?

There was a time when we were reluctant to abandon the monolithic backend architecture, but microservices and serverless architecture are already becoming common use cases. In the case of frontend applications, things had been stuck in one big irreplaceable chunk of JavaScript for a while.

A modular architecture refers to a code stack that consists of minimal modules where majority of the system can be swapped out or plugged in to work with another system.

For the concept of modular system to work, the modules need to be independent and stable without sharing components and dependencies. If a part of the software is without bugs, it should stay without bugs and require minimal changes when features are added.

This is difficult to achieve with other languages, but with Elm, it is possible.

Still Scratching Your Head?

We Already Figured Things Out!


Program Structure

Lesson 1

Reading and Writing

Lesson 2

Architecture and Runtime

Lesson 3

Debugging and Logging

Lesson 4

Modules and Imports

Lesson 5

Data Structures and Types

Lesson 6

Interested? Get Started.