Мой сайт itgid.info/ Курс JS 2.0 itgid.info/course/javascript-2 Чат t.me/jsrules Скачать код: itgid.info/article/view?artic... Делаем фильтры контента на JavaScript
Пікірлер: 106
@MariIloveREALmusic3 жыл бұрын
Спасибо Вам ОГРОМЕННОЕ!!! что так просто и понятно объясняете и разъясняете, что делает каждая строка кода.
@cg_man4 жыл бұрын
Святая корова, это то что мне было нужно именно сейчас. Благодарю
@itgid4 жыл бұрын
круто!
@mtanasov Жыл бұрын
👍👍👍у Вас очень разъясняющие и доходчивые уроки. Спасибо за Ваш труд
@antonromanov13472 жыл бұрын
Хороший видеоурок, спасибо вам большое. Недавно только начал практиковаться на JavaScript, и как раз была идея попробовать сделать фильтр для сайта. Спасибо большое🔥🔥
@sneakykickz2 жыл бұрын
Огромное спасибище! И офигеть, какой стильный пример! Говорю как UXUI дизайнер, который не равнодушен к коду)))))
@assalamualeykum1028 Жыл бұрын
Всё очень понятно и чётко объясняете. Спасибо!
@heyter15794 жыл бұрын
ваши уроки как бальзам на душу, а концовка услада для ушей
@user-jr7ny5pm1y3 жыл бұрын
Очень полезный и хороший видеоурок, спасибо
@Asver_4 жыл бұрын
Александр, спасибо вам большое!!! Очень интересные и хорошо раскрытые у вас уроки!!!
@khamidakhmedov2484 жыл бұрын
Просто кайфую от ваших уроков
@khamidakhmedov2484 жыл бұрын
Я очень благодарен вам!!!! Вы очень крутой учитель!!!!!
@moore44462 жыл бұрын
Спасибо вам большое! Пишу диплом и это первый ролик по js, в котором у меня действительно все получается, а главное ВСЁ ПОНЯТНО. Когда появлялась мысль "что-то не поняла", вы сразу в этот момент все объясняете подробно. И речь приятная, и, прозвучит странно, но какая-то домашняя спокойная обстановка ощущается и намного легче что-то запоминать. Рада, что наткнулась на этот канал.
@_fulgrim_98652 жыл бұрын
Супер объяснение, спасибо за урок, помогли))
@user-rv9zc6di1z4 жыл бұрын
Спасибо, отличный пример, отличный урок)) Добавляем классу box еще анимацию на плавное появление и вообще то, что нужно!
@pavelrumyantsev6263 жыл бұрын
Здравствуйте! Все отлично! Объясняете доступно и доходчиво. Не мне судить, но оценка 5+++++++. Еще раз спасибо за урок.
@unique_mind_system3 жыл бұрын
Спасибо за урок! Вы очень хорошо объясняете и с юмором) JS трудно даётся, но я стараюсь. У вас на курсы демократические и доступные цены, заметил что большая часть в открытом доступе, но наверное от обратной связи результат не заставит себя ждать. Раньше покупал курсы html,css,js, но в js очень сильно плаваю.
@diasoralbekov64653 жыл бұрын
оочень помогли,огромное спасибо!
@filipcorina3 жыл бұрын
mega kruto! Spasibo!
@enterkvas Жыл бұрын
Огромное Вам спасибо!
@gorkachannel7988 Жыл бұрын
урок конечно классный, но думаю, что не совсем подойдет для реальных проектов. Представим, что мы получаем данные с бэка о каких то карточках, их может быть хоть сотня. Карточки рендерим на странице, 10 карточек синих, 90 красных. На странице также присутствует чекбокс для фильтрации "только синие". И код предложенный в видео, просто скрывает ненужные карточки, но не удаляет из dom дерева, т.е. все равно идет нагрузка на ресурсы пользователя, как будто он просматривает 100 карточек, а не всего 10 нужных синих. С точки зрения оптимизации будет лучше удалять эти элементы из dom и возвращать, когда чекбокс переходит в состояние инактив. Сугубо мое личное мнение :)
@user-super269 Жыл бұрын
подскажете как это сделать?
@maximpopov4106 Жыл бұрын
@@user-super269 а как вернуть если их удалил ?
@romanmed903511 ай бұрын
отличный комментарий. а я открыл это чтобы показать начинающему как деалть. хорошо что сначала прочитал комментарий. иначе нацучил бы его не правильному. надо пересматривать сначала видео прежде чем отправлять ссылки ученикам. а так делать совсем нельзя как показано. только полное новое формирование дерева. даже в старые времена так не делалось. это какое-то новшество вредительства.
@gorkachannel798810 ай бұрын
@@maximpopov4106 точно так же, как и удалил) через insertAdjacent рендеришь отфильтрованные, когда фильтра нет, рендеришь весь массив
@user-sg7dn9wz2r2 ай бұрын
@@user-super269 добавлять эл-ты динамически через js изначально. Формировать массив эл-тов, потом его сортировать и добавлять уже отсортированный в верстку
@windcrack8404 Жыл бұрын
Дякую, знайшов, що треба було.
@glebkabayjanov56464 жыл бұрын
воооо годнота подехала больше больше Jsa Александр
@user-js3sy2qv7m4 жыл бұрын
вот еще один канал где предоставляют актуальную и адекватную информацию . спасибо вам за это большое
@Learn-Dev_4 жыл бұрын
Если ещё один, то тогда какой первый? ))
@romanvinichenko19103 жыл бұрын
Очень полезное видео, у меня была задача отфильтровать без использования Jquery
@chev_chelios7 ай бұрын
Классный урок!
@user-qh4zv9qc9h2 жыл бұрын
Очень красиво))))
@user-yp2mf6wl1t3 жыл бұрын
Спасибо огромное!!!
@user-bq6pk8pf3g Жыл бұрын
Пока не все понятно😁 но фильтр сделал, все работает. Спасибо.
@nodirayakubova63954 жыл бұрын
Офигенно обажаю ваши видео уроки все все понятно объесьняете
@ivansafronov33594 жыл бұрын
Блин, как ты попал прям! У меня заказ висит, нигде не могу найти годный урок по фильтру товаров! А ты его прям в нужный момент выложил! Спасибо, продолжай практические уроки🙏
@svetlanabek55334 жыл бұрын
Заказы берёшь и не знаешь как сделать? А если никто не выложит решение? Что делать?
@ivansafronov33594 жыл бұрын
@@svetlanabek5533 самому решать, мне просто повезло, что он выложил. Он не сделал работу за меня, он её облегчил.
@vitaliy7944 жыл бұрын
@@svetlanabek5533 я думаю в наше время к 98% задач уже есть готовое решение и нужно только уметь нагуглить) Так что можно смело брать любые заказы и делать с гуглом их легко.
@ivansafronov33594 жыл бұрын
@@vitaliy794 Вот вот, при чем даже автор этого канала сам говорил в нескольких роликов, что 90% времени программиста - это поиск информации и готового решения, чтоб уже под себя сделать! А с логикой "зачем брать готовое?" можно и фреймворками не пользоваться 😅
@scott860racing Жыл бұрын
Просто шикарно
@user-zk5ok6wn2l4 жыл бұрын
Круто! Продолжай в том же духе 👍
@siyisa1329 күн бұрын
это шедевр
@MihailAleshkin4 жыл бұрын
Как вариант можно добавить тег в контейнер с блоками и в нем прописать display: none ко всем классам кроме выбранного. Тогда не придется перебирать все блоки.
@heyter15794 жыл бұрын
можно, но анимации при исчезновений не будет, слишком громоздко будут изчезать
@alexey1946 Жыл бұрын
А как прописать, что бы было кроме выбранного?
@user-gt1ky5mn1j3 жыл бұрын
Спасибо большое
@user-tc1qq5nm3x3 жыл бұрын
спасибо 😊
@serg12213 жыл бұрын
Увы, сейчас чтобы джуном по JS стать надо еще вчера было быть миддлом, на вакансии посмотри, так там под десяток технологий знать надо
@user-pn2ev2je2l4 жыл бұрын
Благодарю Вас за видео.
@user-wo8wd9kr1b4 жыл бұрын
Спасибо. То что надо
@leto0leg3 жыл бұрын
Можно наверное toggle использовать, чтобы включать и выключать hide элементов?
@jaloliddinhaqnazarov2667 Жыл бұрын
Самый лучший
@HackOFF3 жыл бұрын
Отличное решение и в тоже время два вопроса# 1. Что будет если у пользователя отключен JS - Просто не увидит этих блоков? 2. Как поисковики будут видеть эти блоки если их содержимое допустим карточки товаров? спасибо!
@kirkir55334 жыл бұрын
Я бы с удовольствием посмотрел на реализацию фильтров через url(что бы фильтр настройки не сбрасывались) и с фейковыми данными(а не статика)
@itgid4 жыл бұрын
хорошая идея
@khamidakhmedov2484 жыл бұрын
Респект
@eugeneshiyan3 жыл бұрын
Всё круто
@Makspachino2 жыл бұрын
А можно сделать не категории а метки, и что бы у каждой карточки было несколько меток?
@KirillKlimov_lds4 жыл бұрын
А как сделать, чтобы элементы исчезали при клике на самом прямоугольнике, а не на слове в навигации?
@q1dsdsdsq2dssdsd954 жыл бұрын
Зачем вы вручную код правите? Расскажите новичкам про prettier, вы же явно используете что-то такое на проектах или просто vscode расширение
@DioNis-eblix3 жыл бұрын
Добрый день, подскажите пожалуйста, а если мне нужно реализовать так. Выборка идёт не по одному классу привязаному к div элементу, а по двум. Например если я ещё добавлю класс. Алгоритм будет работать? Мне нужно, что бы выборка элементов div работала по нескольким мне нужным параметрам.
@user-vq8cu3zd5y Жыл бұрын
Здравствуйте, получилось найти решение?
@user-sn4ib9dt3e Жыл бұрын
А как реализовать множественный выбор?
@4chan355 Жыл бұрын
здравствуйте хотел спросить, делал все как по видео, в итоге фильтр работает но есть одна проблема когда применяется фильтр активные блоки не встают на верх, они просто стоят на своем месте как и со всеми блоками, можете помочь пожалуйста
@stalk47363 жыл бұрын
Можно сделать фильтр для динамически созданных элементов?
@itgid3 жыл бұрын
Да можно
@stalk47363 жыл бұрын
@@itgid спасибо
@asdasd-iv2ik Жыл бұрын
А можно ссылку на код?, у меня дивы по центру стоят, они не переходят влево страницы
@enterkvas Жыл бұрын
Не работает класс hide (хотя и добавляется в класс, который должен удаляться). Оч долго бьюсь над этой проблемой. Прошу помощи.
@Game-oz6gg3 жыл бұрын
А обработчик может остановить событие?
@geek78073 жыл бұрын
3:15 Очень маленькая придирка: не логичнее ли было border указывать в .box, а в классах по цветам определять, соответственно, только border-color? Очень режет глаз повторение 3px solid, тем более, что данный интерфейс не предполагает разную ширину и стиль бордера.
@vasyarebryk9102 Жыл бұрын
Маю завдання зробити фільтер як у сайта розетка. Як це зробити ?
@user-ql5wj5zi5t3 жыл бұрын
как называется приложение на котором вы пишите сайты?
@green81063 жыл бұрын
Там же написано, визуал студия
@aquilon17903 жыл бұрын
Я заметил, что почти везде фильтрация работает через запрос на сервер. Выставили фильтр - отправили запрос - получили ответ - отрисовали. Но этот метод используется в крупных магазинах, а как быть если задача сделать одностраничник для фотографа где будет большая галерея с фотографиями? Допустим 100 фотографий.. Не загружать же их все сразу, я уже всю голову сломал)
@awenn20153 жыл бұрын
У меня есть решение на js , подключаю плагин, инициализирую галерею, и выставляю нужные параметры, кол-во фоток которые грузятся сначала и кнопка по которой можно подгружать следующие партии, если нужно можешь ответить скину исходники
@awenn20153 жыл бұрын
Сейчас пилю сайт для своих плагинов что бы люди могли их качать спокойно
@UchVuch Жыл бұрын
@@awenn2015 и как успехи, запилил сайт? :)
@grandmaster53184 жыл бұрын
Нормально ли будет работать в других браузерах? Не проще ли взять готовую библиотеку?
@itgid4 жыл бұрын
GRANDMASTER вы путаете продакшен и обучение.
@grandmaster53184 жыл бұрын
Понял
@user-kj7nz2mh3q3 жыл бұрын
Планируете ли вести обучения на симуляторах? Вроде Мате Академия и Яндекс Практикум.
@ryadik_live4 жыл бұрын
Здравствуйте, курс JS v2.0 Ещё актуален? Менторство ещё идет?
@ja-rusyn3 жыл бұрын
Да 🍒 ✌
@user-jv6vv9bk4e3 жыл бұрын
@@ja-rusyn Спустя пол года....))))))
@flickeru8877 Жыл бұрын
А что с курсом и телегой, почему нет ни того ни другого?
@itgid Жыл бұрын
Все есть. Itgid.info Просто если вы с рф или рб то ваши провайдеры блокируют. Почему - к ним вопросы
@nik_user75 Жыл бұрын
@@itgid не получается, хотел скачать пример, пишет файл не найден
@plajboi36083 жыл бұрын
Что делать если нужен display none, но и анимация осталась ?
@awenn20153 жыл бұрын
Ничего, display не работает с анимацией
@UchVuch Жыл бұрын
Сначала убирать с анимацией, а потом добавлять с задержкой к этим элементам новый класс с display:none
@plajboi3608 Жыл бұрын
@@UchVuch азахах парни, ну вы чего) уже 2 года прошло, уже знаю)
@deterkot Жыл бұрын
Ничего, display не работает с анимацией
@user-vi3ur8bw8k4 жыл бұрын
А как сделать, чтобы при нажатии all тоже была анимация?
@user-wg9hu3eb6r2 жыл бұрын
8:58
@rogaldorn70164 жыл бұрын
Мне кажется, что было бы проще сделать генерацию элементов через JS или же реализовать названия классов по БЭМ.
@ticheroi4 жыл бұрын
сделай, поделись с комюнити, а мы зайдём и поставим тебе upvotes
@nikolaydd62193 жыл бұрын
Красиво но бессмысленно. Где это реально можно применить?
@itgid3 жыл бұрын
на простых страницах где фильтрацию можно делать на клиенте.
@valerasho58743 жыл бұрын
Достаточно часто такое встречается на сайтах, например портфолио галерея, контент-галерея и прочее подобное, я исрользовал для этого mixitup плагин, но самому как оказалось писать всего то ничего)
@vll19764 жыл бұрын
Чтобы сделать очередной дебильный недомагазин с одной страницей и с тремя товарами, где ничего нет, но то что есть красиво плавает по нажатию мышки. Также должна быть страница "About Us" с фотками спи3жеными с интернета с кикими-то левыми кентами сидящими в пафосных позах. Очень круто...
@user-gt2yi7wg6p4 жыл бұрын
Херня. Вы видели сам эффект при перестройке элементов? Чтобы такого дерганья не было элементы позиционируют absolute, вычисляют у каждого его будущую позицию и анимируют. После этого absolute убирают.