import React, { Component } from 'react';
import ReactDOM from 'react-dom';

class Member extends Component {
  constructor() {
    super();
    this.state = { player: {} };
  }

  handleSubmit(e) {
    e.preventDefault();
    fetch('http://localhost:4000/player', {
        mode: 'no-cors',
        method: 'post',
        headers: {
            "Content-Type": "text/plain"
        },
        body: JSON.stringify({
          number: 123,
          name: "John",
          position: "Andrew"
        })
    }).then(function(response) {
      console.log(response);
    }).catch(function(error) {
      console.log('Request failed', error)
    });
  }

  render() {
    return (
      <div className="member-page">
        <form>
          <input type="submit" onClick={this.handleSubmit.bind(this)} />
        </form>
      </div>
    )
  }
}
export default Member;

var http = require('http');
var mysql = require('mysql');
var express = require('express');
var app = express();

var connection = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: "",
  database: "react_1"
});

app.post('/player', function(req, res, next) {

    res.header("Access-Control-Allow-Origin", "*");
      res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
      next();

  var player = req.body;
  var query = connection.query('INSERT INTO player VALUES ?', player, function(err, result) {
    // Neat!
  });
  res.end('Success');
});

app.listen(4000, function() {
  console.log('Example app listening on port 4000!');
});