50: React Elm, Tipping Point - JSToElm
All Episodes

50: React Elm, Tipping Point

We avoid starting and do a bunch of other things to make us feel productive, like cleaning out our bash_profile, or making new Dockerfiles. Eventually we buckle down and get started on the last part of pulling React out of our project.

Convert all the Components

  • Things I did before I got started

    • updated Typora, my markdown writer
    • updated VSCODE
    • messed around with my Hyper Terminal Settings - side note, i now have tabbed terminal windows which was driving me nuts for the longest time. See so not always a total waste. lol
    • installed powerline fonts?
  • Login

  • Signup

  • Notes

    • bc it’s the biggest. I feel like if we get to the top of this hill, and quickly, it’s all downhill from here. Meaning the momentum should allow us to plow through login and signup

    • bring over needed Elm pieces to react container

    • create route ‘Note’ save

    • create case for Note on view based on route

    • AH DAMN IT now i need the note id from the url

    • url parser ? elm package install evancz/url-parser

    • route : Url.Parser (Route -> a) a

    • the type ‘a’ of ‘a’ throws me off. Url.Parser is a type that take an argument, a function that takes Route and return something, and the product of that function Url.Parser and Route -> a takes another of type a.

    • NOPE Url.Parser takes as an argument a function that itself takes a type Route and returns a type of ‘a’, with that function Ulr.Parser will return an ‘a’ ?

    • parse to the root of my app ?

      Module build failed: Error: Compiler process exited with error Compilation failed
      ==================================== ERRORS ====================================
      -- TYPE MISMATCH ------- /c/Users/jtomc/Documents/Elm/elm-notes/src/elm/Main.elm
      The definition of `routeParser` does not match its type annotation.
      79| routeParser : Url.Parser (Route -> a) a
      80| routeParser =
      81|>    oneOf
      82|>        [ map Home Url.top
      83|>        , map NewNote (s "notes" </> s "new")
      84|>        , map Note (s "notes" </> Url.int)
      85|>        ]
      The type annotation for `routeParser` says it is a:
        Parser (? -> a) a
      But the definition (shown above) is a:
        Decoder value
    • rad the example is exactly backwards of what I want to do url-parse example

  • App

    • almost forgot. it’s got redirect auth logic in it. ugh. man, what on earth have we been doing for the last 4 months!!!





Published 13 Sep 2018

A show about learning Elm, Functional Programing, and generally leveling up as a JS developer.
JavaScript To Elm on Twitter