Execercises (Elmoin Meetup July 2016)

Let's have some fun talking Elm to Javascript, and vice versa.

Exercises

Helpful links

• JavaScript and Ports · An Introduction to Elm
• Moment.js Documentation
• Material Design Lite Documentation

Installation

• Fork https://github.com/elmoin/port-exercise.git

• Run

git clone https://github.com/elmoin/port-exercise.git {your-project}
cd {your-project}
npm i
elm package install -y
npm start

• Open http://localhost:3333 in your browser to to see your result immediately while coding with your editor.

• Finally open a pull request to show your results.

Exercise 1

• Use momentjs to count how many days we already have had this year from today.
• Hint: Use "difference" http://momentjs.com/docs/#/displaying/difference/

Exercise 2

• Create two input fields to enter two different dates.
• Use momentjs to determine how many years, months and days are between these two dates?
• Example data:

Date 1: 01/01/2010
Date 2: 13/07/2016
Result: 6 years, 7 months, 13 days

• Hint: For an example of an input implementation check Todo.elm of Elm TodoMVC app.

Exercise 3

• Extend the basic example to get a random number from JS right after the initialization of the application without clicking the button "Get random from JS!"
• Hint: Check out programWithFlags and "Sending data to a port immediately after initialization"

License

MIT

Have fun :)