Вау! Я с трудом могу поверить, что идет четвертая неделя моего курса погружения в код в 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, что довольно сложно. Итак, я решил написать технический пост о том, как я это сделал.
Сообщение в блоге впереди…