JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.21.0/moment.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    </head>
    <body>
<div id="app_timesheet"></div>
    </body>
</html>

Babel + JSX

class Timesheet extends React.Component {
        constructor(props){
            super(props);
            this.state = { 
                values: ['']
                 };
            // this.handleSubmit = this.handleSubmit.bind(this);
        }

        perRow() {
            return this.state.values.map((el,i) => 
            
                    <tr key={i}>
                  
                        <td className="col-md-4">
                            <div className="form-group">
                                <input type="text" className="form-control" placeholder="Name" value={el||''} onChange={this.handleChange.bind(this, i)}/>
                            </div>
                            <div className="form-group">
                                <input type="text" className="form-control" placeholder="Hourly Rate" />
                            </div>                        
                            <p><strong>Total hours:</strong> 0:00</p>
                            <p><strong>Total pay:</strong> $0.00</p> 
                                <button className="btn btn-danger do-not-print" onClick={this.removeClick.bind(this, i)}>Remove employee</button>
                        </td>
                        <td>Monday</td>
                        <td><input type="text" className="form-control" /></td>
                        <td><input type="text" className="form-control" /></td>
                        <td><input type="text" className="form-control" /></td>
                        <td>0:00</td>
                        <td>$0.00</td>
                    </tr>
         
            )
        }

         handleChange(i, event) {
            let values = [...this.state.values];
            values[i] = event.target.value;
            this.setState({ values });
            console.log(this.state.values)
        }

        addClick(){
            this.setState(prevState => ({ values: [...prevState.values, '']}))
            console.log(this.state);
    ...