Props

Props are read only. Whether a component is defined as a function or a class, it must never modify its own props. All react component must act like pure functions with respect to their props.

function TitleComponent(props) {
    return <h1>{props.title}</h1>;
}

State

State is similar to props, but its private and fully controlled by the component. State is local or encapsulated and its not accessible to any component other than the one that owns it. State is changeable. Do not modify state directly, Instead use setState() function. State updates may be asynchronous, to fix it, use second form of setState() that accepts a function rather than a object. React calls render method after state is changed to learn what should be on the screen.

class MyForm extends React.Component {
    constructor(props) {
        super(props);
        this.state = {name: "Hello World"};
    }

    render() {
        return (
            <form>
                <input type="text" 
                    value={this.state.name} 
                    onChange={this.handleOnChange.bind(this)}/>
            </form>
        )       
    }

    handleOnChange(e) {
        this.setState({
            name: e.target.value
        })
    }
}

References