React Js

React Js is a front-end open source framework created by Facebook. It is used is to help create virtual DOM and better data flow.

Why React?

React is a open source that is written using components making you web-site structure clean. Everything including html is written inside a JSX file so all the html codes are generated dynamically making content change very simple.

State:

Instances of each component are stored internally when rendering, making them easy to reuse. When a state variable is updated or changed React will automatically re-render the UI. React does this by diffing the current and new code to see if there are any differences and only updating the new content making loading speed extremely fast.

Component Lifecycle:

Lifecycel Description Example
getInitialState Get the initial state of the variables before component is mounted getInitialState: function() {
return {
test1:{},
test2:0
};
}
componentWillMount Execute function right before component is mounted componentWillMount: function() {
{your code}
}
componentDidMount Executed after component is component is mounted. (View is already rendered similar to Jquery’s OnDocumentLoad)  componentDidMount: function() {
{your code}
}
Render Used to Render the View. The Html code is written inside the return. *(Some Html code are different from the traditional way. For example: class – className render: function() {
return (
{Html Code}
);
}
Mixin A component that has common functions or methods that other components can call from Including a Mixin


mixins: [{mixin_file}]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s