v28
Addons
Guides
createOvermindSSR
The createOvermindSSR factory creates an instance of Overmind which can be used on the server with server side rendering. It allows you to change state and extract the mutations performed, which can then be rehydrated on the client.
server/routePosts.ts
1
import { createOvermindSSR } from 'overmind'
2
import { config } from '../client/overmind'
3
import db from './db'
4
5
export default async (req, res) => {
6
const overmind = createOvermindSSR(config)
7
8
overmind.state.currentPage = 'posts'
9
overmind.state.posts = await db.getPosts()
10
11
const html = renderToString(
12
// Whatever your view layer does to produce the HTML
13
)
14
15
res.send(`
16
<html>
17
<body>
18
<div id="app">${html}</div>
19
<script>
20
window.__OVERMIND_MUTATIONS = ${JSON.stringify(overmind.hydrate())}
21
</script>
22
<script src="/scripts/app.js"></script>
23
</body>
24
</html>
25
`)
26
}
Copied!
rehydrate
overmind/onInitialize.ts
1
import { OnInitialize, rehydrate } from 'overmind'
2
3
export const onInitialize: OnInitialize = ({ state }) => {
4
const mutations = window.__OVERMIND_MUTATIONS
5
6
rehydrate(state, mutations)
7
}
Copied!
Last modified 2yr ago
Copy link
Contents
rehydrate