ryanwebjackson ryanwebjackson - 3 months ago 10
Javascript Question

What are the difference/similarities between React (app framework from Facebook) and react.js (reactive extensions for JS)?

I recently learned about Facebook/Instagram's app framework for JavaScript called "React" and wanted to look more into it. However, I found myself getting conflicting search results, as there is another library of a similar name. So, my question is this: Are there similarities between the two, or could someone do a better job at naming?

React

http://facebook.github.io/react/index.html

react.js

http://www.reactjs.com/

Answer

react.js is a language extension that lets you have automatic binding for values. The name React comes from the automatic updates of the values when one changes.

react( "soonChanged = undefined" );
react( "reactive = soonChanged + 5" );
react( "reactive2 = reactive * 10" );

react( "soonChanged = 10" );
// Changes the value of reactive from "undefined5" to 15
// and of reactive2 from NaN to 150

React on the other end is a framework to build user interfaces. The name React comes from the automatic update of the UI when some state changes.

/** @jsx React.DOM */

var converter = new Showdown.converter();

var MarkdownEditor = React.createClass({
  getInitialState: function() {
    return {value: 'Type some *markdown* here!'};
  },
  handleChange: function() {
    this.setState({value: this.refs.textarea.getDOMNode().value});
  },
  render: function() {
    return (
      <div className="MarkdownEditor">
        <h3>Input</h3>
        <textarea
          onChange={this.handleChange}
          ref="textarea"
          defaultValue={this.state.value} />
        <h3>Output</h3>
        <div
          className="content"
          dangerouslySetInnerHTML={{
            __html: converter.makeHtml(this.state.value)
          }}
        />
      </div>
    );
  }
});

React.renderComponent(<MarkdownEditor />, mountNode);
Comments