From 4c07e2ec5d9f2ede0243997a4c785101fc4203ea Mon Sep 17 00:00:00 2001 From: Tam Love Date: Thu, 15 Dec 2016 22:09:18 +0000 Subject: [PATCH] Issue #865 Add 'Getting Started' section to `README` (#872) * Update Readme.md Updated Readme.md to include a Getting Started section using information from the documentation. * Update Readme.md Adjusted some headings to be H3 to appear as sub-headings in the Getting Started section to provide better reading flow. --- README.md | 43 ++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 42 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 9ef37b31a5..0c2fe036c1 100644 --- a/README.md +++ b/README.md @@ -17,7 +17,48 @@ for scalable memory usage. [Learn how to use Draft.js in your own project.](https://facebook.github.io/draft-js/docs/overview.html) -## Examples +## Getting Started + +Currently Draft.js is distributed via npm. It depends on React and React DOM which must also be installed. + +``` +npm install --save draft-js react react-dom +``` + +### Using Draft.js + +``` +import React from 'react'; +import ReactDOM from 'react-dom'; +import {Editor, EditorState} from 'draft-js'; + +class MyEditor extends React.Component { + constructor(props) { + super(props); + this.state = {editorState: EditorState.createEmpty()}; + this.onChange = (editorState) => this.setState({editorState}); + } + render() { + return ( + + ); + } +} + +ReactDOM.render( + , + document.getElementById('container') +); +``` + +Because Draft.js supports unicode, you must have the following meta tag in the `` `` block of your HTML file: + +``` + +``` +Further examples of how Draft.js can be used are provided below. + +### Examples Visit https://facebook.github.io/draft-js/ to try out a simple rich editor example.