Different ways to structure stateless React Components.

StatelessComponentStuctures.js

import React from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image
} from 'react-native';


const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
    },
})


const simpleVariable = "The Title is: "

const functionThatDoesSomething = () => {
    console.log("I'm _simpleFunction yo!")
}

const simpleArray = [
    "https://farm2.staticflickr.com/1581/25283151224_50f8da511e.jpg",
    "https://farm2.staticflickr.com/1653/25265109363_f204ea7b54.jpg",
    "https://farm2.staticflickr.com/1571/25911417225_a74c8041b0.jpg"
]

const functionThatRendersSomething = () => {
    const images = simpleArray.map((imageUrl, i) => (
        <Image
            key={i}
            style={{ width: 150, height: 150 }}
            source={{ uri: imageUrl }}
        />
    ))

    return images
}



/* ========================*/
class ContainerComponent extends React.Component {

    static propTypes = {
        titleProp: React.PropTypes.string
    }

    render() {
        let myTitle = simpleVariable + this.props.titleProp
        return (
            <View style={styles.container}>
                <Text onPress={functionThatDoesSomething}> {myTitle} </Text>
                {functionThatRendersSomething()}
            </View>
        )
    }
}


/* ========================*/
//With this method you get IDE intellisense for the props.  Seems like good benefit.
const StatelessFunctionalComponent = ({ titleProp = "Boring Title" }) => {
    let myTitle = simpleVariable + titleProp
    return (
        <View style={styles.container}>
            <Text onPress={functionThatDoesSomething}> {myTitle} </Text>
            {functionThatRendersSomething()}
        </View>
    )
}
StatelessFunctionalComponent.propTypes = {
    titleProp: React.PropTypes.string
}


/* ========================*/
const PresentationalComponent = ({titleProp}) => (
    <View style={styles.container}>
        <Text onPress={functionThatDoesSomething}> {titleProp} </Text>
        {functionThatRendersSomething()}
    </View>
)
PresentationalComponent.propTypes = {
    titleProp: React.PropTypes.string
}

export default PresentationalComponent