title: how to Connect React Native component with Node js Server? (React Native, NodeJS(without Express), MongoDB)
body: <p><strong>I'm creating a simple React Native app,</strong> using...(React Native as FrontEnd, Node js as Server(<strong>without Express Framework</strong>) Database in MongoDB Local), <strong>so I Created Backend for the app, Server.js and React Native component in CreateUser.js</strong></p>
  <p><strong>my problem is</strong>
  <strong>When I click submit button for store data that time I got an Error and it was TypeError(Network Request Failed), I tried to call API with different IP Addresses also,</strong></p>
  <p>so please help me to how can I connect React Native with NodeJS,</p>
  <p><strong>CreateUser.js (frontEnd)</strong></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React from 'react';
  import { StyleSheet, 
           Text,
           View,
           TextInput,
           TouchableOpacity
          
      } from 'react-native';
  
   class CreateUser extends React.Component {
  
    constructor(){
      super();
      this.state ={
        name:'',
        email:'',
        mobile:''
      }
    }
    updateValue(text, field){
  
      if(field == 'name'){
        this.setState({
          name:text,
        })
      }
      else if(field == 'email'){
        this.setState({
          email:text,
        })
      }
      else if(field == 'mobile'){
        this.setState({
          mobile:text
        })
      }
      console.log(text);
    }
  
    submit(){
      let collection = {}
        collection.name=this.state.name,
        collection.email=this.state.email,
        collection.mobile=this.state.mobile
        console.warn(collection);
      console.log("submit btn pressed and collection is", collection);
  
      // fetch code
      
          var url = 'http://localhost:3005/save';
          console.log("collections is that ===== ",collection)
          fetch('url', {
          method: 'post',
          headers:{
            'Content-Type': 'application/json',
            'Accept':'application/json'
            
          },
          body: JSON.stringify(collection),
          
          }).then(res =&gt; res.json())
          .catch(error =&gt; console.error('Error:', error))
          .then(res =&gt; console.log('Success',res))
  
    }
  
    render(){
      const {name, email, mobile} = this.state
      return (
          &lt;View style={styles.container}&gt; 
          &lt;Text style={styles.header}&gt;Insert User&lt;/Text&gt;
            &lt;TextInput 
              placeholder="Enter Name"
              style={styles.textinput}
              onChangeText={(text) =&gt; this.updateValue(text, 'name')}
              &gt;&lt;/TextInput&gt;
  
            &lt;TextInput 
              placeholder="Enter Email"
              style={styles.textinput}
              onChangeText={(text) =&gt; this.updateValue(text, 'email')}
              &gt;&lt;/TextInput&gt;
  
            &lt;TextInput 
              placeholder="Enter Mobile"
              style={styles.textinput}
              onChangeText={(text) =&gt; this.updateValue(text, 'mobile')}
              &gt;&lt;/TextInput&gt;
  
            &lt;TouchableOpacity
              style={styles.btn}
              onPress={() =&gt; this.submit()}  
            &gt;
              &lt;Text &gt;Submit&lt;/Text&gt;
            &lt;/TouchableOpacity&gt;  
  
          &lt;/View&gt;
  
      );
    }
    
  }
  
  const styles = StyleSheet.create({
    regform:{
        alignSelf:'stretch',
    },
    header:{
        fontSize:24,
        color:'#000',
        paddingBottom:10,
        marginBottom:20,
        borderBottomColor:'#199187',
        borderBottomWidth:1,
        
  
  
    },
    textinput:{
      alignItems:'stretch',
      height:40,
      marginVertical:10,
      marginHorizontal:10,
      marginBottom:20,
      color:'black',
      borderBottomColor:'gray',
      borderBottomWidth:2,
  
    },
    btn:{
      alignSelf:'stretch',
      alignItems:'center',
      backgroundColor:'#59cbbd',
      padding:20,
      marginTop:30,
  
  
    },
    btntext:{
      color:'#000',
      fontWeight:'bold',
    
    },
  });
  
  export default CreateUser;</code></pre>
  </div>
  </div>
  </p>
  <p><strong>server.js (backEnd)</strong></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>// http module Node server
  
  const { json } = require("body-parser");
  const http = require("http");
  
  const { parse } = require('querystring');
  
  const app = http.createServer((req,res) =&gt;{
     
      const url = require('url');
      const bodyParser = require('body-parser')
      const mongoose = require('mongoose');
      const User = require('./User');    
      var jsonParser = bodyParser.json();
      const path = req.url;
  
  console.log(req.url);
  if(req.url ==="/save" &amp;&amp; req.method == 'POST'  ){
      console.log("inside save API ") ;
  
      let body = '';
      req.on('data', chunk =&gt; {
          body += chunk.toString();
      });
      req.on('end', () =&gt; {
          console.log(
              parse(body)
          );
          res.end(body);
      });
  
      var MongoClient = require('mongodb').MongoClient;
      var urlm = "mongodb://localhost:27017/userdb";
  
      MongoClient.connect(urlm, function(err, db) {
          
          
      if (err) throw err;
  
      var dbo = db.db("userdb");
      var jsonObj = JSON.parse(body);        
      var myobj = {body};
      console.log("Post Data BODY is ",jsonObj);
      
      dbo.collection("users").insertOne(jsonObj, function(err, res) {  
      if (err) throw err;  
      console.log("1 record inserted");     
  
          db.close();
      });
      });
  }
  
  
  }).listen(3005,()=&gt;{
      console.log('server is running on 3005 port');
  });</code></pre>
  </div>
  </div>
  </p>