Прохожу курсы от GeekBrains и надо сказать вы поясняет просто великолепно, там так не разжевывают и как то все быстро и не понятно, приходится заходить к вам на канал.
Теперь после этого задумался сделать крутую корзину на ajax с занесением в глобальный массив Cart[ ], как раз по практикую ООП, я конечно на нем до этого никогда не писал но начинать то надо когда то))
Скажите , а как потом эту корзину добавить на другую страницу? ( в свой магазин) Страница сделана на конструкторе гугл сайтов. Куда потом этот код (корзина) вписывать???
Спасибо Александр за работу!!! Когда нибудь покажите, как сделать счетчик в корзине, при добавлении товара, чтобы в шапке меню рядом с иконкой корзины появлялось количество.
Очень доступное объяснение, спасибо. А как правильно сделать если я хочу ещё считать не только количество а ещё и сумму товаров в корзине? Понятно, что в объект добавить поле price, а вот с самой функцией которая сумму посчитает не совсем понятно???
Мое почтение! Александр, а вы занимаетесь платной разработкой? Мне необходимо в PWA для интернет-магазина реализовать правильную политику кеширования (статика добавляется при просмотре странички пользователем на длительный срок, цены и наличие каждый день)по этому менять для контента версию кеша когда остатки меняются и корзину офлайн(реализация подразумевает что без подключения к интернету покупателю удастся оформить заказ в PWA, а как только интернет появится сервис воркер отправит его на сервер) на данный момент в любой непонятной ситуации будет заглушка с просьбой подключить интернет.
Добрый день мне нужно создать такую корзину только для чат-бота telegram с использованием конструктора с возможность встраивание действие code на js, только базу данных я беру с google sheets Вопрос этот код можно применить?
У вас баг на сайте: там, где раздел курсы по этой itgid.info/ ссылке, находится 4 курса, и , если навести мышкой после четвертого курса, то выделяться будут сначала первый курс(NodeJs) , а потом второй(если провести дальше)(React.lite Level).Ну или у меня баг)
Для новичков и понимания хорошо, но использовать в реальном проекте нельзя. Требуется совсем другой подход и в итоге у вас очень много похожего кода, которой делает примерно тоже самое. И если скорость интернета позволяет подгружать скрипт хоть в 20мб, то ресурсы ограничены. Если обучать, так правильно, в любом случаи это лучше, чем можно встретить в "профессиональных" проектах.
@@DIMANVAZ04 как говорится, самое страшное, кода твой сервис ложится под нагрузкой и клиенты сваливают на другой ресурс. Поэтому и изгаляются разрабы как только можно, чтобы подобного не допустить. Как говорил Цукерберг в "Социальная сеть" : "Фишка фэйсбук в том, что он работает всегда без единого падения"
Здравствуйте, спасибо большое за урок! У меня два вопроса: 1. В функции уменьшения кол-ва товара зачем возвращать true? 2. В функции удаления, я вот прочитал, что если использовать delete, удаляется объект, но не элемент массива. То есть общее количество элементов в массиве остается таким же. Если же использовать splice, то количество элементов в массиве уменьшается и объект со следующим индексом заменяет удаляемый. Это в данном случае имеет какую-то роль? Это когда важно?
Здравствуйте, делал корзину по вашему старому уроку, не подскажите пожалуйста, когда жму минус, вычитываю количество товара в корзине, то если значение доходит до 0, после оно идёт в минус, подскажите пожалуйста, как это можно исправить?Чтобы при значении ниже 1, либо удалялся товар из корзины, либо перекидывало на главную страницу сайта.Буду очень благодарен если ответите! =) ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- var cart = {}; function loadCart() { //Проверка есть ли в localStorage запись cart if (localStorage.getItem('cart')) { //если есть - расшифровываю и записываю в переменную cart cart = JSON.parse(localStorage.getItem('cart')); console.log(isEmpty(cart)); showCart(); } else { $('.main-cart').html('Корзина пуста!'); } } function showCart() { if (!isEmpty(cart)) { $('.main-cart').html('Корзина пуста!') } else { $.getJSON('goods.json', function (data) { var goods = data; var out = ''; for (var id in cart) { out += `x`; out += ``; out += ` ${goods[id].name }`; out += ` -` ; out += `${cart[id] }`; out += ` +` ; out += cart[id]*goods[id].cost; out += ''; } $('.main-cart').html(out); $('.del-goods').on('click', delGoods); $('.plus-goods').on('click', plusGoods); $('.minus-goods').on('click', minusGoods); }); } } function delGoods() { //Удаляем товар из корзины var id = $(this).attr('data-id'); delete cart[id]; saveCart(); showCart(); } function plusGoods() { //Добавляем товар в корзину var id = $(this).attr('data-id'); cart[id]++; saveCart(); showCart(); } function minusGoods() { //Уменьшаем товар в корзине var id = $(this).attr('data-id'); if (cart[id==1]) { delete cart[id]; } else { cart[id]--; } cart[id]--; saveCart(); showCart(); } function saveCart() { //Сохраняю корзину в localStorage localStorage.setItem('cart', JSON.stringify(cart));//Корзину в строку } function isEmpty(object) { //Проверка корзины на пустоту for (var key in object) if (object.hasOwnProperty(key)) return true; return false; } $(document).ready(function () { loadCart(); });
@@itgid Учу фронт около года и в принципе с типичными задачами все более менее понятно, даже в связке с React и Redux, но вот есть ощущение что я пол программиста, потому что не знаю бекенд и очень хочется писать фулстек приложения, посоветуйте что перспективнее и вообще лучше для бекенда? Node.js, PHP или Python jungo ? Понятно что все хостинги умеют работать c PHP без костылей, но все же? Что лучше учить? А может полезнее и лучше вообще не распыляться и практиковаться дальше во фронте? В общем нужен совет опытного человека =)
Александр, скажите можно ли обойти работу на галере, будучи джуном? Понятно что кто то через знакомых может находить клиентов. Слышал реальную историю. Сейлз (или менеджер) заработав себе нормальный уровень на апворке через компанию, на которой работал. Спустя два года ушел из компании, а вместе с ним и программист, который с ним работал. И они сейчас сами себе компания. Ну это еденичные случае. Какой прогноз вы могли бы сделать для джуна, есть ли у него перспективы без галеры?
Подскажите как перерисовать товары в корзине никак не получается. Вывожу модальным окном. Так добавляю в корзину for(let key in cart){ if (cart[key].count !== 0 ){ addCardHtmlMarkup = `
${cart[key].name} ${cart[key].price}
- ${cart[key].count} + ×
`; modalBody.insertAdjacentHTML("beforeEnd", addCardHtmlMarkup); } } При нажатии закрыть удаляю все дочерние элементы, но при повторном нажатии просмотра корзины, она пустая, и товары не добавляются при добавлении if (modalBody.childNodes.length !== 0){ modalBody.parentNode.removeChild(modalBody); } А если не удалять вторым скриптом появляются дубли товаров, почему при удалении перестает все работать
На 6:42 "Теперь меня не остановить" - смеялся долго!
Александр, чувство юмора - это очень хороший показатель человечности!
Благодарю за ваш труд!
Автор большой тебе РЕСПЕКТ! Так объяснить материал, это большое умение!
Хорошее видео, за один урок узнал больше чем за прохождение разных курсов там)
Классные уроки, все подробно и доходчиво. Спасибо.
Теперь меня не остановить.😁😁😁 Спасибо! Вы супер
Преподаватель от Бога! По хорошему завидую вашим студентам
Топ контент подъехал но для чайников будет тяжеловато)))
Я тут
Один из лучших каналов о JavaScript на ютубе. Очень интересно смотреть!
Спасибо, очень полезный урок для начинающего!
Спасибо за труд. Было бы неплохо добавить счётчик и кнопку добавить в корзину.
Просто супер. Спасибо!
классное объяснение и код на удивление простой. Спасибо автору!!!
Прохожу курсы от GeekBrains и надо сказать вы поясняет просто великолепно, там так не разжевывают и как то все быстро и не понятно, приходится заходить к вам на канал.
купил курс по "javascript разработчик " на GB, идет 3-й месяц , все что угодно изучаем но не JS , вот такие пироги XD
@@Varg7547закончил курс?
Очень классно и понятно. у человека дар объяснять.
Теперь после этого задумался сделать крутую корзину на ajax с занесением в глобальный массив Cart[ ], как раз по практикую ООП, я конечно на нем до этого никогда не писал но начинать то надо когда то))
Спасибо!)
гуд
Скажите , а как потом эту корзину добавить на другую страницу? ( в свой магазин)
Страница сделана на конструкторе гугл сайтов.
Куда потом этот код (корзина) вписывать???
Я в шоке, неделю пытался сам сделать корзину, уходило под 100 строк и нихера не работало, а тут так легко и понятно, аж грустно что я такой идиот
Помогите, что делать, когда я полностью удаляю товар с корзины и добавляю назад у меня вместо числа Nan
Сделать проверку есть ли такой id. Если нет добавить с количеством 1, если есть увеличить на 1
У вас ещё и по НОДЕ курс?
да вы просто лучший, господи
Ваще огонь!
А как переместить с одной корзины в другую. есть ролик по этой теме ?
Спасибо Александр за работу!!! Когда нибудь покажите, как сделать счетчик в корзине, при добавлении товара, чтобы в шапке меню рядом с иконкой корзины появлялось количество.
найти сумму элементов массива - это обычный цикл.
@@itgid СПАСИБО!
Очень доступно и понятно все, спасибо вам!
Спасибо
Эсли товар будет 1000 штук че делать этот код работать будет
Еcли товар убрать и потом снова нажать минус -- товар появляется с количествам NAN.
Очень доступное объяснение, спасибо. А как правильно сделать если я хочу ещё считать не только количество а ещё и сумму товаров в корзине? Понятно, что в объект добавить поле price, а вот с самой функцией которая сумму посчитает не совсем понятно???
Пожалуйста скажите какие лекарства есть в продаже узбекистана длч улучшения памяти
Мое почтение! Александр, а вы занимаетесь платной разработкой? Мне необходимо в PWA для интернет-магазина реализовать правильную политику кеширования (статика добавляется при просмотре странички пользователем на длительный срок, цены и наличие каждый день)по этому менять для контента версию кеша когда остатки меняются и корзину офлайн(реализация подразумевает что без подключения к интернету покупателю удастся оформить заказ в PWA, а как только интернет появится сервис воркер отправит его на сервер) на данный момент в любой непонятной ситуации будет заглушка с просьбой подключить интернет.
направьте, пожалуйста, на видео про renderCart()
а если в каталоге с товаром добавить иинпут с количеством, как его обработать?
Добрый день мне нужно создать такую корзину только для чат-бота telegram с использованием конструктора с возможность встраивание действие code на js, только базу данных я беру с google sheets
Вопрос этот код можно применить?
У вас баг на сайте: там, где раздел курсы по этой itgid.info/ ссылке, находится 4 курса, и , если навести мышкой после четвертого курса, то выделяться будут сначала первый курс(NodeJs) , а потом второй(если провести дальше)(React.lite Level).Ну или у меня баг)
У меня. Все сделать руки не доходят. Спасибо.
Для новичков и понимания хорошо, но использовать в реальном проекте нельзя.
Требуется совсем другой подход и в итоге у вас очень много похожего кода, которой делает примерно тоже самое. И если скорость интернета позволяет подгружать скрипт хоть в 20мб, то ресурсы ограничены.
Если обучать, так правильно, в любом случаи это лучше, чем можно встретить в "профессиональных" проектах.
для реальных проектов надо делать Class Cart ?
с кучей проверок и асинхронщины?
@@DIMANVAZ04 как говорится, самое страшное, кода твой сервис ложится под нагрузкой и клиенты сваливают на другой ресурс. Поэтому и изгаляются разрабы как только можно, чтобы подобного не допустить. Как говорил Цукерберг в "Социальная сеть" : "Фишка фэйсбук в том, что он работает всегда без единого падения"
Здравствуйте, спасибо большое за урок! У меня два вопроса:
1. В функции уменьшения кол-ва товара зачем возвращать true?
2. В функции удаления, я вот прочитал, что если использовать delete, удаляется объект, но не элемент массива. То есть общее количество элементов в массиве остается таким же. Если же использовать splice, то количество элементов в массиве уменьшается и объект со следующим индексом заменяет удаляемый. Это в данном случае имеет какую-то роль? Это когда важно?
Напишите код.
Если нажать + - + дает ошибку
Здравствуйте, делал корзину по вашему старому уроку, не подскажите пожалуйста, когда жму минус, вычитываю количество товара в корзине, то если значение доходит до 0, после оно идёт в минус, подскажите пожалуйста, как это можно исправить?Чтобы при значении ниже 1, либо удалялся товар из корзины, либо перекидывало на главную страницу сайта.Буду очень благодарен если ответите! =)
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
var cart = {};
function loadCart() {
//Проверка есть ли в localStorage запись cart
if (localStorage.getItem('cart')) {
//если есть - расшифровываю и записываю в переменную cart
cart = JSON.parse(localStorage.getItem('cart'));
console.log(isEmpty(cart));
showCart();
}
else {
$('.main-cart').html('Корзина пуста!');
}
}
function showCart() {
if (!isEmpty(cart)) {
$('.main-cart').html('Корзина пуста!')
}
else {
$.getJSON('goods.json', function (data) {
var goods = data;
var out = '';
for (var id in cart) {
out += `x`;
out += ``;
out += ` ${goods[id].name }`;
out += ` -` ;
out += `${cart[id] }`;
out += ` +` ;
out += cart[id]*goods[id].cost;
out += '';
}
$('.main-cart').html(out);
$('.del-goods').on('click', delGoods);
$('.plus-goods').on('click', plusGoods);
$('.minus-goods').on('click', minusGoods);
});
}
}
function delGoods() {
//Удаляем товар из корзины
var id = $(this).attr('data-id');
delete cart[id];
saveCart();
showCart();
}
function plusGoods() {
//Добавляем товар в корзину
var id = $(this).attr('data-id');
cart[id]++;
saveCart();
showCart();
}
function minusGoods() {
//Уменьшаем товар в корзине
var id = $(this).attr('data-id');
if (cart[id==1]) {
delete cart[id];
}
else {
cart[id]--;
}
cart[id]--;
saveCart();
showCart();
}
function saveCart() {
//Сохраняю корзину в localStorage
localStorage.setItem('cart', JSON.stringify(cart));//Корзину в строку
}
function isEmpty(object) {
//Проверка корзины на пустоту
for (var key in object)
if (object.hasOwnProperty(key)) return true;
return false;
}
$(document).ready(function () {
loadCart();
});
Эх...
Здравствуйте,я не много не понял зачем вы делали переменную которая возвращает функцию,ведь можно написать функцию
можно. Просто и такой способ существует. Чтобы не застаиваться.
@@vanya_hrynkiv но она существенна
и как же вывести вот это все через innerHTML?
Отлично, теперь вопрос. Как сделать вывод товаров, чтобы они отображались в корзине вместе с количеством?
В курсах реакт и node делаем такое
Даваи даи нам код пжж прашу тибя !!😭😞
Такой вопрос на реальном проект это должен делать фронтендер или это бэк. А вы это делали как пример для практики ?
бек только принимает результирующий массив. А фронт делает всю логику.
@@itgid Учу фронт около года и в принципе с типичными задачами все более менее понятно, даже в связке с React и Redux, но вот есть ощущение что я пол программиста, потому что не знаю бекенд и очень хочется писать фулстек приложения, посоветуйте что перспективнее и вообще лучше для бекенда? Node.js, PHP или Python jungo ? Понятно что все хостинги умеют работать c PHP без костылей, но все же? Что лучше учить? А может полезнее и лучше вообще не распыляться и практиковаться дальше во фронте? В общем нужен совет опытного человека =)
@@Polite_person_ если галера - то js+react и не распылаться. Если фриланс то js + php, а потом node.
@@itgid Спасибо!
Александр, скажите можно ли обойти работу на галере, будучи джуном? Понятно что кто то через знакомых может находить клиентов. Слышал реальную историю. Сейлз (или менеджер) заработав себе нормальный уровень на апворке через компанию, на которой работал. Спустя два года ушел из компании, а вместе с ним и программист, который с ним работал. И они сейчас сами себе компания. Ну это еденичные случае. Какой прогноз вы могли бы сделать для джуна, есть ли у него перспективы без галеры?
3:40 скриммер
А не сильно затратное дело клики по всему документу отслежывать? Или это самый простой способ?
Ребята делайте скидку, что это обучение. Я упускаю многие вещи - просто потому, что на экране их не вместишь и за 10 минут не расскажешь.
Как перезаписать HTML по клику может кто ни будь сказать чтобы кликнуть сначала все удалилось и ту даже записались новые данные?
input.addEventListener('click', (e) => {
e.target.value = ''
})
отлично =)
хороший урок
Спасибо
гуд
Аа где прибавления ?
Каким образом артикул товара окажется в data-id кнопок?
Когда html сервер будет генерировать тогда и добавит.
Ко второй минуте только врубилась, что речь идёт не о корзине для ненужных файлов.
Подскажите как перерисовать товары в корзине никак не получается. Вывожу модальным окном.
Так добавляю в корзину
for(let key in cart){
if (cart[key].count !== 0 ){
addCardHtmlMarkup = `
${cart[key].name}
${cart[key].price}
-
${cart[key].count}
+
×
`;
modalBody.insertAdjacentHTML("beforeEnd", addCardHtmlMarkup);
}
}
При нажатии закрыть удаляю все дочерние элементы, но при повторном нажатии просмотра корзины, она пустая, и товары не добавляются при добавлении
if (modalBody.childNodes.length !== 0){
modalBody.parentNode.removeChild(modalBody);
}
А если не удалять вторым скриптом появляются дубли товаров, почему при удалении перестает все работать
А сколько вам лет?
15
Спасибо! Класс!
3:40
Благодарю!
рад!
👍😀
Все хорошо, только не массив, а хеш либо объект.
Я б зробив if(!cart[id]) так чистіше.
А ще для виводу об'єктів дуже зручно використовувати console.table(cart).
да, согласен, но у меня обучающий канал, и я делаю упор на понимании, а не на меньшем коде.
найс
Кто словил скримера лайк
Цікаво і корисно. Шукаю, як зробити корзину на магазин))
Спасибо огромное!!!!!!
Спасибо