martinjackson / DebugContent

DebugContent is simple [React] component to display an object's content as an HTML table.

DebugContent

DebugContent is simple React component to display an object's content as an HTML table.

{
  name: "Requested from React Front End",
  host: "localhost:3001",
  date: {d:18, m:1, y:2017},
  now: "1/18/2017, 2:23:02 PM"
}

turns into

name:	Requested from React Front End
host:	localhost:3001
date:	{"y":2017,"m":1,"d":18}
now:	1/18/2017, 2:23:02 PM

Docs & Help

• Tutorial – do this first!
• Guides and API docs
• Troubleshooting guide
• Changelog
• Stack Overflow
• CodePen boilerplate for bug reports

Older Versions:

none yet...

For questions and support, please visit Stack Overflow.

Browser Support

We support all browsers and environments where React runs.

Installation

Using npm:

    $ npm install --save DebugContent

or yarn:

    $ yarn add DebugContent

Then with a module bundler like webpack that supports either CommonJS or ES2015 modules, use as you would anything else:

// using an ES6 transpiler, like babel
import DebugContent from 'DebugContent'

render() {

   return (
     <div className="App">
       <p className="App-intro">
         To get started, edit <code>src/App.js</code> and save to reload.
       </p>
       <div style={{display: 'inline-table'}}>
           <hr />
           <DebugContent value={this.state} />
       </div>
     </div>
   );
 }

See more in the Introduction, Guides, and Examples.

Versioning and Stability

We want DebugContent to be a stable dependency that’s easy to keep current. We take the same approach to versioning as React.js itself: React Versioning Scheme.

Thanks

To Jim and Michael, fellow coders!