2.2

Before we get started, we need to install and configure a few tools essential for learning Elm.

Installing Node.js

Node.js is a JavaScript runtime environment for building mostly server-side applications.

Why Node.js?

This book is all about learning a language for building client-side applications. So why do we need to install Node.js? We need it for two reasons:

• elm-repl - a tool we will be using later to experiment with Elm - works by compiling the Elm code to JavaScript. Node.js provides an environment for running that JavaScript code.

• Node.js comes with a package manager called NPM (Node.js Package Manager). Most tools and libraries for building front-end applications (including a few in Elm ecosystem) are distributed as NPM packages. Therefore, you need it in your arsenal to be a productive Elm programmer.

Follow the instructions on the official site to install Node.js on your computer. Node.js comes with NPM, so you don’t need to download them separately. Once installed, run the following command from the terminal to verify that you have Node.js 7.0.0 or higher installed. It doesn’t matter which directory you run this command from.

$ node --version

Installing Elm Platform

The Elm Platform bundles together most tools we need to work with Elm. Follow the instructions on the official site to install the Elm Platform on your computer. Once the installation is complete, run the following command from the terminal to verify that Elm is installed properly. It also doesn’t matter which directory you run this command from.

$ elm --version

You should see the version number of the Elm Platform installed on your computer. We will be using the 0.19.0 version throughout this book unless mentioned otherwise.

Source Code Editor

This book will make you write a lot of code. Some of that code will be executed inside the terminal using elm-repl. Some will have to be saved in a file and compiled. Elm doesn’t come with a source code editor, so you are free to choose whatever you like. Out of the box, most editors don’t support features such as syntax highlighting and autocompletion that will significantly enhance the experience of writing Elm code. You will have to install a plugin for that. Select a plugin for your editor from the Configure Your Editor section in the official guide.

Note: Because tab characters are syntax errors in Elm, don’t forget to configure your editor to insert spaces when the tab key is pressed.

Installing elm-format

The Elm compiler will accept any valid program, but the community at large prefers those programs to be written in a certain style. In most other languages, we need to remember what that style is and follow them diligently. Not only does this take up extra space in our brain, but also distracts us when we are in the middle of solving a problem.

elm-format tackles this issue by automatically formatting our code according to a set of rules standardized by the community. Although you don’t have to install elm-format to follow along, it’s highly recommend that you do.

elm-format Release Status

As of this writing, elm-format is still in beta. Don’t be surprised if the current format of your program looks different from the one 1.0.0 version of elm-format produces in the future. Despite its beta status, most community members are already using it, so you should be fine using it too. All code in this book that is meant to be saved in a file has been formatted using elm-format.

Installing elm-format is quite easy. Just run the following command from any directory in the terminal.

$ npm install elm-format -g

The -g option above installs the package globally so that we can use the elm-format command from anywhere in the terminal. Now, you can format Elm code by specifying a filename in the terminal like this:

$ elm-format Main.elm

The usage section in the official documentation shows various ways of using elm-format from the terminal, including how to format all Elm files in a directory.

Using elm-format from a Source Editor

Running elm-format from the terminal whenever we change an Elm file can be tedious. Therefore, most source code editors offer a plugin for automatically running it every time we save an Elm file. Install a plugin for your editor from the official site. Some plugins require you to manually turn on the format on save option. Make sure to read the instructions (listed on the official site) on how to do that as well.