@chrismlee/reactcards

    0.4.4 • Public • Published

    React Cards

    Build Status

    React Cards is inspired by Bruce Hauman's excellent devcards project which aims to provide ClojureScript developers with a visual REPL-like experience especially suited for UI development.

    Getting Started

    npm install reactcards

    Add an entry file (f.e. entry.js)

    import {run} from 'reactcards';
    import './someCard';
    
    
    if (module.hot) {
        module.hot.accept()
    }
    
    // off we go...
    run();

    Add reactcards to your package.json

    "scripts": {
       // ...
        "reactcards": "reactcards -p 8080 -e ./entry.js",
       // ...
    }

    Available options for reactcards

    -p, --port <number> Port to run React Card
    -e, --entry <file> Entry point for React Cards
    -c, --conf <file> Custom Webpack config file
    

    Now you can simply run

    npm run reactcards

    React Cards will be available at http://localhost:8080

    Also see the create-react-app example project

    Example

    For quickly testing React Cards run the following command

    npm run example

    The example includes 2 namespaces and features a number of markdown, tests and component cards. With react cards you can run the tests you have written for a card independent of react cards, run the following command.

    npm run example:test

    Writing Cards

    Quick example. For a more detailed guide read the Writing Cards section.

    import React from 'react'
    import cards from 'reactcards'
    import {Foo, Bar} from './components'
    
    const demo = cards('demo')
    
    demo.card(
      `## markdown doc
      you can use markdown for card documentation
      - foo
      - bar`,
      <Foo message="hello"/>
    )
    
    demo.card(<Foo message="hello world"/>)
    
    demo.card(<Bar/>, {title: 'a bar card'})

    card

    Creating a Static Version of Your React Cards

    Coming soon.

    Documentation

    Examples

    License

    Copyright © 2016 Ali Sharif, Stefan Oestreicher and contributors.

    Distributed under the terms of the BSD-3-Clause license.

    Keywords

    none

    Install

    npm i @chrismlee/reactcards

    DownloadsWeekly Downloads

    48

    Version

    0.4.4

    License

    BSD-3-Clause

    Last publish

    Collaborators

    • chrismlee