My Sublime 3 settings

{
    "auto_complete_commit_on_tab": true,
    "color_scheme": "Packages/Oceanic Next Color Scheme/Oceanic Next.tmTheme",
    "draw_white_space": "all",
    "font_face": "Fira Mono",
    "font_size": 20,
    "tab_size": 2,
    "theme": "Brogrammer.sublime-theme",
    "translate_tabs_to_spaces": true,
    "trim_automatic_white_space": true,
    "trim_trailing_white_space_on_save": true
}

I also use this package, https://github.com/babel/babel-sublime

React Native Course Snippets

In order to create a new snippet in Sublime select "Tools" -> "New Snippet". Paste in the snippets below and be sure the filename ends in ".sublime-snippet". For example, the name of my stateless functional component snippet is "react-functional.sublime-snippet".

React Native Functional Component (rnccf)

<snippet>
    <content><![CDATA[
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({

})

]]></content>
    <tabTrigger>rnccf</tabTrigger>
    <scope>source.js</scope>
    <description>React Native Stateless Functional Component Skeleton</description>
</snippet>

React Native Statefull Component (rnccs)

<snippet>
    <content><![CDATA[
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>}
    )
  }
}

]]></content>
    <tabTrigger>rnccs</tabTrigger>
    <scope>source.js</scope>
    <description>React Native Statefull Component Skeleton</description>
</snippet>

React Native Statefull Component (duck)

<snippet>
    <content><![CDATA[
const initialState = {}

export default function ${1:${TM_FILENAME/(.?\w*)(?:\.\w+)*$/$1/g}} (state = initialState, action) {
  switch (action.type) {
    default :
      return state
  }
}
]]></content>
    <tabTrigger>duck</tabTrigger>
    <scope>source.js</scope>
    <description>Redux Module skeleton</description>
</snippet>

Redux Course Snippets

In order to create a new snippet in Sublime select "Tools" -> "New Snippet". Paste in the snippets below and be sure the filename ends in ".sublime-snippet". For example, the name of my stateless functional compnent snippet is "react-functional.sublime-snippet".

RC

<snippet>
    <content><![CDATA[
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
)()
]]></content>
    <tabTrigger>rc</tabTrigger>
    <scope>source.js</scope>
    <description>Redux Connect Skeleton</description>
</snippet>

RCCS

<snippet>
    <content><![CDATA[
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}}
]]></content>
    <tabTrigger>rccs</tabTrigger>
    <scope>source.js</scope>
    <description>React Component - Statefull</description>
</snippet>

RCCF

<snippet>
    <content><![CDATA[
import React, { PropTypes } from 'react'
export default function ${1:${TM_FILENAME/(.?\w*)(?:\.\w+)*$/$1/g}} (props) {
  return (
    ${0:<div></div>}
  )
}
]]></content>
    <tabTrigger>rccf</tabTrigger>
    <scope>source.js</scope>
    <description>React Stateless Functional Component Skeleton</description>
</snippet>

If you're using Atom, check here.

How about Intellij, pls...

VS Code instructions

[1] Edit Settings: Preferences > User Settings (⌘+,)

{
    "editor.fontFamily": "Fira Mono",
    "editor.fontSize": 16,
    "editor.tabSize": 2,
    "editor.insertSpaces": true,
    "files.trimTrailingWhitespace": true
}

[2] Install Fira Mono font from here: https://www.fontsquirrel.com/fonts/fira-mono

[3] Install Oceanic-next Color Theme
Launch VS Code Quick Open (⌘+P), paste the following command, and press enter.
ext install Oceanic-Next

[4] Install Brogrammer Theme
Launch VS Code Quick Open (⌘+P), paste the following command, and press enter.
ext install Theme-Brogrammer

[5] Run Babel inside VS Code (see: https://code.visualstudio.com/docs/languages/javascript#_use-next-generation-javascript)

The Babel transpiler turns ES6 files into readable ES5 JavaScript with Source Maps. You can easily integrate Babel into your workflow by adding the configuration below to your tasks.json file (located under the workspace's .vscode folder). The isBuildCommand switch makes this task the Task: Run Build Task gesture. isWatching tells VS Code not to wait for this task to finish.

{
    "version": "0.1.0",
    "command": "${workspaceRoot}/node_modules/.bin/babel",
    "isShellCommand": true,
    "tasks": [
        {
            "args": ["src", "--out-dir", "lib", "-w", "--source-maps"],
            "taskName": "watch",
            "suppressTaskName": true,
            "isBuildCommand": true,
            "isWatching": true
        }
    ]
}

Once you have added this, you can start Babel with the ⇧⌘B (Run Build Task) command and it will compile all files from the src directory into the lib directory.

[6] Snippets
Preferences > User Snippets (javascript.json)

{
    "React Native Stateless Functional Component Skeleton": {
        "prefix": "rnccf",
        "body": "import React, { PropTypes } from 'react'\nimport { View, StyleSheet, Text } from 'react-native'\n\n${1:${FileName}}.propTypes = {\n\n}\n\nexport default function ${1:${FileName}} (props) {\n\treturn (\n\t\t<View>\n\t\t\t<Text>\n\t\t\t\t$1\n\t\t\t</Text>\n\t\t</View>\n\t)\n}\n\nconst styles = StyleSheet.create({\n\n})\n",
        "description": "React Native Stateless Functional Component Skeleton"

    },

    "React Native Statefull Component": {
        "prefix": "rnccs",
        "body":"import React, { PropTypes, Component } from 'react'\n\nimport { View, Text } from 'react-native'\n\nexport default class $1 extends Component {\n\tstatic propTypes = {}\n\tstate = {}\n\trender () {\n\t\treturn (\n\t\t\t<View>\n\t\t\t\t<Text>\n\t\t\t\t\t$2\n\t\t\t\t</Text>\n\t\t\t</View>\n\t\t)\n\t}\n\}",
        "description": "React Native Statefull Component"
    }

}

(These are the first two, which should give you an idea how to complete the rest)

Brackets.io snippets anyone?

Here's the equivalent snippets for Vim UltiSnips, minus setting names from current file name.

rnccf

snippet rnccf
import React, { PropTypes } from 'react'
import { View, StyleSheet, Text } from 'react-native'

$1.propTypes = {

}

export default function ${1:FunctionName} (props) {
	return (
		<View>
			<Text>
			 $1
			</Text>
		</View>
	)
}


const styles = StyleSheet.create({
	$0

})

endsnippet

rnccs

snippet rnccs
import React, { PropTypes, Component } from 'react'
import { View, Text } from 'react-native'

export default class ${1:ClassName} extends Component {
	static propTypes = {}
	state = {}
	render () {
		return (
			${0:<View>
				<Text>
					$1
				</Text>
			</View>}
		)
	}
}
endsnippet

duck

snippet duck
const initialState = {}

export default function ${1:FunctionName} (state = initialState, action) {
	switch (action.type) {
		default :
			return state
	}
}
endsnippet

Intellij please!

Thanks @igolden, I've expanded upon what you did and made them take the file basename by default.
You can see all of @tylermcginnis above code snippets for vim in the gist below

React Vim Snippets gist

Update:
The gist above contains the vimified version of Tylers snippets, but as I go through the course, I find myself making more snippets. if you're interested, take a look at my dotfiles/javascript.snippets. I'll leave the above gist as-is

@botmaster @JimmyLv and anyone else using Intellij, you can use Live Templates to achieve the same thing as Sublime's snippets.

Info here:
https://blog.jetbrains.com/webstorm/2018/01/using-and-creating-code-snippets

and all available variables (including filename and filename without extension) here:
https://www.jetbrains.com/help/idea/live-template-variables.html

As an example, you can set up a Live Template for a React Native Functional Component by going to Preferences > Editor > Live Templates and creating a new Template Group (I called mine React Native) and then a new Live Template in that group. The abbreviation is rnccf, description is whatever you want, and the "Template text" is as follows:

import { View, Text } from 'react-native'

$ComponentName$.propTypes = {

}

export default function $ComponentName$ (props) {
  return (
    <View>
      <Text>
        $ComponentName$
      </Text>
    </View>
  )
}

$ComponentName$ creates a variable, which you edit by clicking "Edit variables". Make the "Expression" for this variable fileNameWithoutExtension(), and then define the available contexts by clicking "Define" below the template text. It's a similar process for creating the other snippets.