elixir-elm-tutorial/elixir-elm-tutorial-book

Elixir and Elm Tutorial

This repository contains the Markdown source files used to create the Elixir and Elm Tutorial book.

The latest changes are on the preview branch, and the published version will be derived from the master branch.

Need Help?

• Open a GitHub Issue.
• Email me at [email protected].

elixir-elm-tutorial-book's Issues

Inbox

PLANNING

• Content Phase: Initial writing to document the full implementation of the demo application. This phase will be heavy on task-oriented content and light on explanation.
• Detail Phase: Refine content and provide in-depth explanation. Both the approach and concepts will be expounded upon in this phase.
• Distillation Phase: Remove unnecessary content and condense to the essentials.

TASKS

MARKETING

• Link from original GitBook version to LeanPub landing page.
• Register relevant domains and point them to LeanPub landing page.
• Update link on personal "now" page to point to LeanPub book.

WRITING

• Write introduction.
• Write chapter on "diving in".
• Write chapter on introductory Elixir concepts.
• Write chapter on Heroku deployments and CI.
• Write chapter on Phoenix migrations and updating resources.
• Migrate notes section out of the book.
• Add page at the very end with planning and contact information.
• Add a placeholder page for Elm minigame ideas.
• Write chapter on Phoenix authentication.
• Write chapter on introductory Elm content.
• Write initial Phoenix API chapter.
• Finish updating current outline.
• Update last page with a link to a Slack community.
• Clarify initial generators with information about bounded contexts.
• Continue writing Our First Game chapter.

PUBLISHING

• Start writing using GitBook platform.
• Finish importing everything from GitBook to LeanPub.
• Link from original GitBook version to LeanPub landing page.
• Generate a free LeanPub sample.
• Add disclaimer about super early draft.
• Rewrite a more compelling intro for landing page.
• Add information about versions covered in the book.
• Publish super early draft on LeanPub and ask for feedback.
• Post request for book covers on Fiverr.
• Write an alternate TOC: What would the book look like for LeanPub early adopters vs. printed book mainstream customers.

APPLICATION

• Move application tasks to platform repo.

SUPPORT

• Create a Slack for live support and sharing.
• Be more clear about using Phoenix 1.3 instead of just mentioning it on the landing page.
• Create reader survey.
• Review image sizing issue for epub format. [Couldn't reproduce issue.]

Remaining Chapters for v1.0 Release

There is still a lot of work remaining for a stable v1.0 release of Elixir and Elm Tutorial. But this issue is an attempt to give an overall idea of the major features remaining.

Remaining Major Features

• Syncing player scores from the front-end to the back-end. Currently, the Platformer demo game isn't set up to know what the current game (game.id) is from the back-end. And it doesn't know who the current player (player.id) is either. The idea for the last big feature in the book is to use Phoenix channels to occasionally send the playerScore field data (perhaps at the end of a level?) using the Gameplay module.

Time Permitting Features

• Character skills for Platformer demo game. Currently, the Platformer demo is a simple game where the player can move the character around and collect items. In addition to being able to move left and right on the screen, the player should also be able to run and jump. In hopes of making the game a bit more fun, the game ideally will be structured with "levels" where the player will have to use the different character skills (walking, running, jumping) to complete a level and make progress to the end state.

Remaining Ancillary Features and Chores

• Resolve all documented platform bugs. The v1.0 release is intended to be a solid, stable release. Even if the future features below aren't included, the v1.0 release should be free from errors and things that will potentially confuse readers.
• Run through the full book prior to the stable v1.0 release to verify that it works with all the latest versions, including the latest dependency releases.

Future Features

• Latest Elixir, Phoenix, and Elm Versions. The book currently covers the latest versions, and the plan is to keep it updated so that it doesn't fall behind or become confusing to work through as new versions are released.
• Additional Minigame Demos. The original plan for the book was to have a handful of tiny "games" on the platform. I opted to go for a single substantial game instead of several tiny ones, but the intention is that the next version of the book (after a stable v1.0 release) will have at least one additional example game. And ideally the next game will be heavy on mouse interaction since the first one is based on keyboard input.
• Player Chat Feature. Having a player chat feature will be a good opportunity to cover GenServers, and that will be a priority for the next version of the book.

Phoenix Fails Compile on Heroku

Seems to be erroring out on a ")"
But my project passes "mix test"
The Heroku CLI on my laptop generates a secret... does it need to be manually put on Heroku?

remote: Restoring cached assets
remote: sending incremental file list
remote: ./
remote:
remote: sent 63 bytes received 19 bytes 164.00 bytes/sec
remote: total size is 0 speedup is 0.00
remote: Running custom compile
remote:
remote: > @ deploy /tmp/build_1d2fbbd7/assets
remote: > webpack --mode production
remote:
remote: /tmp/build_1d2fbbd7/assets/node_modules/hard-source-webpack-plugin/index.js:105
remote: );
remote: ^
remote: SyntaxError: Unexpected token )
remote: at NativeCompileCache._moduleCompile (/tmp/build_1d2fbbd7/assets/node_modules/v8-compile-cache/v8-compile-cache.js:242:18)
remote: at Module._compile (/tmp/build_1d2fbbd7/assets/node_modules/v8-compile-cache/v8-compile-cache.js:186:36)
remote: at Object.Module._extensions..js (module.js:579:10)
remote: at Module.load (module.js:487:32)
remote: at tryModuleLoad (module.js:446:12)
remote: at Function.Module._load (module.js:438:3)
remote: at Module.require (module.js:497:17)
remote: at require (/tmp/build_1d2fbbd7/assets/node_modules/v8-compile-cache/v8-compile-cache.js:161:20)
remote: at Object. (/tmp/build_1d2fbbd7/assets/webpack.config.js:3:33)
remote: at Module._compile (/tmp/build_1d2fbbd7/assets/node_modules/v8-compile-cache/v8-compile-cache.js:194:30)
remote: at Object.Module._extensions..js (module.js:579:10)
remote: at Module.load (module.js:487:32)
remote: at tryModuleLoad (module.js:446:12)
remote: at Function.Module._load (module.js:438:3)
remote: at Module.require (module.js:497:17)
remote: at require (/tmp/build_1d2fbbd7/assets/node_modules/v8-compile-cache/v8-compile-cache.js:161:20)
remote: at WEBPACK_OPTIONS (/tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/utils/convert-argv.js:114:13)
remote: at requireConfig (/tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/utils/convert-argv.js:116:6)
remote: at /tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/utils/convert-argv.js:123:17
remote: at Array.forEach (native)
remote: at module.exports (/tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/utils/convert-argv.js:121:15)
remote: at yargs.parse.err (/tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/cli.js:71:45)
remote: at Object.parse (/tmp/build_1d2fbbd7/assets/node_modules/yargs/yargs.js:576:18)
remote: at /tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/cli.js:49:8
remote: at Object. (/tmp/build_1d2fbbd7/assets/node_modules/webpack-cli/bin/cli.js:366:3)
remote: at Module._compile (module.js:570:32)
remote: at Object.Module._extensions..js (module.js:579:10)
remote: at Module.load (module.js:487:32)
remote: at tryModuleLoad (module.js:446:12)
remote: at Function.Module._load (module.js:438:3)

remote: npm ERR! Linux 4.4.0-1078-aws
remote: npm ERR! argv "/tmp/build_1d2fbbd7/.heroku/node/bin/node" "/tmp/build_1d2fbbd7/.heroku/node/bin/npm" "run" "deploy"
remote: npm ERR! node v6.9.2
remote: npm ERR! npm v3.10.9
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! @ deploy: webpack --mode production
remote: npm ERR! Exit status 1
remote: npm ERR!
remote: npm ERR! Failed at the @ deploy script 'webpack --mode production'.
remote: npm ERR! Make sure you have the latest version of node.js and npm installed.
remote: npm ERR! If you do, this is most likely a problem with the package,
remote: npm ERR! not with npm itself.
remote: npm ERR! Tell the author that this fails on your system:
remote: npm ERR! webpack --mode production
remote: npm ERR! You can get information on how to open an issue for this project with:
remote: npm ERR! npm bugs
remote: npm ERR! Or if that isn't available, you can get their info via:
remote: npm ERR! npm owner ls
remote: npm ERR! There is likely additional logging output above.
remote:
remote: npm ERR! Please include the following file with any support request:
remote: npm ERR! /tmp/build_1d2fbbd7/assets/npm-debug.log
remote: ! Push rejected, failed to compile Phoenix app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to platform-application.
remote:
To https://git.heroku.com/platform-application.git
! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/platform-application.git'

bradhutchins@MacBook-Pro platform % heroku config
=== platform-application Config Vars
DATABASE_URL: postgres://hgujxzezikttph:[e-mail]:5432/d2pm80vlikigg3
SECRET_KEY_BASE: MRO58jwCBOFs1OP33HLx9tbyoWco33+9n2q/wNRgBtnNPIGJXXo3g+0ja/Jq7sLi
bradhutchins@MacBook-Pro platform %

bradhutchins@MacBook-Pro platform % node -v
v10.19.0
bradhutchins@MacBook-Pro platform % npm -v
6.14.4
bradhutchins@MacBook-Pro platform % elixir -v
Erlang/OTP 23 [erts-11.1.1] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] [hipe] [dtrace]

Elixir 1.11.0 (compiled with Erlang/OTP 23)

prod.exs

config :platform, PlatformWeb.Endpoint,
	http: [:inet6, port: System.get_env("PORT") || 4000],
	url: [scheme: "https", host: "platform-application.herokuapp.com", port: 443],
	force_ssl: [rewrite_on: [:x_forwarded_proto]],
	cache_static_manifest: "priv/static/cache_manifest.json",
	secret_key_base: Map.fetch!(System.get_env(), "SECRET_KEY_BASE")

# Database configuration
config :platform, Platform.Repo,
	adapter: Ecto.Adapters.Postgres,
	url: System.get_env("DATABASE_URL"),
	pool_size: String.to_integer(System.get_env("POOL_SIZE") || "10"),
	ssl: true

# Do not print debug messages in production
config :logger, level: :info

Incorrect file reference

In our_first_game.md at the beginning of the Importing Our Character section a reference is made a file named Game.elm. However, at this point in the book, we have not yet created a file named Game.elm. The file that should be referenced is Platformer.elm.

Production Game Records

In the Phoenix API chapter, we create a game record in the local dev environment, but there aren't any notes about how to do this in the production environment yet.

https://stackoverflow.com/a/40908326/64346

Missing Chapter References: outline.md

The file outline.md is missing references/summaries for the chapters phoenix_channel_setup.md and socket_authentication.md.

Sorry for the Noob question

Since I was using an older version of the book, I backed out of the project and started from scratch.
I had issues with Heroku the first time around and decided to skip since I Was not planning to put this on the web.
I tried the Heroku deployment again this time, and again running into issues. But is more basic.

I am just confused why node is going to my root user account to try to look for a JSON file. Should it not be working all in the confines of this "platform" project?

% npm run deploy
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /Users/bradhutchins/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/bradhutchins/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/bradhutchins/.npm/_logs/2020-10-18T18_24_03_196Z-debug.log

Log File
0 info it worked if it ends with ok
1 verbose cli [ '/Users/bradhutchins/.nvm/versions/node/v10.19.0/bin/node',
1 verbose cli '/Users/bradhutchins/.nvm/versions/node/v10.19.0/bin/npm',
1 verbose cli 'run',
1 verbose cli 'deploy' ]
2 info using [email protected]
3 info using [email protected]
4 verbose config Skipping project config: /Users/bradhutchins/.npmrc. (matches userconfig)
5 verbose stack Error: ENOENT: no such file or directory, open '/Users/bradhutchins/package.json'
6 verbose cwd /Users/bradhutchins/Documents/Elixir and Elm/platform
7 verbose Darwin 19.5.0
8 verbose argv "/Users/bradhutchins/.nvm/versions/node/v10.19.0/bin/node" "/Users/bradhutchins/.nvm/versions/node/v10.19.0/bin/npm" "run" "deploy"
9 verbose node v10.19.0
10 verbose npm v6.14.4
11 error code ENOENT
12 error syscall open
13 error path /Users/bradhutchins/package.json
14 error errno -2
15 error enoent ENOENT: no such file or directory, open '/Users/bradhutchins/package.json'
16 error enoent This is related to npm not being able to find a file.
17 verbose exit [ -2, true ]

Improper markdown formatting: handling_game_states.md

In the second paragraph of the Restarting section of handling_game_states.md an extra ` was placed causing most of the paragraph to be delineated as code.

Typo in displaying_game_data.md

At the end of the chapter when we're setting the timeRemaining in value in the initialModel to 10, which the instructions are clear about. However, the example code block following these instructions has the timeRemaining value set to 0.

Procfile bug in Heroku deployment chapter

In the Phoenix Testing and Deployment chapter, there's a Running Migrations section at the bottom.

The second line in the Procfile contains an error. It currently says mix phoenix.server and should say mix phx.server.

It is, however, correctly written in the Heroku Configuration section above that.

Push Fixes for Typos

• page 244 typo: "think think"
• page 282 typo: "we us that to assign"
• page 303 typo: "Note taht"

Ship New Release

New Release

Book

• Finish full rewrites to update content for Phoenix 1.4 and Elm 0.19 (see the revisions branch).
• Update the Elm API chapter with changes to Elm's simplified Http package (notes).
• Merge the revisions branch into the preview branch and check for issues.
• Merge the preview branch to master.
• Update the landing page on LeanPub.
• Ship new release to readers.
  • Announce fully updated release for Phoenix 1.4 and Elm 0.19.
  • Mention the sample app is updated and working.
  • Mention last three chapters on Phoenix channels.
  • Ask for feedback. Will push fixes and updates quickly.

Sample App

• Clear out the original sample application.
• Create a new sample app from scratch.
• Verify that all book content works up to the Phoenix Channel chapters.
• Deploy the new version of sample app to Heroku.
• Add game thumbnail image.

Next Up

• Finish rewrites for the last three chapters on Elm and Phoenix channels and fix channel issues.
• Finish chapters on persisting player scores and finishing touches.

Update content for upcoming Phoenix 1.4 and Elm 0.19 releases

Phoenix 1.4

Instructions available for test driving Phoenix 1.4 here:
https://elixirforum.com/t/when-is-phoenix-1-4-going-to-be-released/14768/3

The main thing is going to be replacing Brunch in favor of Webpack.

Elm 0.19

Elm's new single binary is also available and the compiler improvements look amazing.

Troubles with webpack

Seems like you need to add pathToElm: '../node_modules/.bin/elm' to module.rules[...].use.options to make it work. Since cwd is set to assets/elm. I had a lot of trouble setting this up and I still can't get the Elm js object into the global scope. Hope this can help someone in the future.

Socket Authentication chapter has a typo

Looks like it says "becuase" instead of "because" on page 290.

Missing link: handling_game_states.md

In the third paragraph of the Game Over State section of handling_game_states.md the text "...but the full code is posted here..." occurs but there is no actual link to the resource.