Dwayne Crooks dwayne

What is React Fiber? And how can I try it out today?

what?

React Fiber is an ongoing reimplementation of React's core algorithm. It is the culmination of over two years of research by the React team.

why?

Should be work with 0.18

Destructuring(or pattern matching) is a way used to extract data from a data structure(tuple, list, record) that mirros the construction. Compare to other languages, Elm support much less destructuring but let's see what it got !

Tuple

myTuple = ("A", "B", "C")
myNestedTuple = ("A", "B", "C", ("X", "Y", "Z"))

Using Mailboxes in Elm

Max Goldstein | July 30, 2015 | Elm 0.15.1

In Elm, signals always have a data source associated with them. Window.dimensions is exactly what you think it is, and you can't send your own events on it. You can derive your own signals from these primitives using map, filter, and merge, but the timing of events is beyond your control.

This becomes a problem when you try to add UI elements. We want to be able to add checkboxes and dropdown menus, and to receive the current state of these elements as a signal. So how do we do that?

The Bad Old Days

Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

	program = [ comment ], [ "port" ], "module", module_name, "exposing", "(", exposed_list, ")", { import_statement }, { declaration }, { comment };

	module_name = identifier, { ".", identifier }, [ comment ];
	exposed_list = identifier \| "(", identifier, { ",", identifier }, ")", [ comment ] \| "..";

	import_statement = "import", module_name, [ import_alias ], [ "exposing", "(", exposed_list, ")" ], [ comment ];
	import_alias = "as", identifier, [ comment ];

	declaration = type_declaration
	\| type_alias_declaration

	AppState (Main.elm delegates to one of these)
	LoggedIn
	Context.elm
	Init.elm
	Model.elm
	Msg.elm
	Subscriptions.elm
	Update.elm
	UrlUpdate.elm
	View.elm

	module YourAPIClient exposing (Config, otherFunctions)

	import Http
	import Json.Decode as Decode
	import Json.Encode as Encode


	-- Config

	module Editable exposing (..)


	type Editable ofType
	= NotEditing { value : ofType }
	\| Editing { originalValue : ofType, buffer : ofType }


	value : Editable ofType -> ofType
	value editable =

	-- a distilation of https://github.com/elm-lang/elm-plans/issues/7

	{- Mailbox is renamed Dispatcher, although this name is the part I'm least certain about.
	The address field is replaced with a dispatch field.
	It's minor, but I've found it helpful to put dispatch second, since the signal is easier to explain.
	-}
	type alias Dispatcher a =
	{ signal : Signal a
	, dispatch : a -> Message -- the big change
	}

	--------------------------
	-- CORE LIBRARY IMPORTS --
	--------------------------
	import Task exposing (Task, ThreadID, andThen, sequence, succeed, spawn)
	import Json.Decode exposing (Decoder, list, int, string, (:=), map, object2)
	import Signal exposing (Signal, Mailbox, mailbox, send)
	import List

	---------------------------------
	-- THIRD PARTY LIBRARY IMPORTS --