react-remarkable

A React component for rendering Markdown with remarkable.

npm install --save react-remarkable

Usage

varReact=require('react');varMarkdown=require('react-remarkable');varMyComponent=React.createClass({render(){return(<div>{/* Pass Markdown source to the `source` prop */}<Markdownsource="**Markdown is awesome!**"/>{/* Or pass it as children */}{/* You can nest React components, too */}<Markdown>{` ## Reasons React is great 1. Server-side rendering 2. This totally works: <SomeOtherAmazingComponent /> Pretty neat! `}</Markdown></div>);}});

Available props:

• options - Hash of Remarkable options
• source - Markdown source. You can also pass the source as children, which allows you to mix React components and Markdown.
• container - Element to use as container. Defaults to div.

Syntax Highlighting

Atom

You can enable syntax highlighting in Atom using the following steps:

Go to Settings > Packages > language-babel Settings > Enter this for JavaScript Tagged Literal Grammar Extensions:

"(?<=<Markdown>{)":source.gfm

Shortly you'll see that markdown syntax highlighting is enabled.

License

MIT