Skip to content

Instantly share code, notes, and snippets.

@doncams
Created November 28, 2015 18:08
Show Gist options
  • Select an option

  • Save doncams/0160093bbb1cb30af9a4 to your computer and use it in GitHub Desktop.

Select an option

Save doncams/0160093bbb1cb30af9a4 to your computer and use it in GitHub Desktop.
Cannot render from server
import React from 'react';
import { IndexRoute, Route, Link } from 'react-router';
const App = React.createClass({
render() {
return (
<div>
<h1>App</h1>
<ul>
<li><Link to="/about">About</Link></li>
<li><Link to="/inbox">Inbox</Link></li>
</ul>
{this.props.children}
</div>
)
}
})
const About = React.createClass({
render() {
return <h3>About</h3>
}
})
const Inbox = React.createClass({
render() {
return (
<div>
<h2>Inbox</h2>
{this.props.children || "Welcome to your Inbox"}
</div>
)
}
})
const Message = React.createClass({
render() {
return <h3>Message {this.props.params.id}</h3>
}
})
const routes = (
<Route path="/" component={App}>
<Route path="about" component={About} />
<Route path="inbox" component={Inbox}>
<Route path="messages/:id" component={Message} />
</Route>
</Route>
);
export default routes;
import _ from 'lodash';
import path from 'path';
import express from 'express';
import {renderToString} from 'react-dom/server';
import {match, RoutingContext} from 'react-router';
import React from 'react';
import config from './configs/config.js';
import routes from './components/Routes.js';
// import app from './app.js';
let server = express();
server = require('./configs/express.js')(server);
if (process.env.NODE_ENV === 'development') {
server.use(express.static(path.resolve('./build/public')));
} else {
server.use(express.static(path.resolve('./dist/public')));
}
server.use((req, res, next) => {
// const routes = app.getComponent();
// console.log(renderToString(<Router routes={routes}></Router>));
match({routes: routes, location: req.url}, (error, redirectLocation, renderProps) => {
console.log(error, redirectLocation, renderProps);
console.log(renderToString(<RoutingContext {...renderProps}/>));
});
res.render('layout', {
appContainer: _.startCase(config.appName + ' container').replace(' ', '')
});
});
server.listen(config.port);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment