{"id":13393378,"url":"https://github.com/izdi/elm-cheat-sheet","last_synced_at":"2025-10-09T23:34:14.115Z","repository":{"id":45018727,"uuid":"51261172","full_name":"izdi/elm-cheat-sheet","owner":"izdi","description":"An overview of Elm syntax and features","archived":false,"fork":false,"pushed_at":"2018-04-27T10:21:28.000Z","size":54,"stargazers_count":952,"open_issues_count":2,"forks_count":49,"subscribers_count":36,"default_branch":"master","last_synced_at":"2025-09-27T23:58:21.398Z","etag":null,"topics":["cheatsheet","education","elm","functional-programming","learn","tutorial"],"latest_commit_sha":null,"homepage":"","language":"Elm","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/izdi.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-02-07T19:10:37.000Z","updated_at":"2025-08-30T03:01:12.000Z","dependencies_parsed_at":"2022-07-13T03:00:32.234Z","dependency_job_id":null,"html_url":"https://github.com/izdi/elm-cheat-sheet","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/izdi/elm-cheat-sheet","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/izdi%2Felm-cheat-sheet","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/izdi%2Felm-cheat-sheet/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/izdi%2Felm-cheat-sheet/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/izdi%2Felm-cheat-sheet/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/izdi","download_url":"https://codeload.github.com/izdi/elm-cheat-sheet/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/izdi%2Felm-cheat-sheet/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279002312,"owners_count":26083340,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-09T02:00:07.460Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cheatsheet","education","elm","functional-programming","learn","tutorial"],"created_at":"2024-07-30T17:00:51.416Z","updated_at":"2025-10-09T23:34:14.100Z","avatar_url":"https://github.com/izdi.png","language":"Elm","funding_links":[],"categories":["Programming Languages","Elm","Resources","Learn","Learning Guides"],"sub_categories":["[Elm](http://elm-lang.org)"],"readme":"# \u003cimg src=\"http://elm-lang.org/assets/logo.svg\" width=\"26\"\u003e Elm Cheat Sheet\n\n## Table of Contents\n1. [Hello World](#hello-world)\n2. [Comments](#comments)\n3. [Modules](#modules)\n    * [Imports](#imports)\n4. [Tools](#tools)\n    * [REPL](#repl)\n    * [Compile](#compile)\n    * [Packaging](#packaging)\n        * [Publish](#publish)\n        * [Documentation](#documentation)\n5. [HTML Embedding](#html-embedding)\n6. [Primitives](#primitives)\n    * [Numbers](#numbers)\n    * [Strings](#strings)\n    * [Booleans](#booleans)\n    * [Other](#other)\n7. [Collections](#collections)\n    * [Lists](#lists)\n    * [Tuples](#tuples)\n    * [Records](#records)\n    * [Other](#other)\n8. [Functions](#functions)\n    * [Anonymous](#anonymous)\n    * [Prefix](#prefix)\n9. [Types](#types)\n    * [Union Types](#union-types)\n    * [Maybe](#maybe)\n10. [Type Aliases](#type-aliases)\n11. [Type Annotation](#type-annotation)\n12. [Operators](#operators)\n    * [Arithmetic](#arithmetic)\n    * [Bitwise](#bitwise)\n    * [Comparison](#comparison)\n    * [Logical](#logical)\n    * [Function Composition](#function-composition)\n    * [Other](#other)\n13. [Control Statements](#control-statements)\n    * [If](#if)\n    * [Case-of](#case-of)\n    * [Let-in](#let-in)\n14. [Ports](#ports)\n\n## Elm in a nutshell\n - purely functional language\n - statically typed\n - no runtime exceptions\n - outperforms most popular rendering libraries\n - package manager\n - built-in tooling\n - HTML, CSS, JavaScript interoperability\n - clean syntax\n - I like frontend again...\n\n## Hello World\nFile `HelloWorld.elm`:\n```elm\nimport Html exposing (h1, text)\nimport Html.Attributes exposing (id)\n\n-- Hello world example\nmain =\n  h1 [id \"hw\"] [text \"Hello World!\"]\n```\n\n## Comments\n```elm\n-- Single line comment\n\n{-\nMulti-line comment\n-}\n```\n\nComments for package [documentation](#documentation)\n\n## Modules\n```elm\n-- Defining a module that exports everything\nmodule Mymodule exposing (..)\n\n-- Export only specified entities\nmodule Mymodule exposing (Type, value)\n\n-- Export all or specific states of type\nmodule Mymodule exposing\n    ( Error(Forbidden, Timeout)\n    , Stuff(..)\n    )\n\ntype Error\n    = Forbidden String\n    | Timeout String\n    | NotFound String\n```\n\n#### Imports\n```elm\n-- qualified imports\nimport String                       -- String.toUpper, String.repeat\nimport String as Str                -- Str.toUpper, Str.repeat\n\n-- unqualified imports\nimport Mymodule exposing (..)                 -- Error, Stuff\nimport Mymodule exposing ( Error )            -- Error\nimport Mymodule exposing ( Error(..) )        -- Error, Forbidden, Timeout\nimport Mymodule exposing ( Error(Forbidden) ) -- Error, Forbidden\n```\n\n\n## Tools\n#### REPL\n`elm repl` / `elm-repl`\n\nImport required modules\n```elm\n\u003e import List\n```\n\nGet function signature\n```elm\n\u003e List.map\n\u003cfunction\u003e : (a -\u003e b) -\u003e List a -\u003e List b\n\u003e (++)\n\u003cfunction\u003e : appendable -\u003e appendable -\u003e appendable\n```\n\nElm expressions return resulting value and type\n```elm\n\u003e 1 + 1\n2 : number\n```\n\nBackslash `\\` is for multi-line expressions\n```\n\u003e fn a b = \\\n|    a + b\n\u003cfunction\u003e : number -\u003e number -\u003e number\n```\n \n#### Compile\n`elm make` / `elm-make`\n\n```bash\n# Default compilation \nelm make HelloWorld.elm -\u003e index.html\n\n# Custom name\n$ elm make HelloWorld.elm --output hw.js\n\n# Multiple files\n$ elm make HelloWorld.elm MyModule.elm --output hw.js\n\n# With warnings\n$ elm make HelloWorld.elm --warn\n\n# To HTML\n$ elm make HelloWorld.elm --output hw.html\n```\n\n#### Packaging\n`elm package` / `elm-package`\n\nInstallation automatically adds `dependencies` in `package.json`.\n```bash\n# Install a package\n$ elm-package install evancz/elm-html\n\n# Specific version\n$ elm-package install evancz/elm-html 1.0.0\n\n# Diff two versions\n$ elm-package diff evancz/virtual-dom  2.0.0 2.1.0\nComparing evancz/virtual-dom 2.0.0 to 2.1.0...\nThis is a MINOR change.\n\n------ Changes to module VirtualDom - MINOR ------\n\n    Added:\n        attributeNS : String -\u003e String -\u003e String -\u003e VirtualDom.Property\n```\n\n#### Documentation\nPublishing a package requires well documented code.\n\n```elm\nmodule Documentation exposing\n    ( Type\n    , value\n    , anyfinCanHappen\n    )\n\n{-| Module level documentation\n\n# Just a header, what to include below\n@docs Type, value\n\n# About Anyfin\n@docs anyfinCanHappen\n\n-}\n\nimport Random exposing (int)\n\n{-| Type level documentation comment -}\ntype Type = Bool\n\n{-|-}\n-- Empty comment above\nvalue : Int\nvalue = 1 + 1\n\n{-| More on anyfinCanHappen -}\nanyfinCanHappen : Generator Int\nanyfinCanHappen =\n    int 0 64\n\n{-| This value is not exported, so isn't required -}\n-- Use basic comment syntax\nimNotExported =\n    \"Don't need to comment me\"\n```\n\n* Documentation comment starts `{-|` ends with `-}`\n* Module documentation comes after module declaration, before the imports\n* Functions are grouped into related sections by keyword `@docs \u003cargs\u003e` and declared with Markdown\n* Each exported entity should have documentation comment on top of its declaration\n\n#### Publish\nAdd `README.md` otherwise publishing will fail\u003cbr/\u003e\nAll packages start with initial version `1.0.0`\u003cbr/\u003e\nVersions all have exactly three parts: `MAJOR.MINOR.PATCH`\u003cbr/\u003e\n* `PATCH` - the API is the same, no risk of breaking code\n* `MINOR` - values have been added, existing values are unchanged\n* `MAJOR` - existing values have been changed or removed\n\n`elm-package.json`\n* `source-directories` - array of directories to look up for project source code inside the working directory\n* `exposed-modules` - modules that exposed to a user after publishing, kind of interface to your internal API.\n\n```bash\n# elm-package.json\nsource-directories\": [\n    \".\",\n    \"SubOne\",\n    \"SubTwo\"\n]\n\"exposed-modules\": [\n    \"SubOne\",\n    \"Goodmodule\",\n    \"Module\"\n]\n\n├── SubOne\n│   └── SubOne.elm        # Compiled and exposed\n├── SubTwo\n│   └── SubTwo.elm        # Compiled, but unexposed\n├── SubThree\n│   └── SubThree.elm      # Compiler won't see the source, unexposed to the users\n├── README.md\n├── elm-package.json\n├── Goodmodule.elm        # Compiled and exposed\n└── Module.elm            # Compiled and exposed\n```\n\nPublish\n```bash\n$ git tag -a 1.0.0 -m \"initial release\"\n$ git push --tags\n\n$ elm-package publish\n```\n\nUpdating\n```bash\n$ elm-package bump\n\n$ git tag -a 1.0.1 -m \"secondary release\"\n$ git push --tags\n\n$ elm-package publish\n```\n\n## HTML Embedding\nRunning fullscreen\n`elm-make HelloWorld.elm` -\u003e `elm.js`\n```html\n\u003cscript type=\"text/javascript\" src=\"elm.js\"\u003e\u003c/script\u003e\n\u003cscript type=\"text/javascript\"\u003e\n    Elm.Main.fullscreen();\n\u003c/script\u003e\n```\n\nEmbed explicitly in a html element\n```html\n\u003cscript type=\"text/javascript\" src=\"elm.js\"\u003e\u003c/script\u003e\n\u003cscript type=\"text/javascript\"\u003e\n    var elmHolder = document.getElementById('hw-wrapper');\n\n    Elm.Main.embed(elmHolder);\n\u003c/script\u003e\n```\n\nRun without graphics\n```javascript\nElm.Main.worker();\n```\n\n## Primitives\n#### Numbers\nNumeric types are `Int` and `Float`, `number` represents both `Int` and `Float`:\n```elm\n\u003e 1\n1 : number\n\u003e 2.0\n2 : Float\n\u003e truncate 0.1\n0 : Int\n\u003e truncate 1\n1 : Int\n```\n\n#### Strings\nString types are `Char` and `String`\n```elm\n\u003e 'a'\n'a' : Char\n\u003e \"Hello\"\n\"Hello\" : String\n```\n\nMulti-line string\n```elm\n\"\"\"\nHello\nWorld\n\"\"\"\n```\n\nSingle quotes are for `char` only\n```elm\n\u003e 'ab'\n-- SYNTAX PROBLEM --\n\u003e \"ab\"\n\"ab\" : String\n```\n\n#### Booleans\n```elm\n\u003e True\nTrue : Bool\n\u003e False\nFalse : Bool\n```\n\n#### Other\n`comparable` - `ints`, `floats`, `chars`, `strings`, `lists`, `tuples`\n\u003cbr/\u003e\n`appendable` - `strings`, `lists`, `text`.\n\u003cbr/\u003e\nKind of dynamic types are represented as `a`, `b`, `c` etc. meaning that you can pass any value, even functions\n\n## Collections\nAll values and data structures in Elm are immutable.\n\n#### Lists\nA `list` holds a collection of related values separated by commas and enclosed in\nsquare brackets. All the values in a list must have the same type:\n```elm\n\u003e []\n[] : List a\n\u003e [1,2,3]\n[1,2,3] : List number\n\u003e [\"a\", \"b\", \"c\"]\n[\"a\",\"b\",\"c\"] : List String\n```\n\nWays to create a list\n```elm\n\u003e List.range 1 4\n\u003e [1,2,3,4]\n\u003e 1 :: [2,3,4]\n\u003e 1 :: 2 :: 3 :: 4 :: []\n```\n\n#### Tuples\nTuples package many expressions into a single expression.\nThey have a minumum of two elements and maximum of nine.\nThe type of a tuple records the number of components and each of their types.\n```elm\n\u003e (1, \"2\", True)\n(1,\"2\",True) : ( number, String, Bool )\n```\n\nIt's also possible to use commas as a tuple function, like a [prefix operation](#prefix).\n```elm\n\u003e (,,,) 1 True 'a' []\n(1,True,'a',[]) : ( number, Bool, Char, List a )\n```\n\nDestructuring\n```elm\n(x, y) = (1, 2)\n\u003e x\n1 : number\n```\n\n#### Records\nA `record` is a collection of key/value pairs,\nsimilar to objects in JavaScript or dictionary in Python\n```elm\nmyRecord =\n { style = \"Blue\",\n   number = 1,\n   isCool = True\n }\n```\n\nAccessing records\n```elm\n\u003e myRecord.style\n\"Blue\" : String\n\u003e .style myRecord\n\"Blue\" : String\n```\n\nUpdating records returns a new record\n```elm\n\u003e updatedRecord = { myRecord | style = \"Red\", number = 10, isCool = False }\n\u003e myRecord.style\n\"Blue\" : String\n\u003e updatedRecord.style\n\"Red\" : String\n```\n\nDestructuring\n```elm\n{ style, number, isCool } = myRecord\n\u003e style\n\"Blue\" : String\n```\n\nExtensible records\n\n```elm\n-- good usecase for extensible records is to be able to compose records and to be able to define functions that work on different kinds of records\n\n-- define a type of record that has some properties and could have other properties\n\ntype alias Mammal r = {\n   r | legs : Int\n}\n\n-- cat is an example of extending the record Mammal by adding properties name and ageInHumanYears\n\ncat : Mammal\n    { name : String\n    , ageInHumanYears = 13\n    }\n\ncat =\n  { name = \"Mittens\"\n  , ageInHumanYears = 13\n  , legs = 4\n  }\n```\n\n```elm\n-- mutate is a function that can work on any Mammal\n\nmutate : Mammal r -\u003e Mammal r\nmutate mammal =\n    { mammal | legs = mammal.legs + 1 }\n\nmutatedCat = mutate cat\nmutatedCat.legs == 5\n```\n\n#### Other\nCore library also has:\n * [Array](http://package.elm-lang.org/packages/elm-lang/core/latest/Array)\n * [Dict](http://package.elm-lang.org/packages/elm-lang/core/latest/Dict)\n * [Set](http://package.elm-lang.org/packages/elm-lang/core/latest/Set)\n\n## Functions\nBasics\n```elm\n-- function name | arguments names = function body\nsum a b = a + b\n\n-- combine arguments in a tuple\nsum (a, b) = a + b\n```\n\nAll functions in Elm are _curried_ by default.\u003cbr/\u003e\nIf you have \"a function of 2 arguments\", it's really a function that takes one argument and returns a function that takes another argument:\n```elm\n-- Both are equal\nmyFunction arg1 arg2\n((myFunction arg1) arg2)\n\n-- Partial application\n\u003e minus x y = (-) x y\n\u003cfunction\u003e : number -\u003e number -\u003e number\n\u003e minus1 = minus 1\n\u003cfunction\u003e : number -\u003e number\n\u003e minus1 11\n-10 : number\n```\n\n#### Anonymous\nAlso known as _lambdas_\n```elm\n-- (\\function arguments -\u003e function body)\n-- parenthesized, content starts with backslash\n(\\n -\u003e n \u003c 0)\n(\\x y -\u003e x * y)\n```\n\n#### Prefix\n_Prefix_ notation is when we use [operators](#operators) as regular functions by enclosing them in parentheses.\n```elm\n-- Normally you would do this\n\u003e \"abcde\" ++ \"fghij\"\n\"abcdefghij\" : String\n\n-- Prefix\n\u003e (++) \"abcde\" \"fghij\"\n\"abcdefghij\" : String\n```\n\n## Types\n#### Union Types\nElm allows to create custom types known as _union types_.\u003cbr/\u003e\nThe expression below creates a type which can have one of the values (or _tags_) from the right. _Union types_ tightly coupled with [case-of](#case-of) statement.\n```elm\ntype Movement = Right | Left | Stop\n```\n\nTags bring additional information, after tag itself comes a type or multiple types.\n```elm\ntype Movement\n    = Right Int\n    | Left Int\n    | Stop Bool\n    | Coordinates (Float, Float)\n\n-- passing to the function\nmyFunction ( Coordinates (45.7, 67.5) )\n```\n\n_Union types_ can also have type variables\n```elm\ntype Person a\n  = Name String\n  | Surname String\n  | Age Int\n  | About a\n```\n\n#### Maybe\nA `Maybe` can help you with optional arguments, error handling, and records with optional fields. Think of it as a kind of `null`\n```elm\n-- Maybe resides in a module\nimport Maybe exposing ( Maybe(..) )\n\n-- Takes an argument that can be filled with any value\ntype Maybe a = Just a | Nothing\n```\n\n[Type annotation](#type-annotation) explicitly tells that it will give back an `Int` or it won't.\n```elm\ngetId : Int -\u003e Maybe Int\ngetId id =\n  if id \u003e= 0 then\n    Just id\n  else\n    Nothing\n```\n\n## Type Aliases\nYou can give existing types a custom name with `type alias`\n```elm\ntype alias Name = String\ntype alias Dob = String\n\ntype alias Record = { name: Name, dob: Dob }\n```\n\nWe can use it later annotating function\n```elm\nrecord : Record\nrecord =\n    { name = \"Dave\", dob = \"27/08/1999\" }\n```\n\nBut still `type alias` equals to it's parent `type`\n```elm\ntype alias Name = String\n\nname : Name\nname =\n  \"Dave\"\n\nsecondName : String\nsecondName =\n  \"Dave\"\n\n-- True\nname == secondName\n```\n\n## Type Annotation\nElm, like most ML dialects, automatically infers most types.\u003cbr/\u003e\n```elm\n-- function name : 1st arg type -\u003e 2nd arg type -\u003e return type\nfnc : Int -\u003e List -\u003e Int\n```\nExample below is read as function that takes an __a__ value and returns a __b__ value, list of __a__ values returns a list of __b__ values\n```elm\nmap: (a -\u003e b) -\u003e List a -\u003e List b\n```\n\nPattern matching on record fields\n```elm\n-- Requires the argument with x and y fields\nmultiply {x,y} =\n    x * y\n```\n\nAnnotating records\n```elm\ncoordinates : { x : Float, y : Float }\ncoordinates =\n    { x = 0,\n      y = 0\n    }\n```\n\n## Operators\nIn a nutshell Elm operators are _functions_ that take two arguments.\n\n#### Arithmetic\n|Operator|Description|Type hint|\n|--------|-----------|----------|\n|`+`|addition|`number -\u003e number -\u003e number`\n|`-`|subtraction|`number -\u003e number -\u003e number`\n|`*`|multiplication|`number -\u003e number -\u003e number`\n|`/`|floating point division|`Float -\u003e Float -\u003e Float`\n|`//`|integer division, discard the reminder|`Int -\u003e Int -\u003e Int`\n|`^`|exponentiation|`number -\u003e number -\u003e number`\n|`%`|modulo|`Int -\u003e Int -\u003e Int`\n\n#### Bitwise\n|Operator|Description|Type hint|\n|--------|-----------|----------|\n|`and`|bitwise AND|`Int -\u003e Int -\u003e Int`\n|`or`|bitwise OR|`Int -\u003e Int -\u003e Int`\n|`xor`|biwise XOR|`Int -\u003e Int -\u003e Int`\n\n#### Comparison\n|Operator|Description|Type hint|\n|--------|-----------|----------|\n|`==`|equal|`comparable -\u003e comparable -\u003e Bool`\n|`/=`|not equal|`comparable -\u003e comparable -\u003e Bool`\n|`\u003c`|less than|`comparable -\u003e comparable -\u003e Bool`\n|`\u003c=`|less than or equal|`comparable -\u003e comparable -\u003e Bool`\n|`\u003e`|greater than|`comparable -\u003e comparable -\u003e Bool`\n|`\u003e=`|greater than or equal|`comparable -\u003e comparable -\u003e Bool`\n\n#### Logical\n|Operator|Description|Type hint|\n|--------|-----------|----------|\n|`\u0026\u0026`|logical and|`Bool -\u003e Bool -\u003e Bool`\n|`\\|\\|`|logical or|`Bool -\u003e Bool -\u003e Bool`\n|`not`|logical not|`Bool -\u003e Bool`\n\n#### Function Composition\n|Operator|Description|Type hint|\n|--------|-----------|----------|\n|`\u003c\\|`|backward (pipe) function application `f \u003c\\| x == f x`|`(a -\u003e b) -\u003e a -\u003e b`\n|`\\|\u003e`|forward (pipe) function application `x \\|\u003e f == f x`|`a -\u003e (a -\u003e b) -\u003e b`\n|`\u003c\u003c`|composes functions into one, arguments first applied to the function from the right side|`(b -\u003e c) -\u003e (a -\u003e b) -\u003e a -\u003e c`\n|`\u003e\u003e`|same as before except arguments first applied to the function from the left side|`(a -\u003e b) -\u003e (b -\u003e c) -\u003e a -\u003e c`\n\n#### Other\n|Operator|Description|Type hints|\n|--------|-----------|----------|\n|`++`|put appendable things together|`appendable -\u003e appendable -\u003e appendable`|\n|`::`|add an element to the front of a list|`a -\u003e List a -\u003e List a`|\n|`as`|keyword that creates aliases for values `(x, y) as t == t = (x, y)`|`a -\u003e a`|\n\n## Control statements\n#### If\nAll the branches of an if need to match so that no matter which one we take, we get back the same type of value overall.\n```elm\nif a \u003c 1 then\n    \"It's zero\"\nelse\n    \"Non-zero\"\n\n-- Multi-line.\nif y \u003e 0 then\n    \"Greater\"\nelse if x /= 0 then\n    \"Not equals\"\nelse\n    \"silence\"\n```\n\nElm does not have the notion of “truthiness”.\u003cbr/\u003e\nThe condition must evaluate to True or False, and nothing else.\n```elm\n\u003e if 1 then \"nope\" else \"nope again\"\n- TYPE MISMATCH --\n```\n\n#### Case-of\nCase tries to match the value of type against patterns defined after the `of` keyword\n```elm\ntype User\n    = Activated\n    | Deleted\n\nupdate state =\n  case state of\n    Activated -\u003e\n      -- do something\n    Deleted -\u003e\n      -- do again\n```\n\nIn case of passing tags with additional properties, parameters are passed along with type checking\n```elm\ntype User\n    = Activated Int\n    | Deleted (Int, String)\n\nupdate state =\n  case state of\n    Activated value -\u003e\n      -- do something with value\n    Deleted values -\u003e\n      -- do something with values\n\nupdate ( Activated 1 )\nupdate ( Deleted (0, \"gone\") )\n```\n\n#### Let-in\n`let` allows you to define intermediate values.\n```elm\nlet\n  x = 3 * 8\n  y = 4 ^ 2\nin\n  x + y\n```\n\n`let` helps simplify complex expressions\n```elm\nlet\n  activeUsers = List.filter (\\u -\u003e u.state /= 1) model.users\nin\n  { model | user = activeUsers}\n```\n\n## Ports\nPorts are a general purpose way to communicate with JavaScript.\n\n#### From JavaScript to Elm\n```elm\n-- declare that this module uses ports\nport module Main exposing (..)\n\n-- define port\nport portName : (String -\u003e msg) -\u003e Sub msg\n```\n\n```javascript\nvar main = Elm.Main.embed(div);\n\n// send into port\nmain.ports.portName.send(\"Port value\");\n```\n\n#### From Elm to JavaScript\n```elm\nport showPortName : String -\u003e Cmd msg\n```\n\n```javascript\nfunction logName(name) {\n    console.log(name);\n}\n\n// subscribe to receive events\nmain.ports.showPortName.subscribe(logName);\n\n// unsubscribe\nmain.ports.showPortName.unsubscribe(logName);\n```\n\n#### Type interoperability\n|JavaScript|Elm|\n|----------|---|\n|Booleans|Bool|\n|Numbers|Int, Float|\n|Strings|Char, String|\n|Arrays|List, Array, Tuples (fixed-length)|\n|Objects|Records|\n|JSON|[Json.Encode.Value](http://package.elm-lang.org/packages/elm-lang/core/latest/Json-Encode#Value)|\n|null|Maybe Nothing|\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fizdi%2Felm-cheat-sheet","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fizdi%2Felm-cheat-sheet","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fizdi%2Felm-cheat-sheet/lists"}