Articles from Alex Korban

Primary tabs

Practical Elm for a Busy Developer: early access

I’m working on an intermediate level Elm book called Practical Elm for a Busy Developer. I wanted to post a quick note about it for people who are not on my mailing list, since I've just added a huge new section and the book is 70-80% complete now.

I chose not to include the basics (Elm syntax, the Elm architecture etc.) in the book because I think they are adequately covered by other sources. Instead, it will guide you through the practical tasks of creating applications with Elm: building UI...

How Json.Decode.Pipeline chaining works

Json.Decode.Pipeline is a popular package for building JSON decoders. It allows you to build decoders using the forward function application operator (|>) to chain field decoders in a convenient, DSL-like way. For example, we could have a decoder like this:

type alias Node =
{ nodeType : String
, relationName : String
, plans : Plans
, schema : String
, startupCost : Float
, totalCost : Float
}

decodeNode : Decode.Decoder Node
decodeNode =
decode Node
...

Json.Decode tricks: decode 8+ fields and nested sub-objects

Suppose you have some JSON that describes map markers:

{
"name": "Rixos The Palm Dubai",
"lat": 25.1212,
"lon": 55.1535
}

Using Json.Decode, the decoder for this JSON looks like this:

decodeMarker : Json.Decode.Decoder Marker
decodeMarker =
Json.Decode.map3 Marker
(field "name" Json.Decode.string)
(field "lat" Json.Decode.float)
(field "lon" Json.Decode.float)

If your JSON acquires another field (say, marker color), you need to add one more field decoder ((...

Using modules in Elm

This post is adapted from my book, [Practical Elm for Busy Developers.]

As your Elm code base grows, you will want to start taking advantage of modules to split the code into manageable smaller parts.

In Elm, files and modules have a one-to-one correspondence. If you want to break out a piece of code into a separate file, you have to organise it as a module in that file.

The general approach I would suggest is to start your project with a single file (Main.elm), and keep adding to it until y...

Elmstatic 0.3.1: generate subsections, make index pages, add page aliases

New release is out today. Now it allows you to:

Create subsections with their own posts
Create Index.elm pages which turn into index pages, both at the root level and at subsection level. For example, Pages/Index.elm becomes the page at / in contrast to Pages/Projects.elm which becomes /projects. At subsection level, Pages/Elm/Index.elm becomes the page at /elm, while Pages/Elm/Projects.elm becomes /elm/projects.
Use the postprocessing copy step to give pages aliases (eg /projects can be made ...

Introducing Elmstatic: an Elm-to-HTML static site generator

I've been using Elm to generate this site for a few months. It's still highly experimental and incomplete but I hope that other Elm enthusiasts may find it useful.

At the moment, it works for my needs and allows me to generate this site with a single command, but it requires manual intervention if I'm doing things like deleting pages or adding new Elm dependencies, and I'm sure there are many use cases it doesn't address.

I think I have something barebones but useful so I published it on NPM ...

Decoding recursive JSON in Elm

There are a number of posts about decoding recursive JSON in Elm, but I still found it was a slightly tricky task, particularly because the way the Elm compiler deals with recursion requires a workaround in the decoder code to avoid rather confusing runtime errors. In this post, I'd like to tell the story of implementing recursive decoders.

The path to a recursive decoder

The basic structure of the JSON we need to decode is like this (this happens to be the PostgreSQL EXPLAIN command output):...

Decoding recursive JSON in Elm

There are a number of posts about decoding recursive JSON in Elm, but I still found it was a slightly tricky task, particularly because the way the Elm compiler deals with recursion requires a workaround in the decoder code to avoid rather confusing runtime errors. In this post, I'd like to tell the story of implementing recursive decoders.

The path to a recursive decoder

The basic structure of the JSON we need to decode is like this (this happens to be the PostgreSQL EXPLAIN command output):...

Generating static HTML from Elm code with elm-static-html-lib

I've written a static site generator to produce my site (yaks have to be shaved, after all). Unlike thousands of other static site generators out there, mine allows me to write pages in Elm, specifically because I wanted to be able to use style-elements and get away from CSS.

I'm using eeue56/elm-static-html to convert Elm to plain HTML, and I'm about to switch to eeue56/elm-static-html-lib (thanks to Noah for his many contributions to Elm!).

But how does it work? Normally, our views produce ...

Generating static HTML from Elm code with elm-static-html-lib

I've written a static site generator to produce my site (yaks have to be shaved, after all). Unlike thousands of other static site generators out there, mine allows me to write pages in Elm, specifically because I wanted to be able to use style-elements and get away from CSS.

I'm using eeue56/elm-static-html to convert Elm to plain HTML, and I'm about to switch to eeue56/elm-static-html-lib (thanks to Noah for his many contributions to Elm!).

But how does it work? Normally, our views produce ...