React Class snippets with Meteor support

javascript.snippets

snippet reactClass "React Class Template"
import React from 'react';

export default class $1 extends React.Component {

	render(){
		return (
			<div>

			</div>
		);
	}

}

$1.propTypes = {
	//stringProp: React.PropTypes.string
};

$1.defaultProps = {
	//stringProp: 'defaultValue'
};
endsnippet

snippet reactFullClass "React Advanced Class Template"
import React from 'react';

export default class $1 extends React.Component {

	constructor() {
		super();

		//bind instance methods to instance here
		this.initialState = this.initialState.bind(this);
		this.state = this.initialState();
	}

	initialState(){
		return {

		};
	}

	//componentWillMount(){}

	//componentDidMount(){}

	//componentWillUnmount(){}

	//shouldComponentUpdate(nextProps, nextState){}
	
	//componentWillUpdate(nextProps, nextState){}

	//componentDidUpdate(prevProps, prevState){}

	//componentWillReceiveProps(nextProps){}

	render(){
		return (
			<div>

			</div>
		);
	}
}

$1.propTypes = {
	//stringProp: React.PropTypes.string
};

$1.defaultProps = {
	//stringProp: 'defaultValue'
};
endsnippet
	
snippet reactRouter "A standard React Router"
import React from 'react';
import { render } from 'react-dom'
import { Router, Route, IndexRoute } from 'react-router';
import { createHistory, useBasename } from 'history'

const history = useBasename(createHistory)({
	basename: '/'
})


import App from '$1';
import Index from '$2';
import AppNotFound from '$3';

var Routes = (
	<Route path="/" component={App}>
		<IndexRoute component={Index} />
		<Route path="*" component={AppNotFound}/>
	</Route>
)
endsnippet

snippet meteorReactRouter "A standard React Router for use with Meteor"
import React from 'react';
import { render } from 'react-dom'
import { Router, Route, IndexRoute } from 'react-router';
import { createHistory, useBasename } from 'history'

const history = useBasename(createHistory)({
	basename: '/'
})


import App from '$1';
import Index from '$2';
import AppNotFound from '$3';

var Routes = (
	<Route path="/" component={App}>
		<IndexRoute component={Index} />
		<Route path="*" component={AppNotFound}/>
	</Route>
)

Meteor.startup(function() {
	render(
		<Router history={history}>
			{Routes}
		</Router>
		, document.getElementById('app')
	);
});
endsnippet

snippet meteorReactClass "React Class Template for use with Meteor"
import React from 'react';
import ReactMixin from 'react-mixin';

export default class $1 extends React.Component {

	constructor() {
		super();

		//bind instance methods to instance here
		this.initialState = this.initialState.bind(this);
		this.state = this.initialState();
	}

    initialState(){
        return {

        };
    }

	getMeteorData(){
		return {

		};
	}

	render(){
		return (
			<div>

			</div>
		);
	}
}

$1.propTypes = {
	//stringProp: React.PropTypes.string
};

$1.defaultProps = {
	//stringProp: 'defaultValue'
};

ReactMixin($1.prototype, ReactMeteorData);
endsnippet

snippet meteorReactFullClass "Advanced React Class Template for use with Meteor"
import React from 'react';
import ReactMixin from 'react-mixin';

export default class $1 extends React.Component {

	constructor() {
		super();

		//bind instance methods to instance here
		this.initialState = this.initialState.bind(this);
		this.state = this.initialState();
	}

	getMeteorData(){
		return {

		};
	}


	initialState(){
		return {

		};
	}

	//componentWillMount(){}

	//componentDidMount(){}

	//componentWillUnmount(){}

	//shouldComponentUpdate(nextProps, nextState){}
	
	//componentWillUpdate(nextProps, nextState){}

	//componentDidUpdate(prevProps, prevState){}

	//componentWillReceiveProps(nextProps){}

	render(){
		return (
			<div>

			</div>
		);
	}
}

$1.propTypes = {
	//stringProp: React.PropTypes.string
};

$1.defaultProps = {
	//stringProp: 'defaultValue'
};

ReactMixin($1.prototype, ReactMeteorData);
endsnippet