React
A Javascript library for building user interfaces
Just the UI
Many people use React as the V layer of the MVC architecture. Although React doesn’t assume the rest of your technology stack, it can be easily used in existing projects as a small feature
Virtual DOM
React uses the virtual DOM as its different implementation for higher performance. It can also be rendered by server-side Node.js – without requiring heavy browser DOM support
The data flow
React implements a one-way flow of responses, which reduces repetitive code, which is why it’s simpler than traditional data binding.
A simple component
The React component takes the input argument and returns the displayed object through a Render () method. The following example uses JSX, which is similar to the syntax of XML to store parameters in this.props after being passed to the component via render()
JSX is optional and not mandatory. Click “Compiled JS” to see the JavaScript code Compiled by JSX
A stateful component
In addition to accepting input data (via this.props), the component can also hold internal state data (via this.state). When a component’s state data changes, the displayed markup is recalled with the Render () update.
An application
By using props and state, we can combine to build a small Todo program. The following example uses state to monitor the items in the current list as well as the text the user has entered. Although event bindings appear to be inline, they are collected and implemented as event proxies.
A component that uses external plug-ins
React is flexible and provides methods that allow you to interact with other libraries and frameworks. The following example shows an example of using the external library Markdown to convert the value of a Textarea in real time.