Skip to content
This repository has been archived by the owner on May 9, 2018. It is now read-only.

Commit

Permalink
Initial commit
Browse files Browse the repository at this point in the history
  • Loading branch information
process-bot committed May 8, 2015
0 parents commit 136b3d0
Show file tree
Hide file tree
Showing 5 changed files with 241 additions and 0 deletions.
1 change: 1 addition & 0 deletions .gitignore
@@ -0,0 +1 @@
elm-stuff
27 changes: 27 additions & 0 deletions LICENSE
@@ -0,0 +1,27 @@
Copyright (c) 2015, Evan Czaplicki
All rights reserved.

Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are met:

* Redistributions of source code must retain the above copyright notice, this
list of conditions and the following disclaimer.

* Redistributions in binary form must reproduce the above copyright notice,
this list of conditions and the following disclaimer in the documentation
and/or other materials provided with the distribution.

* Neither the name of the {organization} nor the names of its
contributors may be used to endorse or promote products derived from
this software without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
100 changes: 100 additions & 0 deletions README.md
@@ -0,0 +1,100 @@
# Start App

This package makes it super simple to create an HTML app and start it up.

It is designed to be used along with [the Elm Architecture][arch] which makes
modularity, testing, and reuse a breeze.

[arch]: https://github.com/evancz/elm-architecture-tutorial/

## Overview

The full API of this package is tiny, just a type alias and a function:


```elm
type alias App model action =
{ model : model
, view : Address action -> model -> Html
, update : action -> model -> model
}

start : App model action -> Signal Html
```

An app has three key components:

* `model` — a big chunk of data fully describing your application.

* `view` — a way to show your model on screen. It takes in two
arguments. One is the model, which contains *all* the information about our
app. The other is an [`Address`][address] that helps us handle user input.
Whenever there is a click or key press, we send a message to the address
describing what happened and where.

* `update` — a function to update your model. Whenever a UI event
occurs, is routed through the `Address` to this update function. We take
in the message and the current model, then we give back a new model!

[The Elm Architecture][arch] augments this basic pattern to give you all the
modularity you want. Since we have whole model in one place makes, it is also
really easy to support features like *save* and *undo* because everything in
Elm is immutable. This means features that would be a nightmare in typical JS
are pretty much free in Elm.

Testing this is also really pleasant. The `update` is entirely separate from
the `view` so we can just feed in a bunch of actions and see that the model
updates as we expect!

On top of *that*, everything is super fast thanks to [elm-html][].

Okay, so once you have your `App` you give it to `start` and it is running.
That's all there is to it.

[elm-html]: http://elm-lang.org/blog/Blazing-Fast-Html.elm
[address]: http://package.elm-lang.org/packages/elm-lang/core/2.0.1/Signal#Mailbox
[arch]: https://github.com/evancz/elm-architecture-tutorial/


## Example

The following chunk of code sets up a simple counter that you can increment
and decrement. You can paste the code into [Elm's online editor][edit] to see
it in action.

[edit]: http://elm-lang.org/try

```elm
import Html exposing (div, button, text)
import Html.Events exposing (onClick)
import StartApp


main =
StartApp.start { model = model, view = view, update = update }


model = 0


view address model =
div []
[ button [ onClick address Decrement ] [ text "-" ]
, div [] [ text (toString model) ]
, button [ onClick address Increment ] [ text "+" ]
]


type Action = Increment | Decrement


update action model =
case action of
Increment -> model + 1
Decrement -> model - 1
```

For more examples and guidelines for making apps in Elm, check out [this
tutorial][arch]. It goes through some simple examples and shows how the code
for this basic counter app can scale to huge applications that are easy to
test, maintain, and refactor.
17 changes: 17 additions & 0 deletions elm-package.json
@@ -0,0 +1,17 @@
{
"version": "1.0.0",
"summary": "start making HTML apps really easily",
"repository": "https://github.com/evancz/start-app.git",
"license": "BSD3",
"source-directories": [
"src"
],
"exposed-modules": [
"StartApp"
],
"dependencies": {
"elm-lang/core": "2.0.1 <= v < 3.0.0",
"evancz/elm-html": "3.0.0 <= v < 4.0.0"
},
"elm-version": "0.15.0 <= v < 0.16.0"
}
96 changes: 96 additions & 0 deletions src/StartApp.elm
@@ -0,0 +1,96 @@
module StartApp where
{-| This module makes it super simple to get started making a typical web-app.
It is designed to work perfectly with [the Elm Architecture][arch] which
describes a simple architecture pattern that makes testing and refactoring
shockingly pleasant. Definititely read [the tutorial][arch] to get started!
[arch]: https://github.com/evancz/elm-architecture-tutorial/
# Define your App
@docs App
# Run your App
@docs start
-}

import Html exposing (Html)
import Signal exposing (Address)


{-| An app has three key components:
* `model` &mdash; a big chunk of data fully describing your application.
* `view` &mdash; a way to show your model on screen. It takes in two
arguments. One is the model, which contains *all* the information about our
app. The other is an [`Address`][address] that helps us handle user input.
Whenever there is a click or key press, we send a message to the address
describing what happened and where.
* `update` &mdash; a function to update your model. Whenever a UI event
occurs, is routed through the `Address` to this update function. We take
in the message and the current model, then we give back a new model!
[The Elm Architecture][arch] augments this basic pattern to give you all the
modularity you want. But since we have whole model in one place makes, it is
also really easy to support features like *save* and *undo* that can be quite
hard in other languages.
[address]: http://package.elm-lang.org/packages/elm-lang/core/2.0.1/Signal#Mailbox
[arch]: https://github.com/evancz/elm-architecture-tutorial/
-}
type alias App model action =
{ model : model
, view : Address action -> model -> Html
, update : action -> model -> model
}


{-| This actually starts up your `App`. The following code sets up a counter
that can be incremented and decremented. You can read more about writing
programs like this [here](https://github.com/evancz/elm-architecture-tutorial/).
import Html exposing (div, button, text)
import Html.Events exposing (onClick)
import StartApp
main =
StartApp.start { model = model, view = view, update = update }
model = 0
view address model =
div []
[ button [ onClick address Decrement ] [ text "-" ]
, div [] [ text (toString model) ]
, button [ onClick address Increment ] [ text "+" ]
]
type Action = Increment | Decrement
update action model =
case action of
Increment -> model + 1
Decrement -> model - 1
Notice that the program cleanly breaks up into model, update, and view.
This means it is super easy to test your update logic independent of any
rendering.
-}
start : App model action -> Signal Html
start app =
let
actions =
Signal.mailbox Nothing

address =
Signal.forwardTo actions.address Just

model =
Signal.foldp
(\(Just action) model -> app.update action model)
app.model
actions.signal
in
Signal.map (app.view address) model

0 comments on commit 136b3d0

Please sign in to comment.