Articles from Alex Korban

Primary tabs

elm-ui: Forget CSS and enjoy creating UIs in pure Elm

Creating UIs with CSS is rarely as straightforward as you expect.

A few weeks ago I wanted to make the navigation on my site responsive, having it switch from a row of links to a hamburger slideout menu. Seems like a reasonable thing to do with CSS, right?

Not really. As often happens, I tried a few reasonable things -- they didn't work. I started searching for solutions -- most involved JavaScript.

I finally found a solution that was CSS-only, and then spent a couple of hours trying differe...

The missing part of the Elm guide: URL handling with Browser.application

I saw a tweet from someone who was confused by the missing section in the URL Parsing chapter of the Elm 0.19 guide.

The chapter shows several examples of URL parsers made with Url.Parser, but the Synthesis section at the end is just a TODO. However, the section does suggest what should be in it:

> The major new things are:
> 1. Our update parses the URL when it gets a UrlChanged message.
> 2. Our view function shows different content for different addresses!
>
> It is really not too fancy. N...

Minimal static boilerplate for Ellie

If you use Ellie for quick non-interactive experiments like I do when playing with different language features or trying out API ideas, you probably find yourself either deleting the default code that a new Ellie is populated with, or somewhat awkwardly adding bits to it.

I kept doing that for a while, and finally I decided to document a minimal boilerplate for static content:

module Main exposing (main)

import Browser
import Html exposing (text)

main : Program () () Never
main =
Browse...

The basic steps to publish a package with Elm 0.19

I was gearing up to publish my first package, and was a bit surprised that I was unable to find an explanation of the basic steps involved. There are a couple of posts for Elm 0.18 but they are out of date now, so I decided to write down all the things I had to do as I went. Granted, the steps are quite straightforward, as you will see, but it's still a bit of a barrier when they aren't spelled out (or at least a great excuse to procrastinate for me)!

You can get started the same way as you wo...

A straightforward introduction to custom elements

[Note: I wrote this post from the point of view of an Elm developer, however aside from a few Elm related notes, it's really just an introduction to custom elements and Shadow DOM. There isn't any Elm code in this post - it's all JavaScript.]

Quite often, you may need to integrate a complex JavaScript UI component into your Elm application, like a rich text editor, or a calendar, or an image editor, or some kind of visualisation. Such components usually have a lot of state, so you might be con...

How to generate JSON from Elm values using Json.Encode

In Practical Elm, I discuss at length how to convert a complex JSON string containing nested objects, arrays and recursion into Elm values.

But what about the opposite conversion, from Elm values to a JSON string? We often need to make requests to a server which include data in JSON format. For example, you might be working with a database like MongoDB or CouchDB, and you might need to get a JSON document from it, modify it in some way, and then send it back to the server.

In JavaScript, conv...

Introduction to the elm/parser package

Do you need to deal with some kind of structured data which is not in JSON format and too complex for regular expressions? Or perhaps you have to validate some kind of complex user input? Or maybe you need to report to users what exactly is wrong with the data?
One of the packages in the Elm core library which can help you with such tasks is elm/parser.
First of all, if you're not familiar with parsing, what is it? A parser allows us to take a string as input and to convert it into Elm values a...

Practical Elm book release date & Elm 0.19 updates

I'd like to give you a couple of updates on Elm 0.19 in this post.

But first, an announcement about my book, Practical Elm for a Busy Developer: I'm going to publish the final release on 18 September.

If nothing else, this will force me to finish the last round of proofreading and tweaks!

I would have liked to finish the book earlier, but I also wanted to make it maximally useful to you, so it took a bit longer. I ended up adding extra content, and the latest draft is over 200 pages. I've ad...

Elm 0.19: details of what's new, how to install/upgrade, reading list

This morning, my Twitter timeline was abuzz with exciting news: Elm 0.19 has been released!

The official announcement focused on the big ticket items: impressive reductions in the size of the generated JavaScript and no less impressive improvements in compilation speed. Those are very good things, but I wanted to provide a more comprehensive list (including some stuff that didn't make it into the release notes either).

Changes

Language changes

Nothing major has been added but a few things h...

Learning Elm in 2018: Comprehensive List of Resources

Learning a niche language like Elm involves a lot of head scratching over sparse documentation, posting to forums and hoping to get at least one response, looking at other people's undocumented code on GitHub to solve your problems, and generally a lot of stabs in the dark. Right? Well, I'm happy to say that at least for Elm, it's no longer true.
The official introduction to Elm is a useful overview of the language, but what's available beyond that? In 2018, the answer is "quite a lot", as it t...