Merge pull request cerebral#53 from cerebral/docs2

docs(website): add get started guide and fix some styling

Author: christianalfoni

logo.png

@@ -4,8 +4,7 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "start": "parcel src/index.html --port 4000",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "start": "parcel src/index.html --port 4000"
   },
   "keywords": [],
   "author": "",

logo.psd

@@ -1,7 +1,7 @@
 # Action
 
 ```marksy
-<Example name="api_action" />
+<Example name="api/action" />
 ```
 
 An action allows you to compose pieces of logic into an execution. You typically execute an action based on some user interaction in your application, but it could be everything from a route change to a websocket message as well.
@@ -12,7 +12,7 @@ The action is built up by **operators**, methods called on the action itself. Th
 
 ## debounce
 ```marksy
-<Example name="api_action_debounce" />
+<Example name="api/action_debounce" />
 ```
 
 Typically used to only continue execution of the last action call if multiple action calls has been made in the time limit passed in.
@@ -21,7 +21,7 @@ The only argument is the time limit in milliseconds the operator should prevent
 
 ## do
 ```marksy
-<Example name="api_action_do" />
+<Example name="api/action_do" />
 ```
 
 Typically used to fire off an effect without caring about its returned result, if any.
@@ -30,7 +30,7 @@ Only argument is a function that receives the **effects** registered in the appl
 
 ## filter
 ```marksy
-<Example name="api_action_filter" />
+<Example name="api/action_filter" />
 ```
 
 Typically used to stop execution related to some condition.
@@ -39,7 +39,7 @@ The first argument is a function that receives the **effects** registered in the
 
 ## fork
 ```marksy
-<Example name="api_action_fork" />
+<Example name="api/action_fork" />
 ```
 Typically used to fork out execution when a value can result in multiple complex executions.
 
@@ -48,7 +48,7 @@ The first argument is a function that receives the **effects** as the first argu
 
 ## map
 ```marksy
-<Example name="api_action_map" />
+<Example name="api/action_map" />
 ```
 
 Typically used to get values from an effect or transform the current value of the action.
@@ -57,7 +57,7 @@ Only argument is a function that receives the **effects** registered in the appl
 
 ## mutation
 ```marksy
-<Example name="api_action_mutation" />
+<Example name="api/action_mutation" />
 ```
 
 Used to change the state of the application.
@@ -66,7 +66,7 @@ Only argument is a function that receives the **state** as the first argument an
 
 ## try
 ```marksy
-<Example name="api_action_try" />
+<Example name="api/action_try" />
 ```
 
 Typically used to explicitly handle potentially thrown errors from an effect.
@@ -75,7 +75,7 @@ The first argument is a function that receives the **effects** registered in the
 
 ## when
 ```marksy
-<Example name="api_action_when" />
+<Example name="api/action_when" />
 ```
 
 Typically used to fork execution based on a thruthy or falsy value.

packages/demos/posts/package.json

@@ -1,7 +1,7 @@
 # App
 
 ```marksy
-<Example name="api_app_initialize" view />
+<Example name="api/app_initialize" view />
 ```
 
 The **App** class is used to create the application instance. The instance itself exposes a **connect** function used to connect views to the state of the application and allow them to trigger actions.

packages/overmind-website/api/action.md

@@ -1,7 +1,7 @@
 # Compute
 
 ```marksy
-<Example name="api_compute" view/>
+<Example name="api/compute" view/>
 ```
 
 You can add computed state values. These state values are functions that takes one argument, `filterNameBy` in the example above. This argument can be whatever you want, but it can only be a single argument. That means if you want to pass in multiple values you would pass those as part of an object. The reason computed state values work like this is because this argument is the cache key. As long as you pass in the same argument and the accessed state is not changed, the cached value is instantly returned.

packages/overmind-website/api/app.md

@@ -1,7 +1,7 @@
 # Connect
 
 ```marksy
-<Example name="api_connect" view/>
+<Example name="api/connect" view/>
 ```
 
 When you instantiate an Overmind application it exposes the ability to connect components to the state and actions defined. This is simply done by using the **connect** function and pass in the component.

packages/overmind-website/api/compute.md

@@ -1,7 +1,7 @@
 # Derive
 
 ```marksy
-<Example name="api_derive" view />
+<Example name="api/derive" view />
 ```
 
 You can add derived state to your application. You access derived state like any other value, there is not need to call it as a function. The derived value is cached and will only update when any accessed state changes. 

packages/overmind-website/api/connect.md

@@ -1 +1,7 @@
-# Effects
+# Effects
+
+```marksy
+<Example name="api/effects" />
+```
+
+There is really no API with effects. You just expose existing libraries or create your own APIs for doing side effects. When these effects are attached to the application they will be tracked by the devtools giving you additional debugging information. By "injecting" the effects this way also opens up for easier testability of your logic.