JSFiddle - React, Tailwind, and code Playground

JavaScript

window.onerror = function(msg) { $("html").css("background", "red"); $("body").prepend("<div style='color:white;'>" + msg + "</div>"); }
function write(msg) { $("body").html(msg); }
function append(msg, br) { $("body").append(msg + (br === false ? "" : "<br/>")); }

function sum(input) {
    var curSum = 0;
    for(var i = 0; i < input.length; i++) {
        curSum += input[i].out * input[i].weight;
    }
    return curSum;
}

function errorCalc(ideal, actual) {
    return actual - ideal;
}

function sigmoid(x) {
    var base = Math.E;
    var exponent = -1 * x;
    return 1/(1 + Math.pow(base, exponent));
}

function calcSigmoidDerivative(x) {
    return sigmoid(x)*(1-sigmoid(x));
}

function calcOutputDelta(e, dA) {
    return -1 * e * dA;
}

var input = [
    {
        out: .37,
        weight: -.22
    },
    {
        out: .74,
        weight: .58
    },
    {
        out: 1,
        weight: .78
    }
];
    
append("<h3>OUTPUT LAYER</h3>", false);
var activation = sigmoid;
var outputSum = sum(input);
var error = errorCalc(1, activation(outputSum));
var sigmoidDerivative = calcSigmoidDerivative(outputSum);
var outputDelta = calcOutputDelta(error, sigmoidDerivative);
var ideal = 1;
append("output input: " + outputSum);
append("sigmoid: " + sigmoid(outputSum));
append("error: " + error);
append("derivative: " + sigmoidDerivative);
append("outputDelta: " + outputDelta);

// GRADIENT CALCULATION FOR HIDDEN NEURONS
// not needed for bias because gradient only concernsr connection with input

append("<h3>HIDDEN LAYER</h3>", false);

var h = [
    {
        sum: -.53,
        outWeight: -.22,
    },
    {
        sum: 1.05,
        outWeight: .58,
    },
    {
        out: 1
    }
];

function calcHiddenDelta(sumOfInput, outputDelta, outputConnectionWeight) {
    return calcSigmoidDerivative(sumOfInput).toFixed(4) * (outputDelta * outputConnectionWeight);
}

var h1Delta = calcHiddenDelta(h[0].sum, outputDelta, h[0].outWeight);
var h2Delta =...