Isomorphic React, unable to render as string because I haven't got a valid react Element?

I'm having some serious troubles in getting react set up with rendering on the server side.. Here are my relevant files to the problem I'm having: https://bitbucket.org/snippets/imattacus/g9r6

I have been following tutorials online and I'm just doing what I see other people doing - but I'm under the impression I have made a react Component (class?) and I need to react.createElement() on the component i've made so it can be rendered.

But I don't understand how to do this because createElement requires a position in the DOM?

I'm only new to react, so I may have completely misunderstood something along the way - but can you guys see any problem in my code that would produce the 'invariant error' unable to use renderToString on invalid ReactElement?

Thanks!

I believe it's because your trying to render an entire html page, html tags included which I dont think (not 100% on this) is valid.

Here's a few snippets from code i use for react server rendering. (I'm using Koa) Server code

this.body = yield RENDER("index", { TEMPLATE: React.renderToString(<IndexView/>) });

Standard html page

<html>
<head>...</head>
    <body>
            <div id="app-root">{{ TEMPLATE|safe }}</div>
    </body>
    </html>

And this the client side javascript snippet

React.render(<IndexView/>, document.getElementById('app-root'));

In short, don't include the html / head tags in the JSX. Have a layout.html or sorthing of the sort and mount the React component on either the document.body or a element with a given id