Sending JSON to a server using fetch() in TypeScript

For a new project, I wanted to use TypeScript on the front end but not any of the frameworks that usually include it (React, Angular, etc.). Unfortunately, this means that when I have been trying to figure out how to do something in TypeScript, searches often lead me to solutions involving those frameworks.

I still haven’t found a good resource for creating a JSON object and sending it to a backend using TypeScript. The easiest solution would be to relax the TypeScript compiler and writing it the same way we would in JavaScript, but that defeats the point of using TypeScript. In looking at example code, I found that creating an interface to describe the JSON object is one accepted way to do it.

interface IJSON
{
    email:string;
    fullName: string; 
    shortName: string; 
    password: string; 
    institution: string; 
    isStudent: boolean;
}

const url = 'http://127.0.0.1:8000/register/';

function gatherData(e:Event)
{
    e.preventDefault();  //don't reload page so that we can test.

    let json:IJSON = 
    {
        email: (<HTMLInputElement>document.getElementById("email")).value,
        fullName: (<HTMLInputElement>document.getElementById("fullName")).value,
        shortName: (<HTMLInputElement>document.getElementById("shortName")).value,
        password: (<HTMLInputElement>document.getElementById("password")).value,
        institution: (<HTMLInputElement>document.getElementById("institution")).value,
        isStudent: true,
    }
    sendDataViaFetch(json);
}

function sendDataViaFetch(json:IJSON)
{    
    var request = new Request(url, {
        method: 'POST',
        body: JSON.stringify(json),
        headers: new Headers({
            'Content-Type': 'application/json',
            'Authorization': this.basic })
    });

    fetch(request)
    .then(function() {
        // Handle response we get from the API
    });
}

window.addEventListener('submit', gatherData);

If you have a better way, please let me know!