Если вы не знакомы с Elm, это, по сути, функциональный язык программирования и платформа для написания веб-приложений. Код, написанный на Elm, компилируется в JavaScript и встраивается в веб-сайт. Подробнее об основах вы можете прочитать, например, на Хабре или на официальном сайте. Я хотел обобщить опыт, который я получил при написании своего первого приложения, так что будет много очевидных вещей, немного неочевидных и много ссылок.
Я решил создать собственное приложение после написания нескольких простых программ и прохождения курса Elm Tutorial. При чтении туториала и написании примеров было сложно понять сразу все концепции, поэтому я старался не зацикливаться на сложных для меня местах (маршрутизация, композиция) и старался получить готовую рабочую страницу.
После этого я начал писать свое приложение, которое состоит из формы, в которой вы можете указать имя события, необязательно URL-адрес и дату, когда событие должно состояться. После сохранения все эти данные отображаются в виде небольшой карты обратного отсчета до события. Код можно найти здесь.
Язык, документация и источники информации
Очевидно, что Elm — это совершенно другой язык, чем JavaScript. Итак, вам нужно изучить синтаксис, понять концепции. На официальном сайте есть небольшая документация по синтаксису, таблица сравнения с JavaScript. Рекомендуется сначала прочитать официальное руководство и попробовать выполнить оттуда примеры. Каждую неделю рассылается информационный бюллетень с множеством интересных статей, видео и примеров.
Поскольку раньше у меня почти не было опыта использования чистых языков функционального программирования — было интересно и полезно прочитать материал, объясняющий общие концепции. Среди этих материалов я могу порекомендовать серию из 6 статей «Итак, вы хотите быть функциональным программистом», где объясняются основные концепции, и книгу «В основном адекватное руководство» (есть частичный перевод на русский язык).
Учебник, который я только что прошел, помог мне решить мою проблему, пример которой у меня есть. Это очень удобно, поскольку охватывает многие аспекты веб-разработки, от основ языка до построения, архитектуры, маршрутизации и взаимодействия с API. Например, я изначально скопировал оттуда роутер для своей задачи почти без изменений. Затем, решив возникшие проблемы, я узнал, как выполняется синтаксический анализ, как работают сопоставители и так далее. Кроме того, это руководство постоянно обновляется до последних языковых версий (в настоящее время 0.18).
Часто в Интернете есть интерес к руководствам и примерам кода. Код импортирует библиотеки, использующие так называемые открытый импорт. То есть он использует функцию s вместо UrlParser.s. Это немного затрудняет чтение чужого кода. Всегда проверяйте, как, что и под каким именем импортируется в модуль. Я сам стараюсь использовать сертифицированный импорт, и это официальная рекомендация. Больше букв, но всегда понятно, какой тип или функция используется.
Я советую вам обязательно подключить Elm Format к своему редактору, который отформатирует код в соответствии с официальным руководством. Формат Elm, кажется, используется всеми, и общий синтаксис действительно удобен.
Архитектура приложения
При написании приложения важно знать архитектуру, которая считается стандартной: TEA (The Elm Architecture). Подробнее об этом можно прочитать в официальном руководстве. Если вы знакомы с Redux, нет проблем, но если нет, мне не составит труда изучить концепцию. Есть три основных части: модель (хранит состояние приложения), средство обновления (обработчик изменений, который изменяет модель) и представление (внешний вид нашего приложения, отображаемый в соответствии с состоянием модели).
Таким образом, наше минимальное приложение инициализируется из этих трех частей. В более сложных случаях вы можете добавлять подписки, функции обновления, флаги javascript и многое другое.
