README.md

Description

Now that we have a good basis, let's add some big improvements to our program. First, sharing and showing the same piece of code over and over is not going to get you far. Let's improve our platform by implementing the feature that will allow us to upload a piece of code.

In this stage, your program must store one piece of code and display it both through the API and the web requests just like in the previous stage. This time, it should be possible to change this piece of code with a POST /api/code/new request.

Let's add another useful feature: showing the date when this particular piece of code was last updated. In other words, the API and web requests should include the date.

Before getting to work, take a look at the Java tutorial about formatting dates. In your code, you can use any pattern.

Objectives

In this stage, you need to implement the following endpoints.

• GET /api/code should return JSON with the following fields:

1. code that contains the same piece of code;
2. date that contains the date when this piece of code was loaded.

• GET /code should return HTML that contains:

1. Tags <pre id="code_snippet"> ... </pre> with the piece of code inside;
2. Title Code;
3. Date when this piece of code was loaded inside the tags <span id="load_date"> ... </span>.

The code snippet and the date in the API and the web requests should be the same.

• POST /api/code/new should take a JSON object with a single field code, use it as the current code snippet, and return an empty JSON. In the upcoming stages, it won't be empty.
  
• GET /code/new should return HTML that contains:

1. Tags <textarea id="code_snippet"> ... </textarea> where you can paste a code snippet;
2. Title Create;
3. Button <button id="send_snippet" type="submit" onclick="send()">Submit</button>.

Note: form doesn't send your data in the JSON format, so you need to specify a special function that does it. You can use the XMLHttpRequest to do that. Here's the function:

function send() {
    let object = {
        "code": document.getElementById("code_snippet").value
    };
    
    let json = JSON.stringify(object);
    
    let xhr = new XMLHttpRequest();
    xhr.open("POST", '/api/code/new', false)
    xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
    xhr.send(json);
    
    if (xhr.status == 200) {
      alert("Success!");
    }
}

Don't forget about id's in the tags: they are used to test your code.

Use CSS to customize your HTML as you like it. Customization won't be checked in tests.

Examples

Example 1

Request: GET /code
Response:

Example 2

Request: GET /api/code
Response:

{
    "code": "public static void ...",
    "date": "2020/01/01 12:00:03"
}

Example 3

Request: POST /api/code/new with the following body:

{
    "code": "class Code { ..."
}

Response: {}.

After that, GET /code should contain an updated snippet with an updated date:

Example 4

Request: GET /code/new
Response: