docs(website): general doc fixes

Author: christianalfoni

packages/overmind-website/examples/guide/getstarted/devtools_concurrent.ts

@@ -0,0 +1,17 @@
+import { getPackageWithVersion } from '../../templates'
+
+export default () => [
+  {
+    fileName: 'package.json',
+    code: `
+{
+  "name": "my-app",
+  "scripts": {
+    "start": "concurrently \\"parcel index.html\\" \\"${getPackageWithVersion(
+      'overmind-devtools'
+    )}\\""
+  }
+}
+  `,
+  },
+]

packages/overmind-website/guides/beginner/01_getstarted.md

@@ -82,9 +82,17 @@ h(Example, { name: "guide/getstarted/devtools_explicit" })
 
 This allows you to control the version you want to use.
 
+You can even:
+
+```marksy
+h(Example, { name: "guide/getstarted/devtools_concurrent" })
+```
+
+By installing the [concurrently](https://www.npmjs.com/package/concurrently) package you can start your development process and the devtools at the same time.
+
 The Overmind devtools provides us with a pretty amazing experience. We get insights into all the state, changes to that state, actions run, which side effects are run and general stats. This visual overview becomes more and more valuable as complexity increases. 
 
-To connect to the devtools simply start the devtools application and refresh your app.
+To connect to the devtools simply start the devtools application and refresh your app. If you need to configure where it connects, please look at the [API section](/api/overmind).
 
 ## Summary
 

packages/overmind-website/guides/beginner/02_definingstate.md

@@ -24,7 +24,7 @@ h(Example, { name: "guide/definingstate/objects" })
 
 ### Arrays
 
-Arrays are in a way similar to objects in the sense that they hold other values, but instead of keys pointing to values you have indexes. That means it is ideal for iteration. But more often than not objects are actually better at managing lists of values. We can actually do fine without arrays in our state. It is when we produce the actual user interface that we usually want arrays. You can learn more about this in the [managing lists]() guide.
+Arrays are in a way similar to objects in the sense that they hold other values, but instead of keys pointing to values you have indexes. That means it is ideal for iteration. But more often than not objects are actually better at managing lists of values. We can actually do fine without arrays in our state. It is when we produce the actual user interface that we usually want arrays. You can learn more about this in the [managing lists](/guides/intermediate/01_managinglists) guide.
 
 ### Strings
 

packages/overmind-website/guides/intermediate/01_managinglists.md

@@ -1,6 +1,10 @@
 # Managing lists
 
-Why do we even have a guide to manage lists? Well, lists is a type of state that differs from other state. Both from the perspective of the state itself, but also transforming that state into UI. 
+Why do we even have a guide to manage lists? Well, lists is a type of state that differs from other state. Both from the perspective of the state itself, but also transforming that state into UI.
+
+```marksy
+h(Notice, null, "The discussion of lists is not specific to Overmind and there are no limitations on how you want to approach this. This guide is rather to help you think about how you structure entities (data with an id) to optimally access and render them.")
+```
 
 ## Defining the state
 When we want to render a list of something we want an **array**. This is the data structure we instinctively go to as it basically is a list. But arrays are rarely the way you want to store the actual data of the list. 

packages/overmind-website/guides/intermediate/05_writingtests.md

@@ -4,7 +4,7 @@ Testing is a broad subject and everybody has an opinion on it. We can only show
 
 ## Testing actions
 
-When testing an action you want to verify that changes to state are performed as expected. To give you the best possible testing experience Overmind has mocking tool called **createMock**. It takes your application configuration and allows you to run actions as if they were run from components.
+When testing an action you want to verify that changes to state are performed as expected. To give you the best possible testing experience Overmind has mocking tool called **createOvermindMock**. It takes your application configuration and allows you to run actions as if they were run from components.
 
 ```marksy
 h(Example, { name: "guide/writingtests/action.ts" })

packages/overmind-website/src/components/Guide/index.tsx

@@ -15,13 +15,16 @@ const Guide: SFC = () => {
   const { state } = useOvermind()
   const [content, setContent] = useState(null)
 
-  useEffect(() => {
-    import('../../../guides/' +
-      state.currentGuide.type +
-      '/' +
-      state.currentGuide.title +
-      '.md').then((module) => setContent(module))
-  }, [])
+  useEffect(
+    () => {
+      import('../../../guides/' +
+        state.currentGuide.type +
+        '/' +
+        state.currentGuide.title +
+        '.md').then((module) => setContent(module))
+    },
+    [state.currentGuide.type, state.currentGuide.title]
+  )
 
   if (!content) {
     return null