Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

react-native-template-pro

1.3.11 • Public • Published

react-native-template-pro

Maintenance GitHub license

Usage demo

A React Native template with a nice folder structure, navigation, database, async and debugging tools support.

📑 Requirements


▶️ Installation


react-native init MyMillionDollarApp --template pro

cd MyMillionDollarApp

react-native run-ios or react-native run-android

📦 What's included


💻 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$;
  • con (console.display)
console.display('$var$', $var$);
  • tron (console.tron)
console.tron('$var$');

📌 Roadmap


  • Integrate mobile database
  • Fully integrate react-navigation to redux
  • [∞] Add more reusable components

⚠️ Known issues


✏️ Contributing


This is an initial release, feel free to submit your issues or PR's!

📋 License


MIT

Install

npm i react-native-template-pro

DownloadsWeekly Downloads

0

Version

1.3.11

License

MIT

Unpacked Size

4.03 MB

Total Files

61

Last publish

Collaborators

  • avatar