JSFiddle - React, Tailwind, and code Playground

HTML

<table id="myTable">
        <tr>
            <p>
                <td width="20%">
                    <input class="input-group-lg" type="text" name="c_degree[]" value="NokoOPg4" style="width:90%" />
                </td>
                <td width="25%">
                    <input class="input-group-lg" type="text" name="c_specialization[]" value="mmgog" style="width:90%" />
                </td>
                <td width="30%">
                    <input class="input-group-lg" type="text" name="c_university[]" value="H4mf44k" style="width:90%" />
                </td>
                <td width="15%">
                    <input class="input-group-lg" type="number" name="c_year[]" min="1990" value="2" max="2015" />
                </td>
                <td width="10%">
                    <input class="input-group-lg" type="number" name="c_marks[]" min="1" value="8" max="100" />
                </td>
            </p>
        </tr>
    </table>

<textarea id="output"></textarea>

CSS

textarea{
    width: 100%;
    height: 800px;
}

JavaScript

function addrow(tableid) {
    var tablename = document.getElementById(tableid);
    var rows = tablename.rows.length;
    if (rows < 8) { //Maximum number of rows allowed
        var newrow = tablename.insertRow(rows);
        var col = tablename.rows[0].cells.length;
        for (var i = 0; i < col; i++) {
            var newcell = newrow.insertCell(i);
            newcell.innerHTML = tablename.rows[0].cells[i].innerHTML;
            newcell.getElementsByTagName('input')[0].value = randomVal(i > 2);
        }
    } else {
        // alert(" Maximum number of rows allowed is 8");
        clearInterval(t);
        document.getElementById('output').innerHTML = JSON.stringify(serialize("myTable"),null,4);
    }
}

// Fill the table
var t = setInterval(addrow, 10, "myTable");


function serialize(formID) {
    // New object you'll be building upon
    var obj = {},
        // Other variables we're going to use
        i,l,n,isArray,isNum,val;
    // Your form's inputs
    var inputs = document.getElementById(formID).getElementsByTagName('input');
    // For each of them
    for (i = 0, l = inputs.length; i < l; i++) {
        // Get their name
        n = inputs[i].getAttribute('name');
        // Is it an array?
        isArray = n.slice(-2) == '[]';
        // Is is of type "number"?
        isNum = inputs[i].getAttribute('type') == 'number';
        // What's the value?
        val = inputs[i].value;
        // If it's an array
        if (isArray) {
            // Get rid of the "[]"
            n = n.substring(0, n.length - 2);
            // If it's the first entry, create an empty array
            if (obj[n] === undefined) obj[n] = [];
            // Push the value in it (parsed as an integer if it's a number)
            obj[n].push(isNum ? +val : val);
            // If it's a single field, just assign it
        } else obj[n] = isNum ? +val : val;
    }
    // Return the object
    return obj;
}











// Just a function to fill in random...