[035.5] Elm Weekly Drip #35 and Exercise: Add Text

An exercise to expand our SVG editor with text nodes, as well as links covering Prisms, Elm on iOS, XML parsing, secret decoders, and a replacement for `(!)`

Subscribe now

Elm Weekly Drip #35 and Exercise: Add Text [01.27.2017]

This week we added the ability to modify shapes on the canvas. For today's exercise, we'll add the ability to add Text and move it around. Before that, let's look at some links.


Build iOS apps with Elm

This is a library that lets you build a functional core for your applications in Elm, and then build an imperative shell to hold them and display their data, in Swift.

[ h/t @salutis ]

Playing With Prisms

Using Prisms and ADTs for select tags (among other things)

Kyle Kress is continuing with his excellent blog posts, this time discussing a data modeling procedure for handling non-isomorphic data with Prisms. He introduces a generic select that can handle a Prism, but the general details he's covering are interesting even if you don't need a nice ADT-aware select :)

[ h/t @toastal ]


xml parser for elm

Noah Hall built an XML parser for Elm. You can encode and decode XML. So if you need that, here it is :) I've needed it a single time (AWS-related), and in my case I was able to completely hack my way around it - but this would have been much nicer.

[ h/t @eeue56 ]

Elm Decoders and Secret Spy Messages

A novel point of view into what Elm's JSON decoders are

Ossi Hanhinen wrote up a fun post comparing JSON decoders to secret spy messages like you might have gotten in a box of Cracker Jacks or from the back of a comic book, if you're old enough to remember that sort of thing.

[ h/t @ohanhi ]


A simpler alternative to (!)

NRI built a package to easily turn ("a" => "b") into ("a", "b") and deal with that shape of data nicely in your Program.


This week we're adding the ability to add text in our SVG editor. I'll show my solution in the next drip. I have a few suggestions to help you along.

  • Add a Text shape.
  • Initially, just use static content for the Text shape, as adding a UI for editing the text is perhaps outside of the scope of a short exercise.
  • If you want to add the ability to edit the content of the Text, I'd suggest just injecting a text field into the sidebar when the Text is selected.