react-native-snippets

A collection of React Native snippets for Sublime Text and Atom.

These snippets use ES6/7 syntax.

Install

Install by searching for react-native-snippets in Package Control

For Atom, search for react-native-snippets-horse in the Atom Package Manager.

Snippets

Snippet	Tab Trigger	Description
React Native Create Class	rncc	Scaffolds a full react-native component class.
React Native Create Stateless Function	rnstf	Scaffolds a stateless function.
this.setState()	tss
Create StyleSheet	css	Scaffolds a StyleSheet-only module.
StyleSheet.create()	ssc	Shortcut for creating a StyleSheet inline.
React.PropTypes.	rpt
export default	ed

Lifecycle Methods

Snippet	Tab Trigger
constructor()	constructor()
componentWillMount()	cwm
componentDidMount()	cdm
componentWillUnMount()	cwum
componentDidUnMount()	cdum
componentWillUpdate()	cwud
componentDidUpdate()	cdud
componentWillReceiveProps()	cwrp
shouldComponentUpdate()	scud
static propTypes = {}	propTypes
static defaultProps = {}	defaultProps
flex: 1	f1
alignItems: 'center'	ai
justifyContent: 'center'	jc

Components

Snippet	Tab Trigger
ActivityIndicatorIOS	rnActivityIndicatorIOS
DatePickerIOS	rnDatePickerIOS
Image	rnImage
ListView	rnListView
Navigator	rnNavigator
NavigatorIOS	rnNavigatorIOS
PickerIOS	rnPickerIOS
Text	rnText
TouchableHighlight	rnTouchableHighlight
View	rnView

Some snippets heavily inspired by sublime-react.

TODO

• Flow Type Checking Annotations

Contributing

1. Create your snippet.
2. Postfix your snippets with _react_native.
3. Generate the Atom snippet file (make install && make atom)
4. Add them to the README
5. Submit a Pull Request
6. ???
7. Profit!

Try to make your snippet tab triggers follow a syllable-based fuzzy-search style. For example for componentWillUpdate(), cwud is preferred over cwup.

LICENSE

MIT, see LICENSE