Вау! Я с трудом могу поверить, что идет четвертая неделя моего курса погружения в код в TIY. Это означает, что у меня осталось всего 8 недель. До сих пор мой опыт был постоянным приливом и отливом. В один момент я получу это, буду следовать, создавать код и решать проблемы. В следующий раз я буду потерян, разочарован, взволнован и столкнусь с кодовым эквивалентом «блока писателя».

Прошлая неделя была для меня особенно сложной, так как мы начали наше знакомство с Javascript. Через пару недель после знакомства с HTML и CSS меня накрыла волна стресса, связанная с появлением javascript. В начале javascript был более абстрактным для понимания, но награды были большими. Javascript — это то, что делает эстетику HTML и CSS (то, что делает веб-страницу красивой) действительно полезной и функциональной (превращает эту страницу в приложение… в основном).

На прошлой неделе я смог сделать шаг назад и получить некоторую перспективу. Мне очень нравится работать с Javascript. Это невероятно полезно, но и разочаровывает. Мне нравится решать проблемы и настраивать логику, но иногда я слишком много обдумываю и делаю свой код слишком сложным. Отчасти это произошло из-за того, что все было таким новым и смешанным в моей памяти. Частично это происходит из-за того, что вы научились продумывать код.

Одна из моих больших побед на этой неделе и во всей моей практике Javascript (которой на данный момент всего две недели) — это фрагмент кода:

var inputInfo = $(‘#todo-input’)
var settings = {
 type: ‘GET’,
 dataType: ‘json’,
 url: ‘https://tiny-za-server.herokuapp.com/collections/joebum'
};
$.ajax(settings).then(function(data, status, xhr) {
 data.forEach(function(item, i, arr) {
 var url = ‘https://tiny-za-server.herokuapp.com/collections/joebum/' + item._id
 var todoList = $(“#todo-list”);
 var todoItem = $(‘<li class=”todo-item”>’ + item.todo + ‘<button class=”item-delete-btn” type=”button”>done</button></li>’);
 var deleteBtn = todoItem.find(‘.item-delete-btn’);
 deleteBtn.on(‘click’, function(e) {
 console.log(item._id, url);
 var deleteItem = {
 type: ‘DELETE’,
 url: url
 }
 $.ajax(deleteItem).then(function() {
 todoItem.remove();
 })
 })
 todoList.append(todoItem);
 })
})

Почему? По нескольким причинам, но прежде всего потому, что доступ к элементам, добавленным в DOM, осуществляется с помощью AJAX, что довольно сложно. Итак, я решил написать технический пост о том, как я это сделал.

Сообщение в блоге впереди…