react-native-template-pro
A React Native template with a nice folder structure, navigation, database, async and debugging tools support.
:bookmark_tabs: Requirements
:arrow_forward: Installation
react-native init MyMillionDollarApp --template pro
cd MyMillionDollarApp
react-native run-ios
or react-native run-android
:package: What's included
:computer: Jetbrains Webstorm snippets
See how to create and use
- comp (stateful component)
import React, {Component} from 'react';
import PropTypes from 'prop-types';
import {View, Text, StyleSheet} from 'react-native';
export default class $ComponentName$ extends Component {
render() {
return (
<View>
<Text>$ComponentName$</Text>
$END$
</View>
);
}
}
$ComponentName$.propTypes = {};
const styles = StyleSheet.create({});
- rcomp (stateful redux component)
import React, {Component} from 'react';
import PropTypes from 'prop-types';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import * as $storeProp$Actions from '../actions/$storeProp$';
import {View, Text, StyleSheet} from 'react-native';
class $ComponentName$ extends Component {
render() {
return (
<View>
<Text>$ComponentName$</Text>
$END$
</View>
);
}
}
$ComponentName$.propTypes = {
//TODO: data
error: PropTypes.shape({
$storeProp$: PropTypes.bool
}),
loading: PropTypes.shape({
$storeProp$: PropTypes.bool
}),
};
const styles = StyleSheet.create({
});
const mapStateToProps = state => ({
data: {
$storeProp$: state.$storeProp$.data
},
error: {
$storeProp$: state.$storeProp$.error
},
loading: {
$storeProp$: state.$storeProp$.loading
},
});
const mapDispatchToProps = dispatch => {
return {
actions: {
$storeProp$: bindActionCreators($storeProp$Actions, dispatch),
}
};
};
export default connect(mapStateToProps, mapDispatchToProps)($ComponentName$);
- scomp (stateless component)
import React from 'react';
import PropTypes from 'prop-types';
import {
View,
Text
} from 'react-native';
const $ComponentName$ = () => (
<View>
<Text>$ComponentName$</Text>
$END$
</View>
);
$ComponentName$.propTypes = {};
export default $ComponentName$;
console.display('$var$', $var$);
console.tron('$var$');
:pushpin: Roadmap
:warning: Known issues
:pencil2: Contributing
This is an initial release, feel free to submit your issues or PR's!
:clipboard: License
MIT