DEV Community

Cover image for Writing A Word Memory Game In Elm - Part 1: Setting Up an Elm Application With Parcel

Writing A Word Memory Game In Elm - Part 1: Setting Up an Elm Application With Parcel

Mickey on March 20, 2019

This is part 1 of the series "Writing A Word Memory Game In Elm", find: Part 1: Setting Up an Elm Application With Parcel Part 2: Modeling And Bu...
Collapse
 
perty profile image
Per Lundholm

I understand that you are in the process of learning Elm. You do not need to use Parcel, there is a command "elm init" that sets up an initial directory. Also there is various other options, like elm-app that creates a service worker. You should also be familiar with elm-live, which is nice when trying things out.

An alternative to HTML and CSS is elm-ui, but if you have a CSS framework that you know, of course start there.

Collapse
 
mickeyvip profile image
Mickey • Edited

Hi Per.

Thank you for your comment.

Yes I am learning Elm and I am aware of the elm init, create-elm-app (if this is what you meant by elm-app) and elm-live.

Here I wanted a very lightweight setup that will give me a nice development experience.

elm init would mean manually compiling each time.
elm-live - manually refreshing the page.
create-elm-app - setting up a lot of things that I don't need.

So I decided to go for parcel-bundler - zero config, automatically setting up the Elm project and giving me a development server + hot module reload.

Regarding elm-ui - I am planning to dig into it deeper, but for this small project I wanted to be focused on more Elm core things. I am thinking of eventually converting this project to use elm-ui, but not just now.

Collapse
 
antonrich profile image
Anton

I went with the parcel as well. But I have an empty page. If I have an error in the compiler the parcel tells me about it. So that means it's working. But the page is still empty.

A note on elm-live. You don't have to manually update the page it is automatic.

Thread Thread
 
mickeyvip profile image
Mickey

Hi, Anton.

Sorry to hear the Parcel didn't work for you.

It is hard to understand what is wrong without seeing your code. Can you share it so I can take a look?

Also, you're right about the elm-live. My mistake.

Thread Thread
 
antonrich profile image
Anton

Actually, it works. I figured what the problem was. The problem was with my Russian government blocking the Elm. Parcel wanted to download some packages. I turned on vpn and it worked.

I knew there was something strange about it. Because the code didn't have a mistake. And when I for example purposefully introduce a mistake the parcel/elm would show it to me in the browser.

Thread Thread
 
mickeyvip profile image
Mickey

It's great you figured that out!

Collapse
 
antonrich profile image
Anton • Edited

It's working with elm-live though:

https://thepracticaldev.s3.amazonaws.com/i/t21q08ymdym8qqcl5pwc.png

Collapse
 
mickeyvip profile image
Mickey

Unfortunately the link seems to be broken.

Collapse
 
antonrich profile image
Anton

Seems to have been a dev.to issue.
The screenshot basically shows that it runs with elm-live.