Você provavelmente já ouviu falar de Elm e suas promessas incríveis, mas você não quer reescrever tudo do zero, nem deixar a comunidade React. E se você pudesse ter todos os benefícios de Elm, enquanto ainda usa seus componentes React, misturando JavaScript e uma linguagem mais simples e poderosa, com um excelente sistema de tipos? Venha conhecer então PureScript e a biblioteca Pux!
3. Interfaces de usuário
Gerenciamento de estado é difícil
Interfaces imperativas são pouco previsíveis
Mutabilidade torna difícil pensar sobre uma aplicação
4. Interfaces declarativas
Programação funcional é naturalmente declarativa
Provê um bom arcabouço para a criação de UIs declarativas
Natureza matemática
ui : ℕ → HTML
ui(x) = <span> x </span>
19. version :: String
version = "v1.0"
add :: Number -> Number -> Number
add a b = a + b
increment :: _
increment = add 1
incrementArray :: Array Number -> Number
incrementArray array = map (add 1) array
sum :: Array Number -> Number
sum = foldl (+) 0.0
increment :: Number -> Number
incrementArray array = map increment array
incrementArray array = map (_ + 1) array
sum array = foldl (+) 0.0 array
21. data Color = Red | Green | Blue | Black | White
data Point = Point Number Number
addPoints :: Point -> Point -> Point
addPoints (Point x1 y1) (Point x2 y2) = Point (x1 + x2) (y1 + y2)
nextColor :: Color -> Color
nextColor Red = Green
nextColor Green = Blue
nextColor Blue = Red
nextColor Black = White
22. data Color = Red | Green | Blue | Black | White
data Point = Point Number Number
addPoints :: Point -> Point -> Point
addPoints (Point x1 y1) (Point x2 y2) = Point (x1 + x2) (y1 + y2)
nextColor :: Color -> Color
nextColor Red = Green
nextColor Green = Blue
nextColor Blue = Red
nextColor Black = White
nextColor White = Black
A case expression could not be determined to cover all inputs.
The following additional cases are required to cover all inputs...
23. data Maybe a = Nothing | Just a
data Point a = Point a a
data Tuple a b = Tuple a b
data Either a b = Left a | Right b
-- data Result a b = Error a | Done b
24. fatorial :: Int -> Number
fatorial 0 = 1
fatorial 1 = 1
fatorial x = x * (fatorial (x - 1))
sum :: List Number -> Number
sum Nil = 0
sum (Cons x xs) = x + (sum xs)
getUser :: Email -> Maybe User
printUserName :: Email -> Eff (console :: CONSOLE) _
printUserName person =
case getUser email of
Nothing ->
log "Não foi encontrado usuário com este email"
Just user ->
log $ "Email: " <> email <> ", nome: " <> user.name
25. type User =
{ name :: String
, email :: String
}
newtype Email = Email String
type User =
{ name :: String
, email :: Email
}
parseEmail :: String -> Maybe Email
parseEmail emailStr =
if test emailRegex emailStr
then Just (Email emailStr)
else Nothing
data Maybe a = Nothing | Just a
26. data Permissions = BlockUser | BanUser | RemovePosts
data UserType = Guest | User | Admin
type User =
{ name :: Maybe String
, email :: Maybe Email
, permissions :: Array Permission
, userType :: UserType
}
27. data Permissions = BlockUser | BanUser | RemovePosts
data UserType = Guest | User | Admin
type User =
{ name :: Maybe String
, email :: Maybe Email
, permissions :: Array Permission
, userType :: UserType
}
28. data Permissions = BlockUser | BanUser | RemovePosts
data User
= Guest
| User
{ name :: String
, email :: Email
}
| Admin
{ name :: String
, email :: Email
, permissions :: Array Permission
}
29. showLoginStatus :: User -> String
showLoginStatus Guest = "Login here!"
showLoginStatus (User { name }) = "Welcome back, " <> name <> "!"
showLoginStatus (Admin { name }) = "All hail, " <> name <> "!"
37. data Die = D4 | D6 | D8 | D10 | D20
instance showDie :: Show Die where
show D4 = "D4"
show D6 = "D6"
show D8 = "D8"
show D10 = "D10"
show D20 = "D20"
dieNumber :: Die -> Int
dieNumber D4 = 4
dieNumber D6 = 6
dieNumber D8 = 8
dieNumber D10 = 10
dieNumber D20 = 20
38. data Action
= SelectDie Die
| Roll
| Result Int
data DiceState
= DieSelected Die
| Rolled { die :: Die, result :: Int }
type State = Maybe DiceState
init :: State
init = Nothing
39. update :: forall eff. Action -> State -> EffModel State Action (random :: RANDOM | eff)
update action state =
case action, state of
SelectDie die, _ ->
noEffects $ Just (DieSelected die)
Roll, Just s ->
{ state
, effects: [ do
result <- liftEff $ roll s
pure $ Result result
]
}
...
40. ...
Result result, Just (DieSelected die) ->
noEffects $ Just (Rolled { die, result })
Result result, Just (Rolled { die }) ->
noEffects $ Just (Rolled { die, result })
_, Nothing ->
noEffects state
where
roll = randomInt 1 <<< dieNumber <<< getDie
getDie (DieSelected die) = die
getDie (Rolled {die}) = die
41. view :: State -> Html Action
view state =
div
##
[ h1 [] [ text "D&D randomizer" ]
, renderState state
]
42. renderState :: State -> Html Action
renderState state =
case state of
Nothing ->
div
##
[ h2 [] [ text "Please, select a die" ]
, div
## map renderDie dice
]
Just (DieSelected die) ->
div
##
[ div
##
[ h2 [] [ text "Dice" ]
, div
## map renderDie dice
]
, h3 [] [ text $ "Die: " <> show die ]
, button [ onClick (const Roll) ] [ text "Roll" ]
]
...
43. ...
Just (Rolled {die, result}) ->
div
##
[ div
##
[ h2 [] [ text "Dice" ]
, div
## map renderDie dice
]
, h3 [] [ text $ "Die: " <> show die ]
, h3 [] [ text (show result) ]
, button [ onClick (const Roll) ] [ text "Roll" ]
]
where
dice = [D4, D6, D8, D10, D20]
renderDie die =
button [ onClick (const $ SelectDie die) ] [ text (show die) ]
47. Sistema de tipos poderoso
Excelente ferramental
FFI simples e fácil
Muitos backends (JS, C++, Erlang)
Gera JavaScript legível (sem runtime)
Comunidade aberta
Se compila, funciona (95% das vezes)
PURESCRIPT
O bom
52. PURESCRIPT
PureScript by Example
Phil Freeman
Haskell Programming (haskellbook.com)
Julie Moronuki & Christopher Allen
fpchat.com #purescript
Slack
Building a Graphical IDE in Elm/PureScript
Claudia Doppioslash