kawnayeen

render() {
    return (
        <View style={styles.container}>
            <Text>{this.props.leftText}</Text>
            <Text style={styles.textStyle}>{this.props.title}</Text>
            <Text>{this.props.rightText}</Text>
        </View>
    );
}

kawnayeen

import React from 'react';
import { View } from 'react-native';

const Card = (props) => (
    <View style={styles.containerStyle}>
        {props.children}
    </View>
);

const styles = {

kawnayeen

onEmailChange(text) {
    this.emailAddress = text;
}

<Input
    label="Email"
    placeholder="email@gmail.com"
    onChangeText={this.onEmailChange.bind(this)}
/>

kawnayeen

import React from 'react';
import { Text, TouchableOpacity } from 'react-native';

const Button = ({ onPress, children }) => {
    const { buttonStyle, textStyle } = styles;

    return (
        <TouchableOpacity onPress={onPress} style={buttonStyle}>
            <Text style={textStyle}>
                {children}

kawnayeen

renderLogin() {
     if(this.state.loginVisible){
         return (
             <Login
                 visible={this.state.loginVisible}
                 titleBarApi={this.setTitleBar.bind(this)}
                 goToMemberList={this.goToMemberList.bind(this)}
             />
         );
     }

kawnayeen

// constructor
constructor() {
    super();
    this.employees = [
        {'name': 'Himel'},
        {'name': 'Rana'},
        {'name': 'Shuvro'},
        {'name': 'Proshad'}
    ];
}

kawnayeen

class App extends Component {
    render() {
        return (
            <div>
                <SearchBar onSearchTermChange={term => this.onSearchTermChange(term)}/>
            </div>
        );
    }

    onSearchTermChange(term){

kawnayeen

// defining state
state = {
    videos: [],
    selectedVideo: null
};

// fetch video at startup
componentDidMount() {
    this.searchNewVideos('Caspian Report')
}

kawnayeen

// step one
const VideoList = (props) => {
    const videos = props.videos;
    return (
        <ul className="col-md-4 list-group">
            {videos.length}
        </ul>
    );
};

kawnayeen

// step one
const VideoListItem = ({video}) => {
    console.log(video);
    return (
        <li className="list-group-item">
            <div className="video-list media">
                <div className="media-left">
                    <img className="media-object" />
                </div>
                <div className="media-body">