https://github.com/zackify/reactview
reactview lets you instantly view (and hot reload) any react component in your browser
https://github.com/zackify/reactview
Last synced: 12 months ago
JSON representation
reactview lets you instantly view (and hot reload) any react component in your browser
- Host: GitHub
- URL: https://github.com/zackify/reactview
- Owner: zackify
- Created: 2015-05-12T21:31:01.000Z (almost 11 years ago)
- Default Branch: master
- Last Pushed: 2015-08-09T23:38:03.000Z (over 10 years ago)
- Last Synced: 2025-02-27T08:54:50.699Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 407 KB
- Stars: 96
- Watchers: 7
- Forks: 9
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
Awesome Lists containing this project
README
##No longer maintained
**Go use [heatpack](https://github.com/insin/react-heatpack), it does the same thing.**
##ReactView
##Install
npm install -g reactview
###Usage
This is the perfect tool for prototyping React components.
Instead of setting up webpack to convert ES6 features or setup a server, it's as easy as:
reactview component.jsx
It'll automagically compile it using webpack and babel, then start a server and open your browser.
Optionally, you can specify the port as the second argument: `reactview component.jsx 8000`
It will also read json from stdin and pass them in as component props, eg:
cat props.json | reactview example.jsx
###Example
The example component looks like:
import React from 'react'
import Test from './test.css'
export default class Woah extends React.Component{
render(){
return
this is sick
}
}
No need to add React.render. CSS importing is also included.
**How do I set what gets rendered?**
You need to specify `export default` on the component you want rendered.
In 0.5.2, you can explicitly pass the component / class name you want
rendered: `reactview component.jsx ComponentName`.
Useful if you're importing components and there are multiple exports.
##Contributing
To modify reactview, take a look at src/reactview.js. After making changes you'll need to do
`npm run build` then `npm install . -g` if you're wanting to access it without doing `node bin/reactview.js`
###Todos
- passing props like `--props {test: 'value'}`
- allow .js files to be compiled (only .jsx is supported now)
- display error if component doesn't have a default export
- whatever you send in a pull request