Skip to content

Instantly share code, notes, and snippets.

@designorant
Last active October 16, 2016 19:55
Show Gist options
  • Save designorant/21bba46480a782641b49077ba21ca664 to your computer and use it in GitHub Desktop.
Save designorant/21bba46480a782641b49077ba21ca664 to your computer and use it in GitHub Desktop.
Snippets used in "Redux + Immutable" and "React Native" courses by Tyler McGinnis in React.js Program
# Generated with Atomizr – https://atom.io/packages/atomizr
".source.js":
# Redux Course Snippets
"Redux Connect Skeleton":
prefix: "rc"
body: '''
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import { } from 'components'
function mapStateToProps (state, props) {
return {
}
}
function mapDispatchToProps (dispatch, props) {
return bindActionCreators( , dispatch)
}
export default connect(
mapStateToProps,
mapDispatchToProps
)()$1
'''
"React Component - Statefull":
prefix: "rccs"
body: '''
import React from 'react'
const ${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}} = React.createClass({
render () {
return (
${0:<div></div>}
)
},
})
export default ${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}}$2
'''
"React Stateless Functional Component Skeleton":
prefix: "rccf"
body: '''
import React, { PropTypes } from 'react'
export default function ${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}} (props) {
return (
${0:<div></div>}
)
}$2
'''
# React Native Course Snippets
"React Native Stateless Functional Component Skeleton":
prefix: "rnccf"
body: '''
import React, { PropTypes } from 'react'
import { View, StyleSheet, Text } from 'react-native'
${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}}.propTypes = {
}
export default function ${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}} (props) {
return (
${0:<View>
<Text>
${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}}
</Text>
</View>}
)
}
const styles = StyleSheet.create({
})$2
'''
"React Native Statefull Component Skeleton":
prefix: "rnccs"
body: '''
import React, { PropTypes, Component } from 'react'
import { View, Text } from 'react-native'
export default class ${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}} extends Component {
static propTypes = {}
state = {}
render () {
return (
${0:<View>
<Text>
${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}}
</Text>
</View>}
)
}
}$2
'''
"Redux Module skeleton":
prefix: "duck"
body: '''
const initialState = {}
export default function ${1:${TM_FILENAME/(.?\\w*)(?:\\.\\w+)*$/$1/g}} (state = initialState, action) {
switch (action.type) {
default :
return state
}
}$2
'''
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment