App.js has a link to - I am not understanding if I need action creators/reducers? if so how to wire it up with server side rendering?
Basically on load of otherComponent - should make an API call from server.js by path and inject response back to the component - where does react actions fit in this picture?
server.js:
app.get('/test', (req, res) => {
res.send(<otherComponent />); -> this is returning json right now? How to handle this path for example here - where this should make an api call.
});
app.get('*', (req, res) => {
res.send(`
<!doctype html>
<html>
<head>
<title>My website</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div id='app'>${renderToString(
<Provider store={createStore(reducers)}>
<StaticRouter location={req.url} context={{}}>
<App />
</StaticRouter>
</Provider>
)}</div>
<script src='bundle.js'></script>
</body>
</html>
`);
});
In your React component, just fire the API calls you need
Typically with an SPA, you'd serve the full client app from the server on the first request, use client-side routing for your views and then fire any API requests (like the example).