title: Proper way of using WebSockets with React Native
body: <p>I'm new to React Native, but very familiar with React. As a beginner I'm looking to setup a connection between a cloud server and react-native with websockets as I've seen in the documentation. Unfortunately, there's no decent example out there that could help me out. This is all that I've got so far:</p>
  
  <pre class="lang-js prettyprint-override"><code>import React, { Component } from 'react';
  
  import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Button
  } from 'react-native';
  
  export default class raspberry extends Component {
    constructor(props) {
      super(props);
  
      this.state = { open: false };
      this.socket = new WebSocket('ws://127.0.0.1:3000');
      this.emit = this.emit.bind(this);
    }
  
    emit() {
      this.setState(prevState =&gt; ({ open: !prevState.open }))
      this.socket.send("It worked!")
    }
  
    render() {
  
      const LED = {
        backgroundColor: this.state.open ? 'lightgreen' : 'red',
        height: 30,
        position: 'absolute',
        flexDirection: 'row',
        bottom: 0,
        width: 100,
        height: 100,
        top: 120,
        borderRadius: 40,
        justifyContent: 'space-between'
  
      }
  
      return (
        &lt;View style={styles.container}&gt;
          &lt;Button
            onPress={this.emit}
            title={this.state.open ? "Turn off" : "Turn on"}
            color="#21ba45"
            accessibilityLabel="Learn more about this purple button"
          /&gt;
          &lt;View style={LED}&gt;&lt;/View&gt;
        &lt;/View&gt;
      );
    }
  
    componentDidMount() {
      this.socket.onopen = () =&gt; socket.send(JSON.stringify({ type: 'greet', payload: 'Hello Mr. Server!' }))
      this.socket.onmessage = ({ data }) =&gt; console.log(JSON.parse(data).payload)
    }
  
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#F5FCFF',
    },
    welcome: {
      fontSize: 20,
      textAlign: 'center',
      margin: 10,
    },
    instructions: {
      textAlign: 'center',
      color: '#333333',
      marginBottom: 5,
    },
  });
  
  AppRegistry.registerComponent('raspberry', () =&gt; raspberry);
  </code></pre>
  
  <p>Everything works fine, but when I press the button to send a message, this is the error I get:</p>
  
  <blockquote>
    <p>Cannot send a message. Unknown WebSocket id 1</p>
  </blockquote>
  
  <p>I also made a test with a js client and everything worked smooth..looking to see how I could get this fixed or some example sources where I can figure it out. </p>