Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/JedWatson/react-md-editor
React.js Markdown Editor Component
https://github.com/JedWatson/react-md-editor
Last synced: 8 days ago
JSON representation
React.js Markdown Editor Component
- Host: GitHub
- URL: https://github.com/JedWatson/react-md-editor
- Owner: JedWatson
- License: mit
- Created: 2015-05-24T06:51:43.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2023-02-23T06:22:39.000Z (over 1 year ago)
- Last Synced: 2024-10-15T20:41:25.128Z (20 days ago)
- Language: JavaScript
- Size: 852 KB
- Stars: 508
- Watchers: 9
- Forks: 62
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-react-components-all - react-md-editor - React.js Markdown Editor Component. (Uncategorized / Uncategorized)
- awesome-react-components - react-md-editor - Markdown editor. (UI Components / Form Components)
- awesome-react - react-md-editor - Markdown editor. ![](https://img.shields.io/github/stars/JedWatson/react-md-editor.svg?style=social&label=Star) (UI Components / Form Components)
- awesome-list - react-md-editor - React.js Markdown Editor Component. (Demos / Form Components)
- awesome-react-components - react-md-editor - Markdown editor. (UI Components / Form Components)
- awesome-react-components - react-md-editor - React.js Markdown Editor Component. (UI Components / Form Components)
README
# React Markdown Editor
A Markdown Editor for [React.js](http://facebook.github.io/react), built with [CodeMirror](https://codemirror.net).
**This is a work in progress.** Format application and removal is not very robust, some formats are missing.
## Demo & Examples
Live demo: [JedWatson.github.io/react-md-editor](http://JedWatson.github.io/react-md-editor)
To build the examples locally, run:
```
npm install
npm start
```Then open [`localhost:8000`](http://localhost:8000) in a browser.
## Installation
The easiest way to use codemirror is to install it from NPM and include it in your own React build process (using [Browserify](http://browserify.org), [Webpack](http://webpack.github.io/), etc).
You can also use the standalone build by including `dist/codemirror.js` in your page. If you use this, make sure you have already included React, and it is available as a global variable.
```
npm install codemirror --save
```## Usage
```js
var React = require('react'),
Editor = require('react-md-editor');var App = React.createClass({
getInitialState: function() {
return {
code: "# Markdown"
};
},
updateCode: function(newCode) {
this.setState({
code: newCode
});
},
render: function() {
return
}
});React.render(, document.getElementById('app'));
```### Properties
* `value` `String` the markdown
* `options` `Object (newValue)` options passed to the CodeMirror instance
* `onChange` `Function (newValue)` called when a change is madeSee the [CodeMirror API Docs](https://codemirror.net/doc/manual.html#api) for the available options.
### License
MIT. Copyright (c) 2016 Jed Watson.