title: Get all the image shots from dibbbler API
body: <p>I am trying to learn react-native, I just start working on this project two days ago. 
  I have kind of confusing in how to get the all the image shots from <a href="http://developer.dribbble.com/v1/shots/" rel="nofollow noreferrer">dibbbler API</a> and display it on my android emulator.</p>
  
  <p><a href="https://i.stack.imgur.com/EE4K5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EE4K5.png" alt="here is the error"></a></p>
  
  <p>This is what I have done,</p>
  
  <pre><code>'use strict';
   import React, {
   AppRegistry,
   Component,
   Image,
   ListView,
   StyleSheet,
   View,
   } from 'react-native';
  
  
   var API_URL = 'https://api.dribbble.com/v1/shots';
  
  
   class myproject extends Component {
    constructor(props) {
    super(props);
   this.state = {
   dataSource: new ListView.DataSource({
      rowHasChanged: (row1, row2) =&gt; row1 !== row2,
    }),
    loaded: false,
  };
  }
  
  
   componentDidMount() {
          this.fetchData();
        }
  
        fetchData() {
          fetch(API_URL)
            .then((response) =&gt; response.json())
            .then((responseData) =&gt; {
              this.setState({
                dataSource: this.state.dataSource.cloneWithRows(responseData.images.treaser),
                loaded: true,
              });
            })
            .done();
        }
  
        render() {
  
  
          return (
            &lt;ListView
              dataSource={this.state.dataSource}
              renderRow={this.rendershots}
              style={styles.listView}
            /&gt;
          );
        }
  
  
  
        rendershots(shots) {
          return (
            &lt;View style={styles.container}&gt;
              &lt;Image
                source={{uri: shots.images.treas}}
                style={styles.images.treas}
              /&gt;
  
            &lt;/View&gt;
          );
        }
      }
  
      const styles = StyleSheet.create({
        container: {
          flex: 1,
          flexDirection: 'row',
          justifyContent: 'center',
          alignItems: 'center',
          backgroundColor: '#F5FCFF',
        },
        rightContainer: {
          flex: 1,
        },
  
        treas: {
          width: 53,
          height: 81,
        },
        listView: {
          paddingTop: 20,
          backgroundColor: '#F5FCFF',
        },
      });
  
      AppRegistry.registerComponent('myproject', () =&gt; myproject);
  </code></pre>