react-atellier

    0.1.13 • Public • Published

    atellier

    Join the chat at https://gitter.im/scup/atellier

    Dependencies Status Build Status Code Climate npm version By Sprinklr Gitter

    A React component that works like a preview of other components. An excellent tool to show how your component works and looks with. Easy to install and configure, you can have a router in your project with Atellier and can interact with any component.

    Imagine a universe in which you may have tools (components) tested in real time! This is amazing!

    Online Demos

    Install

    npm install -g react-atellier

    Usage

    Import Atellier

    For releases: > v0.1.0 (NEWER)

    ...
    import ReactAtellier from 'react-atellier';

    For releases: <= v0.0.14

    ...
    var ReactAtellier = require('react-atellier')( React );
     

    Import your component

     
    import myComponent from 'myComponent';
     
    const componentList = [{
      componentName : myComponent.displayName,
      component : myComponent
    }];
     

    OR your component library

     
    import myComponents from 'myComponent';
     
    const componentList = myComponents.map( (comp)=> {
        return {
          componentName : comp.displayName,
          component : comp
        }
    })
     

    pass your components to Atellier over components prop.

    var AtellierWrapper = React.createClass({
      render: function() {
        return (
          <ReactAtellier components={componentList} />
        );
      }
    });

    and then you need to render the Atellier somewhere in your application.

    render((
      <Router history={browserHistory}>
        <Route path="/" component={App}>
          <Route path="atellier" component={AtellierWrapper}/>
        </Route>
      </Router>
    ), document.body)

    Todo

    • Atellier CLI (wip)
    • Import components and live update
    • Move components in stage

    Team

    Contributors

    Contribute

    Come with us to make an awesome Atellier tool to run components in live ambient.

    Now, if you do not have technical knowledge and also have intend to help us, do not feel shy, click here to open an issue and collaborate their ideas, the contribution may be a criticism or a compliment (why not?)

    We have some conventions to contribute to the Atellier project, see more information in our CONTRIBUTING.md. So please, read this before send to us a pull requests.

    Want help?

    License

    React Atellier is released under the MIT license.

    Install

    npm i react-atellier

    DownloadsWeekly Downloads

    11

    Version

    0.1.13

    License

    MIT

    Last publish

    Collaborators

    • hipolito
    • agutoli
    • dalssoft
    • albertossilva
    • scupteam