Johannes Erber j-hannes

💭

hello world

Frontend Engineer

j-hannes / index.html

Created May 21, 2016 20:34

Counter HTML

	<!doctype html>
	<html>
	<head>
	<title>a simple elm counter</title>
	</head>
	<body>
	<div id="counter"></div>

	<script src="counter.js"></script>
	<script>

j-hannes / Counter.elm

Last active May 21, 2016 21:21

Adding DOM events

	import Html.Events exposing (onClick)

	-- other code

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

j-hannes / Counter.elm

Last active May 21, 2016 20:47

Separate main and view

	import Html.App as Html


	main =
	Html.beginnerProgram { model = 0, view = view, update = update }


	view state =
	div []
	[ button [] [ text "-" ]

j-hannes / Counter.elm

Last active May 21, 2016 20:46

Action types

j-hannes / Main.diff

Last active May 21, 2016 18:22

Counter V0-V1

	module Main exposing (..)

	import Html exposing (button, div, span, text)
	+ import Html.App as Html


	main =
	+ view
	+
	+ view =

j-hannes / Counter.elm

Last active May 21, 2016 20:32

Counter v1

	module Counter exposing (..)

	import Html exposing (button, div, span, text)


	main =
	div []
	[ button [] [ text "-" ]
	, span [] [ text "0" ]
	, button [] [ text "+" ]

j-hannes / Counter.elm

Last active May 21, 2016 21:02

Final version (without types)

	module Counter exposing (..)

	import Html exposing (button, div, span, text)
	import Html.App as Html
	import Html.Events exposing (onClick)


	main =
	Html.beginnerProgram { model = 0, view = view, update = update }

j-hannes / .babelrc

Created May 16, 2016 20:50

for redux counter

j-hannes / webpack.config.js

Last active May 21, 2016 20:24

for redux counter

j-hannes / package.json

Created May 16, 2016 20:41

for redux counter

	{
	"name": "react-redux-counter",
	"version": "1.0.0",
	"description": "A simple counter in react+redux",
	"dependencies": {
	"react": "^15.0.2",
	"react-dom": "^15.0.2",
	"redux": "^3.5.2"
	},
	"devDependencies": {