react-codepen

0.1.0 • Public • Published

React <Codepen>

A react component to embed pens from codepen.io

Getting Started

  • Install with NPM - npm install --save react-codepen

Usage

var React   = require('react');
var Codepen = require('react-codepen');
 
var Component = React.createClass({
  render: function () {
    return (
      <Codepen user="jasonbellamy" hash="XmWNEY"></Codepen>
    );
  }
});

Options

Property Type Argument Values Default Description
user string <required> null codepen.io username.
hash string <required> null the hash id of the pen to display.
height string <optional> px, % 250px the height of the pen.
width string <optional> px, % 100% the width of the pen.
tab string <optional> css, html, js, result result the default tab that should be displayed.
theme string <optional> default the theme the pen should use.

Developing

react-codepen is built using ES6. Run the following task to compile the src/ into dist/.

npm run build

Contributing

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality.

License

Copyright (c) 2015 Jason Bellamy
Licensed under the MIT license.

/react-codepen/

    Package Sidebar

    Install

    npm i react-codepen

    Weekly Downloads

    5

    Version

    0.1.0

    License

    MIT

    Last publish

    Collaborators

    • jasonbellamy