Skip to content

Commit b342493

Browse files
committed
Merge remote-tracking branch 'origin/master'
# Conflicts: # comments.json
2 parents 8d5227c + 24a1050 commit b342493

File tree

4 files changed

+10
-7
lines changed

4 files changed

+10
-7
lines changed

README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
This repository shows how React can be used with the Express framework isomorphically; that is to use the same code on both the server and browser. This uses the comment box example from the [React tutorial](http://facebook.github.io/react/docs/tutorial.html) but in addition to rendering the comment box in the browser, it pre-renders it on the server, using the same code.
44

5-
There are also a few other additions. I've set up `webpack` so that it bundles up the code to be used in the browser. I also didn't particularly like the `JSX` template render methods being in the same file as the controller code (despite what React says, they are controllers; they behave exactly the same way as Angular's controllers). And lastly since I had to server-side rendering, I've had to use a view engine. I've chose `Swig` as unlike `Jade` it uses proper HTML and so means I have one fewer language to learn (which fits into the philosophy of isomorphism).
5+
There are also a few other additions. I've set up `webpack` so that it bundles up the code to be used in the browser. I also didn't particularly like the `JSX` template render methods being in the same file as the controller / component code (despite what React says, they are not just "views"; they behave very similar to Angular's controllers). And lastly since I had to server-side rendering, I've had to use a view engine. I've chose `Swig` as unlike `Jade` it uses proper HTML and so means I have one fewer language to learn (which fits into the philosophy of isomorphism).
66

77
Naturally this means all of the other server language implementations have been removed - Python, PHP etc.
88

@@ -30,4 +30,4 @@ And then start the server:
3030

3131
npm start
3232

33-
And visit <http://localhost:3000/>.
33+
And visit <http://localhost:3000/>.

components/browser.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
var components = require('./components');
22
var ReactDOM = require('react-dom');
3+
var window = require('window');
4+
var $ = require('jquery');
35

46
/**
57
* Load the comments via AJAX before rendering the comment box with the DOM.
68
* This will avoid the server rendered comments being replaced with nothing by JS.
79
* If the AJAX call fails, then just render no comments after logging the error.
810
*/
9-
window.renderCommentBox = () => {
11+
window.renderCommentBox = function renderCommentBox() {
1012
var url = "/api/comments";
1113

1214
$.get(url).then(

components/server.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ module.exports = {
99
* @param {Object} params
1010
* @returns {String}
1111
*/
12-
renderCommentBox: (params) => {
12+
renderCommentBox(params) {
1313
return ReactDOMServer.renderToString(React.createElement(components.CommentBox, params));
1414
}
15-
};
15+
};

webpack.config.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@ module.exports = {
1212
"react": "React",
1313
"marked": "marked",
1414
"jquery": "jQuery",
15-
"react-dom": "ReactDOM"
15+
"react-dom": "ReactDOM",
16+
"window": "window"
1617
},
1718
plugins: isDev ?
1819
[] :
@@ -30,4 +31,4 @@ module.exports = {
3031
}
3132
]
3233
}
33-
};
34+
};

0 commit comments

Comments
 (0)