React - sample component

import React, { Component } from 'react';
import axios from 'axios';
import _ from 'lodash';

const ROOT_URL = 'http://localhost:3001/api/v1';

const FIELDS = {
    name: {
        type: 'input',
        name: 'nama',
        label: 'Name'
    },
    position: {
        type: 'input',
        name: 'jabatan',
        label: 'Position'
    },
    address: {
        type: 'textarea',
        name: 'alamat',
        label: 'Address'
    },
    phone: {
        type: 'input',
        name: 'telepon',
        label: 'Phone'
    }
}

class CreateStaff extends Component {
    constructor(props) {
        super(props);

        this.state = {
            fields: {
                nama: '',
                jabatan: '',
                alamat: '',
                telepon: ''
            }
        };

        this.handleSubmit = this.handleSubmit.bind(this);
        this.handleChange = this.handleChange.bind(this);
    }

    renderField(fieldConfig) {
        return(
          <div className="form-group" key={fieldConfig.name}>
            <label className="col-sm-2 control-label">{fieldConfig.label}</label>
            <div className="col-sm-10">
              <fieldConfig.type type="text" className="form-control" name={fieldConfig.name} onChange={this.handleChange}/>
            </div>
          </div>
        );
    }

    handleChange(e) {
        const state = this.state.fields;

        state[e.target.name] = e.target.value;
        this.setState(state);
    }

    handleSubmit(e) {
        e.preventDefault();

        // get form data out of state
        const { nama, jabatan, alamat, telepon } = this.state.fields;

        axios
            .post(`${ROOT_URL}/staff`, { nama, jabatan, alamat, telepon })
            .then((res) => {
                // do something here
            });
    }

    render() {
        // const { nama, jabatan, alamat, telepon } = this.state.fields;

        return(
            <div className="container" onSubmit={this.handleSubmit}>
                <form className="form-horizontal">
                    {/* === Generate fields === */}
                    {
                        _.map(FIELDS, this.renderField)
                    }
                  <div className="form-group">
                    <div className="col-sm-offset-2 col-sm-10">
                      <button type="submit" className="btn btn-success">Save</button>
                    </div>
                  </div>
                </form>
            </div>
        );
    }
}

export default CreateStaff;