Feedback on my React markdown previewer?

Code Feedback
1

I finally finished my first React project and I’d like to get some feedback on its structure before moving on to styling and whatnot. I know a little about extracting components etc. but not enough to know if I should be doing that here or what specifically should be put where. Any guidance to make this a more ‘scalable’ app would be greatly appreciated. (I guess something like this doesn’t really need to be scalable, but practice makes perfect as they say)

const renderer = new marked.Renderer();
renderer.link = function (href, title, text) {
  return `<a target="_blank" href="${href}">${text}` + '</a>';
}

marked.setOptions({
  breaks: true,
});

class MarkdownApp extends React.Component {
  constructor(props) {
    super(props);

    const defaultContent =
      `# Marked - Markdown Parser
## How To Use The Demo
[This is a gitHub link](http://www.github.com)

\`\`\`
This is multi-line code
1
2
3
\`\`\`

This is \`inline code\`

> This is a Blockquote

* This is a list

![image](https://www.w3schools.com/w3css/img_lights.jpg)

__This is Bold__`

    this.state = {
      value: defaultContent
    };

    this.handleChange = this.handleChange.bind(this);
  }

  handleChange(event) {
    this.setState({ value: event.target.value });
  }

  render() {
    return (
      <div>
        <form>
          <label>
            Enter your markdown here:
          </label>
          <br />
          <textarea value={this.state.value} onChange={this.handleChange} id='editor' />
          <br />
        </form>
        <div>
          <label>
            Your markup will be previewed here:
          </label>
          <br />
          <span id='preview' dangerouslySetInnerHTML={{ __html: marked(this.state.value, { renderer: renderer }) }} />
        </div>
      </div>
    );
  }
}

ReactDOM.render(
  <MarkdownApp />,
  document.getElementById('root')
);