How to display Draft.js content as HTML – tuomo.me

How to display Draft.js content as HTML  #webdevelopment #webdev #ReactJS #react #javascript

  • At first however, it might not be so clear how to take the rich text representation that is created by Draft.js (=ContentState) and display it as HTML.
  • Draft.js itself doesn’t have an API to convert the content state to HTML.
  • One way to export your content state to HTML is to use npm package provides stateToHtml method which takes ContentState object as parameter and returns the content state as html.
  • Here is an example for a component that has Draft.js editor and as you type the editor’s content is displayed as html.
  • Getting HTML content of Draft.js editor is quite straight forward.

Continue reading “How to display Draft.js content as HTML – tuomo.me”

Code Splitting with React and React Router

Code Splitting with React and React Router  #reactjs #React #reactrouter

  • Code splitting has gained popularity recently for its ability to allow you to split your app into separate bundles your users can progressively load.
  • In this post we’ll take a look at not only what code splitting is and how to do it, but also how to implement it with React Router.
  • You already split your app into different routes, so adding in code splitting on top of that feels pretty natural.
  • Instead of thinking about code splitting as splitting your app up by its routes, you should think of it as splitting your app up by its components ( s are just components, after all).
  • You already know how to dynamically import modules with , now you just need to figure out which components in your app you can hold off downloading until your user needs them.

Code splitting has gained popularity recently for its ability to allow you to split your app into separate bundles your users can progressively load. In this post we’ll take a look at not only what code splitting is and how to do it, but also how to implement it with React Router.
Continue reading “Code Splitting with React and React Router”

Draft.js

Great talk on using and extending the excellent #reactjs Draft.js editor, at @BostonReactJS.

  • Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.
  • Draft.js makes it easy to build any type of rich text input, whether you’re just looking to support a few inline text styles or building a complex text editor for composing long-form articles.
  • In Draft.js, everything is customizable – we provide the building blocks so that you have full control over the user interface.
  • ‘s a simple example of a rich text editor built in Draft.js:
  • Rich Text Editor Framework for React

Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.
Continue reading “Draft.js”