After reading around a bit, I found out how to go about this. Feel free to correct me.
React
has a different concept as to how to go about this.
Rather than pre-defining the html in the html file, we define it in the render
function, like so:
var FundComponent = React.createClass({
render : function() {
return (
<div>
<div className="myOtherStuff1">
<OtherComponent1 data={data} /> //other stuff
</div>
<div className="user"> //user
<UserComponent profile={profile} />
</div>
<div className="myOtherStuff2">
//can have component or other static stuff. Upto developer.
</div>
...
</div>
);
}
});
React.renderComponent(<FundComponent />, document.getElementById('fund'));
And the html will be:
<div id="fund"></div>
And then, we can define UserComponent
and OtherComponent(s)
as we go.