# Writing a timer, learning elm, need help

**URL:** <https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529>\
**Category:** Show and Tell\
**Created:** [October 22, 2019, 5:25pm UTC](https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529 "2019-10-22T17:25:00Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![bobishh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/bobishh/32/2613_2.png) [@bobishh](https://discourse.elm-lang.org/u/bobishh)\
**Post date:** [October 22, 2019, 5:25pm UTC](https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529/1 "2019-10-22T17:25:01Z")

</div>

Hi all!

I got some free time recently and did [this thing](http://ifail.live/event/MTU2OTg3NzIwMDAwMDx8PkkgZG9uJ3QgaGF2ZSBhIGpvYiBmb3IgLi4u)

[here’s the code](https://github.com/bobishh/timecounter)

If you’re lazy like me, you’re not reading code right away, so here’s the idea -

I wanted to learn Elm and write a simple app to create timers of a different kind, like counting how long you’ve stopped smoking or how many days left until X event will happen, like someone’s birthday or your next payday, etc.

So after the first attempt with classic CRUD stuff on a backend side, I decided to store the event in the URL, by base64-ing a pre-encoded string and stay backend-less. I’m storing event as “12411342342342\<|\>Event title” where number is POSIX milliseconds for now, and it’s not the best choice either since it has 2038 problem

For now, I haven’t read a lot of guides on how to do things in Elm except few libs documentation and things like elm.christmas, copy-pasted few code examples and made this weird event and timer types (most likely wrong), and Ticking stuff to update time left

So I’m looking for advice on how to build this thing right

Ideally, I would like it to support

- localization
- templates for a timer (maybe strftime-like format for displaying time left)
- form for timer creation (datetime + text + supposedly template with html+css and interpolation)

---

<div class="post-metadata">

**Author:** ![ianmackenzie](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/ianmackenzie/32/86_2.png) [@ianmackenzie](https://discourse.elm-lang.org/u/ianmackenzie)\
**Post date:** [October 22, 2019, 5:44pm UTC](https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529/2 "2019-10-22T17:44:47Z")

</div>

Hi @bobishh! It’s a pretty broad question, but I’ll throw in a few thoughts =)

For localization, there are a few different approaches, but I really like [this one](https://www.gizra.com/content/elm-i18n-type-safety/) which seems very clean and flexible. (Disclaimer: I haven’t actually used it myself, but I really like the concept and I know that others have [used it successfully](https://discourse.elm-lang.org/t/i18n-for-elm-application/910/3).)

For general UI creation, I’d suggest checking out [elm-ui](https://package.elm-lang.org/packages/mdgriffith/elm-ui/latest/), which is a popular and fantastic package for laying out UIs without having to worry about the weird bits of HTML and CSS (this one I _have_ used on several projects and it’s great).

I’d also suggest using [elm-format](https://github.com/avh4/elm-format) to format your code - it can take a bit of getting used to depending on what you expect, but it’s great not to have to worry about formatting (and the majority of Elm developers do use elm-format, so if you get used to its style then it should be easy for you to read other people’s code and collaborate with them).

---

<div class="post-metadata">

**Author:** ![ianmackenzie](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/ianmackenzie/32/86_2.png) [@ianmackenzie](https://discourse.elm-lang.org/u/ianmackenzie)\
**Post date:** [October 22, 2019, 5:46pm UTC](https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529/3 "2019-10-22T17:46:50Z")

</div>

Also, for quick questions, definitely join the [Elm Slack](https://elmlang.herokuapp.com/) which is very active - **#general** , **#beginners** and **#help** may be useful, plus more specific channels like **#elm-ui** depending what direction you go in.

---

<div class="post-metadata">

**Author:** ![bobishh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/bobishh/32/2613_2.png) [@bobishh](https://discourse.elm-lang.org/u/bobishh)\
**Post date:** [October 22, 2019, 10:11pm UTC](https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529/4 "2019-10-22T22:11:07Z")

</div>

Hi Ian, thanks!  
I’m already playing with elm-ui and definitely will take a look at elm-i18n

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/1X/50a05e53677a2c3b47776d7abd0f113eb50193a1.png) [@system](https://discourse.elm-lang.org/u/system)\
**Post date:** [November 1, 2019, 10:11pm UTC](https://discourse.elm-lang.org/t/writing-a-timer-learning-elm-need-help/4529/5 "2019-11-01T22:11:16Z")

</div>

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.