7/25/2019 14 09 29 Townsend Elm

1/27

The Elm Programming Langua

Richard Townsend

Advanced Topics in Programming Languages and Com

7/25/2019 14 09 29 Townsend Elm

2/27

Where did Elm come from?

Evan Czaplicki

7/25/2019 14 09 29 Townsend Elm

3/27

Where did Elm come from?

Frustrated with GUI design

Evan Czaplicki

7/25/2019 14 09 29 Townsend Elm

4/27

Where did Elm come from?

Frustrated with GUI design

Use declarative approach

Evan Czaplicki

7/25/2019 14 09 29 Townsend Elm

5/27

Where did Elm come from?

Frustrated with GUI design

Use declarative approach

Want responsive GUIs

Evan Czaplicki

7/25/2019 14 09 29 Townsend Elm

6/27

Functional Reactive Programmin

7/25/2019 14 09 29 Townsend Elm

7/27

Functional Reactive Programmin

ReactivePure Functional

7/25/2019 14 09 29 Townsend Elm

8/27

Functional Reactive Programmin

ReactivePure Functional

Computation = Functions

No side effects

7/25/2019 14 09 29 Townsend Elm

9/27

Functional Reactive Programmin

Reactive

Computation = Dat

Side effects run th

Pure Functional

Computation = Functions

No side effects

7/25/2019 14 09 29 Townsend Elm

10/27

Functional Reactive Programmin

Reactive

Computation = Dat

Side effects run th

Pure Functional

Computation = Functions

No side effects

How do we get both?

7/25/2019 14 09 29 Townsend Elm

11/27

Signals: Time-Varying Values

7/25/2019 14 09 29 Townsend Elm

12/27

Signals: Time-Varying Values

7/25/2019 14 09 29 Townsend Elm

13/27

Signals: Time-Varying Values

7/25/2019 14 09 29 Townsend Elm

14/27

Signals: Time-Varying Values

7/25/2019 14 09 29 Townsend Elm

15/27

The main idea

Everything is a pure expression

unless you use Signals.

7/25/2019 14 09 29 Townsend Elm

16/27

The main idea

Elms Idea:1. Pure expressions -> layout of GUI

7/25/2019 14 09 29 Townsend Elm

17/27

The main idea

Elms Idea:1. Pure expressions -> layout of GUI

2. Signals -> react to real-world events

7/25/2019 14 09 29 Townsend Elm

18/27

The main idea

Elms Idea:

1. Pure expressions -> layout of GUI

2. Signals -> react to real-world events

3. liftand foldp -> update layout dynami

7/25/2019 14 09 29 Townsend Elm

19/27

Elm in Action: GUI Layout

content : [Element]

content = [ plainText "Bears, Oh My!" , image 200 200 "/yogi.jpg"

, asText (reverse [1..9])

]

main : Element

main = flow down content[9

7/25/2019 14 09 29 Townsend Elm

20/27

Elm in Action: Signals

import Mouse

resizeableYogi : Int -> Element

resizeableYogi n = image n n "/yogi.jpg"

edgeLength : Signal Int

edgeLength = lift (\(x,y) -> max x y) Mouse.po

main : Signal Element

main = lift resizeableYogi edgeLength

7/25/2019 14 09 29 Townsend Elm

21/27

Elm in Action: Mix N Match

7/25/2019 14 09 29 Townsend Elm

22/27

Current Compiler http://elm-lang.org/

Elm-to-Javascript compiler With HTML and CSS too Can generate JS file

7/25/2019 14 09 29 Townsend Elm

23/27

Current Compiler http://elm-lang.org/

Elm-to-Javascript compiler With HTML and CSS too Can generate JS file

Advantages

Complex graphics are possible unmatched cross-platform supportCzaplicki, Evan, and St

"Asynchronous Function

Programming for GUIs."

34th ACM SIGPLAN Con

Programming Language

Implementation(2013)

7/25/2019 14 09 29 Townsend Elm

24/27

Current Compiler http://elm-lang.org/

Elm-to-Javascript compiler With HTML and CSS too Can generate JS file

Advantages

Complex graphics are possible unmatched cross-platform support

Disadvantages Issues with concurrency Slow program execution

Czaplicki, Evan, and St

"Asynchronous Function

Programming for GUIs."

34th ACM SIGPLAN Con

Programming Language

Implementation(2013)

7/25/2019 14 09 29 Townsend Elm

25/27

Conclusions

Elm is pretty awesome! functional web programming scares you

Programming I

Impatient Designer. N.p.,

7/25/2019 14 09 29 Townsend Elm

26/27

Conclusions

Elm is pretty awesome! functional web programming scares you

Still growing! production continues at Prezi time-traveling debugger

Programming I

Impatient Designer. N.p.,

7/25/2019 14 09 29 Townsend Elm

27/27

References

Czaplicki, Evan, and Stephen Chong. "Asynchronous Functional Reactive Programming

Proceedings of the 34th ACM SIGPLAN Conference on Programming Language Design Implementation(2013): 411-22. Print.

Czaplicki, Evan. "Elm." Elm. N.p., n.d. Web. 28 Sept. 2014. .

Czaplicki, Evan. "Functional Reactive Programming in Elm." Strange Loop. 5 Nov. 201

28 Sept. 2014.

http://elm-lang.org/