function attachEvents(){
    const kinveyAppId = "kid_BJXTsSi-e";
    const serviceUrl = "https://baas.kinvey.com/appdata/" + kinveyAppId;
    const kinveyUsername = "guest";
    const kinveyPassword = "guest";
    const base64auth = btoa(kinveyUsername + ":" + kinveyPassword);
    const authHeaders = { "Authorization": "Basic " + base64auth ,
        "Content-Type": "application/json"};

    $('#createBtn').on('click', createStudent)
    $("#loadBtn").on('click', loadStudents);

    let table = $('#results')

    function loadStudents() {
        let tr = table.find("tr:not(:first-child)")
        tr.remove()


        $.ajax({
            method: "GET",
            url: serviceUrl + "/students",
            headers: authHeaders,
            success: function (data) {
                data.sort(function (a, b) {
                    if (a.ID !== b.ID) {
                        return a.ID - b.ID
                    }
                });

                for (let student of data) {

                    $('#results').append($('<tr>')
                        .append($('<td>').text(student.ID))
                        .append($('<td>').text(student.FirstName))
                        .append($('<td>').text(student.LastName))
                        .append($('<td>').text(student.FacultyNumber))
                        .append($('<td>').text(student.Grade)))
                }
            },
            error: function (error) {
                console.dir(error)
            }
        })
    }


    function createStudent(){

        let id = Number($('#id').val())
        let firstName = $('#firstName').val()
        let lastName = $('#lastName').val()
        let facultyNumber = $('#facultyNumber').val() + ''
        let grade = Number($('#grade').val())

        if (id != '' && firstName != '' && lastName != '' && facultyNumber != '' && grade != '') {
            $.ajax({
                method: "POST",
                url: serviceUrl + "/students",
                headers: authHeaders,
                data: JSON.stringify({
                    ID: id,
                    FirstName: firstName,
                    LastName: lastName,
                    FacultyNumber: facultyNumber,
                    Grade: grade
                }),
                success: function(){
                    $('#id').val('')
                    $('#firstName').val('')
                    $('#lastName').val('')
                    $('#facultyNumber').val('')
                    $('#grade').val('')

                    loadStudents()
                }
            })
        }
        else {
            $('#id').val('')
            $('#firstName').val('')
            $('#lastName').val('')
            $('#facultyNumber').val('')
            $('#grade').val('')

            $('#fieldset').append($("<div>").text("Invalid input!"))
        }
    }
}