react.js 在客户端渲染 React 组件

Question

I am using node.js with react.js as my templating library. I am able to render my components on server side by using node's res.render(..), but I want to make my components dynamic by rendering them on client side using react.js and calling the onclick handlers. I have my components defined in .jsx format. How can I interact with the browser in client side and render my react components dynamically?

Answer 1

You will need to have your code transpiled and bundled, then you can insert it in a script tag just like any other script. One popular option is webpack; another is the use of Browserify with babelify in a gulp task.

Answer 2

You can start using it with ES6 class syntax using babel js. I have created a sample component here

You can also use react-starter-kit which gives you all the setup pre-loaded. A good place to start would be Facebook's react documentation