JSFiddle - React, Tailwind, and code Playground

HTML

<div id="monitor"></div>

JavaScript

var serverEvents = (function () {
    "use strict";

    var controls = {},
        handlers = {
            open: function () {
                controls.monitor.innerHTML += 'Open <br>';
            },

            message: function (event) {
                controls.monitor.innerHTML += 'message: ' + event.data + '<br>';
            },

            error: function () {
                controls.monitor.innerHTML += 'error <br>';
            },

            getId: function (event) {
                controls.monitor.innerHTML += 'event getId: ' + event.data + '<br>';
            }
        };

    function getControls() {
        controls.eventSource = new EventSource('http://demo3.frondevo.com/server-events/php/server-events.php');
        controls.monitor = document.getElementById('monitor');
    }

    function addEvent() {
        var eventSource = controls.eventSource;
        eventSource.addEventListener('open', handlers.open, false);
        eventSource.addEventListener('message', handlers.message, false);
        eventSource.addEventListener('get_id', handlers.getId, false);
        eventSource.addEventListener('error', handlers.error, false);
    }

    function init() {
        getControls();
        addEvent();
    }

    return {
        init: function () {
            init();
        }
    };
}());

serverEvents.init();