?? ???? JavaScript? ?? ?????? ??? ?? ? ??? ??? ?????. 1) DOM ?? ? ??? ??? ??? TODO ?? ?? ????? ???? ??? ?? ??????? ?????. 2) Node.js? ?? ??? API? ???? ??? ?? ????? ???? ?? Express.

??

???? ????? ???? JavaScript? ??? ????? ???? ???? ??? ??, ???, ??? ? ???? ?? ???? ??? ?? ???? ?? ????? ??? ??????. JavaScript? ??? ???? ?? ?? ?????? ??? ??? ?? ??? ?? ????? ? ??? ???? ?? ???? JavaScript? ??? ???? ?? ??? ????? ??? ??? ??? ???? ??? ????? ? ??????. ????? ?? ? ?????,? ??? ?? ??? ? ?? ???? ??? ?? ????? JavaScript? ?? ? ? ????.

JavaScript ?? ?? ??

JavaScript? ?? ???? ??, ??, ??, ???, ?? ? ??? ??? ?? ?????. ???? JavaScript? ???? ???? ?????. ?????? ??? ?? ??? ????? ?? ?????. ??? JavaScript? DOM ??, ??? ?? ? ??? ?????? ?? ??? ?? ?? ? ???? ?? ?????? ?? ???? ??? ?????.

?? ?? ????? ?? ??? JavaScript? ??? ???? ?? ?????. JavaScript ?? ??? ????, Node.js ?? ?? JavaScript ??? ? ? ????. ??? ??? ???? ???? ??? ??? ??? ? ? ???? ? ??? ? ? ????.

JavaScript ?? ?? ??

??? ?? ?????

JavaScript? ?? ? ??? ??? ?? ???????, ?? ??? ?? ?? ? ??? ??? ?? ? ? ?? ?????. ??? ?? ?????? ???? ?? ??? (? : ??, ??? ?? ?? ?????)? ?? ???? ??? ? ? ?? ??? ??? ? ????.

 // ??? ?? ?? ?? .getElementById ( 'myButton'). addEventListener ( 'click', function () {
    ?? ( '?? ??!');
});

??? ?? ?????? ??? ?? ????? ???? ????? ???? ??? ?? ??? ? ???? ??? ? ? ??? ????. ??? ?? ?? ??? ???? ???? ?? ??? ??? ? ???? ?? ?? ??????? ??? ???? ????? ???????.

??? ?????

JavaScript? ???? ????? ??? I/O ?? ? ???? ??? ?? ? ? ? ?????. ?? ??, Promise ? Async/Await? ???? JavaScript? ??? ??? ?? ???? ?? ???? ???? ????.

 // ?? ??? ??? ??? ?? fetchData () {
    ??? ??? ????? ((??, ??) => {
        settimeout (() => {
            Resolve ( '???? ????? ??? ???');
        }, 1000);
    });
}

fetchData (). ?? ?? (data => console.log (data));

??? ?????? ??? ?? ????? ?? ?? ? ??? ??? ???? ? ??? ??? ????? ??? ??? ?? ?? ? ?? ?? ?????? ??????? ????.

??? ?

??? TODO ?? ?? ????? ??????

??? TODO ?? ?? ????? ?? ?? ?????? JavaScript? ??? ???????. ? ?? ???? ???? ??? ??, ?? ? ?? ? ? ????.

 // todo ?? ?? ???? const todolist = [];

?? addTodo (??) {
    todolist.push ({task, ?? : false});
    rendertodolist ();
}

?? ?? ?? (???) {
    todolist [index] .completed =! todolist [index] .completed;
    rendertodolist ();
}

?? removetodo (index) {
    todolist.splice (??, 1);
    rendertodolist ();
}

?? rendertodolist () {
    Const TodolistElement = Document.getElementById ( 'Todolist');
    todolistElement.innerhtml = '';
    todolist.foreach ((todo, index) => {
        const li = document.createelement ( 'li');
        li.innerhtml =`
            <input type = "checkbox"$ {todo.completed? &#39;checked&#39;: &#39;&#39;} onchange = "toggletodo ($ {index})">
            <span style = "text-decoration : $ {todo.completed? &#39;line-through&#39;: &#39;none&#39;}"> $ {todo.task} </span>
            <?? onclick = "removetodo ($ {index})"> delete </button>
        `;;
        TodolistElement. AppendChild (Li);
    });
}

document.getElementById ( &#39;addTodo&#39;). addEventListener ( &#39;click&#39;, function () {
    const task = document.getElementById ( &#39;todoinput&#39;). ?;
    if (??) {
        addTodo (??);
        document.getElementById ( &#39;todoinput&#39;). value = &#39;&#39;;
    }
});

? ??? JavaScript? ???? DOM? ???? ???? ???? ??? ??? ???? ??? ?????. ?? ??????? Redux ?? Vuex? ???? ??? ??? ?? ? ?? ?? ??? ??? ? ????.

??? ??? API? ??????

JavaScript? ??? ?? ???? ??? ??? ???? ??? ? ????. Node.js? ?? ??? ??? API? ???? Express? ???? ????? JavaScript? ?? ????? ???????.

 // Express? ???? RESTFUL API ??
const express = ?? ?? ( 'Express');
const app = express ();
const port = 3000;

app.use (Express.json ());

TODOS = [];

app.post ( '/todos', (req, res) => {
    const todo = req.body;
    todos.push (todo);
    res.status (201) .json (todo);
});

app.get ( '/todos', (req, res) => {
    res.json (todos);
});

app.put ( '/todos/: id', (req, res) => {
    const id = req.params.id;
    const todo = req.body;
    todos [id] = todo;
    res.json (todo);
});

app.delete ( '/todos/: id', (req, res) => {
    const id = req.params.id;
    const deletedtodo = todos.splice (id, 1);
    res.json (deletedtodo);
});

app.listen (??, () => {
    console.log (???? ???? ?? $ {port}`);
});

? ??? javaScript ? node.js? ???? ??? ??? API? ???? ??? ?????. ?? ??????? ??????? ???? ???? ???? ? ?? ?? ? ?? ?? ??? ?? ? ? ????.

?? ??? ? ?? ??

?? ??? ? ?? ??? ?? ?? ???? ?????. JavaScript ?? ??? ? ?? ?? ??? ??? ????.

• DOM ?? ?? : ??? DOM ??? ?? ??? ???? DOM ?? ?? ????? ?? ?? ?? ?? DOM? ???? ??? ? ? ????.
• ??? ??? ?? : ?? ??? ?? ??? ??? ???? ??? ??? ?? ??? ??? ???? ? ????.
• ??? ?? ??? : ?? ??? ??? ?? ?? ? ???/?? ??? ????? ???? ??? ???? ?? ???? ??????.
• ?? ?? ? ????? : ??? ?? ????? ?? ?? ??? ? ?????? ???? ?? ?? ??? ???? ??? ??? ???? ? ????.
• ?? ?? : ?? ????? ???? ?? ??? ???? ???? ??? ??? ??? ???? ? ????.

?? ??????? ?? ??? ?? ?? ??? ? ?? ??? ???? ????????. ???? ??? ??? ?? JavaScript? ?? ??? ? ? ????? ????? ?? ?? ??? ?? ????? ?? ? ? ????.

? ??? ?? ??? ? ? ?? ?? ?????? RESTFul API Constructions, ?? ??? ? ?? ??? ????? ?? ???? JavaScript? ?? ????? ?? ?????. ??? ?? ??? ????? JavaScript? ? ? ????? ?? ????? ???? ???? ? ?????? ????.

? ??? ?? ???? ?? : ?? ?? ? ????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!