Работа с сервером "Список студентов"

Рет қаралды 12,020

Күн бұрын

Разбираем взаимодействие с сервером, сохранение списка студентов в базе, получение и удаление.
👁‍🗨 Телеграм канал: t.me/frontend_du2
👁‍🗨 Discord: / discord
👁‍🗨 VK: frontend_du2
👁‍🗨 Дзен: dzen.ru/frontend_it
Тайм-коды:
00:00 - вступление/подготовка(верстка/стили);
13:56 - пишем js (создаем массив студентов);
18:27 - создание и вывод студентов через цикл for of;
30:31 - пишем функцию render(), которая будет запускаться каждый раз при обновлении таблицы;
32:10 - добавление нового студента;
37:11 - работа с сервером

Пікірлер: 139

@ratmetall6664 Ай бұрын

Я поймал себя на мысли, что при поиске фильмов на ютубе, если подставляется Ваш канал - я отдаю предпочтение ему:) и смотрю вместо фильма. У Вас уже так много контента (за полтора года) снять столько полезных и понятных (для широкой массы публики) - это дорогого стоит! Если б у меня был "лишний" миллион - я бы с радостью его Вам отдал в знак благодарности! ....

@alex_dudukalo Ай бұрын

Мне было очень приятно прочитать ваш комментарий :) Приятно, что ролики интересно смотреть. Я планирую экспериментировать и делать так, что бы видео содержали не только полезную информацию, но и развлекательные вставки ) Посмотрим, что получится :) Надеюсь, вы сможете оценить.

@kia3533 8 ай бұрын

Александр, спасибо!!! Благодаря Вам сегодня сдала последнюю контрольную!! Приступаю к финальной работе)) Если бы не ваши видео, то думаю, что JS бы меня победил. 😂😂😂 Столько раз опускались руки.. Но ваша работа показывает, что JS - это просто и безумно интересно!!! Очень нравится в ваших видео то, что вы наглядно показываете, как пользоваться библиотеками; показываете промежуточный вариант, а не сразу вставляете готовый код; показываете, как и где искать и исправлять ошибки. Конечно видео получаются долгими, но результат того стоит!!!

@alex_dudukalo 8 ай бұрын

Безумно приятно получать такую обратную связь ☺ Рад, что у вас все получилось!) Спасибо за отзыв 🤗

@RuslanaRovdo Ай бұрын

Спасибо огроменное! Потихоньку всё встаёт на свои места. Я смотрела учебную лекцию с курса, ничего не поняла, показала её своему мужу-программисту, он сказал: это не лекция, а рассказ одного миддла другому как он делает что-то ))) Предложил найти толкового объясняльщика, и у нас есть такой - это Вы, Александр! Я иначе сделала предыдущее задание со списком студентов, попробую теперь внести в него изменения для работы с сервером, надеюсь, получится теперь.

@user-yq4wj6sh8k Жыл бұрын

Спасибо большое! Стало понятней)) В середине изучения JS у меня появились пробелы, перестала понимать, что куда идет. А сейчас чувствую глаза открываются :-) Подучу теорию и скорее всего еще раз буду проходиться по вашим видео.

@xdayx53 5 ай бұрын

Это как раз таки то, что я искал. Безумно благодарен за такие видео, это база, это то, что нужно!

@PirBogov Жыл бұрын

Спасибо за подробное видео! Просматривала несколько раз. Будем ждать новые видео!

@alex_dudukalo Жыл бұрын

Спасибо вам за комментарий :) Буду ждать вас на новых видео. Не всегда получается быстро отвечать на комментарии (

@user-pl7jz8tc6d 12 күн бұрын

Спасибо большое! Понятно и доступно! Как всегда!👍👍👍👏👏👏

@relaxdeepsleepmusic3608 3 ай бұрын

Вот и пригодилось это видео, очень помогло в решении задач, всё по полочкам, спасибо Александр)

@anton4know 11 ай бұрын

Спасибо за очередной, доступный и понятный разбор задания, Александр! Процветания Вашему каналу!🧠💪👍

@alex_dudukalo 11 ай бұрын

Большое спасибо за такой клевый комментарий )

@yurymilko3808 Жыл бұрын

Очень вовремя! Как раз выполняю 11.6!!! Спасибо, Александр!

@alex_dudukalo Жыл бұрын

Спасибо вам )Надеюсь ролик помог))

@Sovkova_elvira Жыл бұрын

Спасибо большое за понятное объяснение! Смотрю Ваши видео, Вы делаете важное дело!

@alex_dudukalo Жыл бұрын

Большое спасибо вам за то, что поддерживаете меня комментариями)

@user-hc7wq9om9i 11 ай бұрын

Спасибо большое Вам! Все очень интересно рассказываете и показываете👍👍👍 видео получилось очень информативным!)

@alex_dudukalo 11 ай бұрын

Старался как можно больше полезного вложить в это видео. Получилось длинным, но я надеюсь у меня это получилось. Спасибо за ваш полезный и приятный комментарий :)

@user-kl6ww8ed5p 5 ай бұрын

Хочу сказать просто огромнейшее спасибо за ваш труд! Все видео невероятно полезные и понятные! Просто слов нет, как мне все видео помогли!

@alex_dudukalo 5 ай бұрын

Ваша поддержка очень мотивирует 🤗 спасибо за такую теплую обратную связь 🙈 рад, что видео вам были полезны, желаю удачи в изучении JS 🔥

@user-eo6ex8ds8q Жыл бұрын

Спасибо большое, Александр за ваш труд! Все ясно и понятно👌

@alex_dudukalo Жыл бұрын

Спасибо за ваш комментарий :) Мне очень приятно :)

@viktor___sun 11 ай бұрын

Спасибо Александр! Очень полезно! Классная подача!

@alex_dudukalo 11 ай бұрын

Большое спасибо за ваш комментарий :) Очень очень приятно его читать )

@asyaushakova7071 4 ай бұрын

Как приятно смотреть и все понимать, благодарю вас за такое информативное видео 👍

@alex_dudukalo 4 ай бұрын

Спасибо за отзыв 🤗 надеюсь и другие видео канала будут вам полезны)))

@tigrext20 Жыл бұрын

Спасибо за видео работы с сервером! Очень не хватало такого разбора!

@alex_dudukalo Жыл бұрын

Спасибо за ваш комментарий 😇

@RamaRama-qv3jo Жыл бұрын

Большое спасибо за видео, очень доходчиво 👍

@user-zn8sr4wj2w Жыл бұрын

Все классно делаешь, все понятно и интересно👍

@pavelpatsenkov 3 ай бұрын

Александр, Спасибо большое. Очень помогло в обучении.

@alex_dudukalo 3 ай бұрын

Спасибо вам за ваш отзыв :) Очень приятно

@Denik-is6gi Жыл бұрын

Спасибо за видео и хорошее объяснение!! Да, тема сложноватая, но после этого видео стала гораздо понятнее и проще для понимания.

@fedorich1191 10 ай бұрын

Александр, спасибо за очередное полезное, важное и понятное видео и объяснение ! Жаль, нельзя при каждом просмотре ставить лайк, думаю тогда их было бы порядком больше )

@alex_dudukalo 9 ай бұрын

Спасибо Вам за поддержку 😊 Это очень мотивирует! Прошу прощения за долгое ожидание ответа((

@khayaproduction5537 Жыл бұрын

Супер! Очень вовремя! Огромное спасибо!!!!

@alex_dudukalo Жыл бұрын

Списал вам за просмотр ))

@Anton90tuzha Жыл бұрын

Супер, не представляю как много времени у меня бы ушло на выполнение домашней работы без вашего ролика Александр!

@alex_dudukalo Жыл бұрын

Спасибо :) Я рад, что ролик вам помог. Да, видео долгое, но я попытался все показать ))

@MihailAbysmo Жыл бұрын

Класс👍Благодарю... то, что нужно

@alex_dudukalo Жыл бұрын

Спасибо за ваш отклик ))

@user-xz7jj8xe6c 5 ай бұрын

Спасибо! Очень полезный ролик.

@alex_dudukalo 5 ай бұрын

Спасибо за ваш комментарий 🤗 надеюсь и другие видео канала будут вам полезны))

@user-rp9du1uu3l 8 ай бұрын

спасибо за подробное объяснение) знаете как подробно и понятно все изложить

@alex_dudukalo 8 ай бұрын

Очень приятно читать такие комментарии 😊 спасибо за вашу поддержку

@a.k.9386 Жыл бұрын

Спасибо большое за труд! Это действительно полезно. И да, отдельное видео по response было бы очень кстати.)

@alex_dudukalo Жыл бұрын

Большое спасибо вам за ваш комментарий :) Да, поставил в план ролик по fetch и response

@andreypavlukov1192 Жыл бұрын

кладись знаний, спасибо за ваш вклад, Алекс!

@alex_dudukalo Жыл бұрын

С такой поддержкой я сниму еще много роликов 😇большое спасибо ))

@andrey-frontend Жыл бұрын

Спасибо за видео)

@Andreus9733 8 ай бұрын

В очередной раз огромное спасибо!

@alex_dudukalo 8 ай бұрын

Спасибо за ваш комментарий, ваша поддержка очень мотивирует🤗

@shps.online9830 Жыл бұрын

Хороший видос) развития)

@alex_dudukalo Жыл бұрын

Спасибо за поддержку ) Будем стараться))

@Vt_Shabanoff 5 ай бұрын

спасибо за этот разбор!!!!

@alex_dudukalo 5 ай бұрын

Спасибо за обратную связь 😊

@artemsmirnov8751 6 ай бұрын

Супер! Спасибо !!

@alex_dudukalo 6 ай бұрын

Спасибо за ваш комментарий🤗

@user-gm9dw4rq6r 11 ай бұрын

Благодарю за труд!

@alex_dudukalo 11 ай бұрын

Спасибо вам за ваш комментарий 😍

@Blood-Saw Жыл бұрын

Спасибо за видео!

@alex_dudukalo Жыл бұрын

И вам спасибо за поддержку комментарием 😇

@globaltrace_ Жыл бұрын

Хорошее видео, Александру респект и уважуха. Надеюсь скоро я буду сам такие вещи делать((((без помощи)

@alex_dudukalo Жыл бұрын

Спасибо вам за отклик ) Обязательно будете делать и еще лучше )

@user-cn4rg9my5f 5 ай бұрын

Великолепное объяснение. Подскажите, что нужно нажать, чтобы выделять в комментарий блоки текста?

@tigrext20 Жыл бұрын

Хотелось бы еще увидеть такового плана видео: есть лоадер, который запускается при запросе на сервер, как только сервер отдает нам данные, то лоадер убирается (то есть сделать отслеживание передачи данных, а не простое использование settimeout)

@alex_dudukalo Жыл бұрын

Да, это можно сделать ) Думаю в одном из роликов применю ) Алгоритм простой. Перед запросом fetch показывает лоадер и после того, как получили ответ, его скрываем :)

@anitoriV 8 ай бұрын

Спасибо! ❤

@alex_dudukalo 8 ай бұрын

Спасибо за отзыв 🔥

@user-ck3hl9kk1r 2 ай бұрын

Видосики огонь, а будет видео как создавать серверную часть?

@GoodsJs Жыл бұрын

Крутяк спасибо!!!!

@alex_dudukalo Жыл бұрын

Спасибо вам :)

@Elena.S. 8 ай бұрын

Спасибо! 💎

@alex_dudukalo 8 ай бұрын

Спасибо за отзыв 🔥

@user-pe6nv8yp2m 8 ай бұрын

Александр, спасибо за видео, очень полезное, можно чуть по подробнее если через классы, id автоматически добавляется на сервер, возвращается , а вот при удалении - undefined, нужно его в класс добавить или ? , куда копать подскажите, спасибо

@alex_dudukalo 8 ай бұрын

Здравствуйте, да в классе необходимо добавить новое свойство id. Как добавлять свойства я уже ранее показал ) И тогда при создании экземпляра класса вы будете передавать этот new Student(id, другие атрибуты)

@agur4ik135 Жыл бұрын

спасибо куратор (возрощайтесь из отпуска)💯

@alex_dudukalo Жыл бұрын

Спасибо вам за комментарий :) Думаю мы скоро продолжим работать :)

@boris___britva Жыл бұрын

Отлично, спасибо)

@alex_dudukalo Жыл бұрын

Спасибо )

@boris___britva Жыл бұрын

@@alex_dudukalo если есть возможность, то давайте сделаем видео по вью. Интересны компоненты и способы их связывание между собой))

@boris___britva Жыл бұрын

А также роутинг

@dungeonguard130 9 ай бұрын

Александр, большое спасибо за видео, остался только один вопрос, как можно вывести и данные из изначального массива?

@alex_dudukalo 9 ай бұрын

Здравствуйте, спасибо вам :) По массиву можно пройтись циклом. И использовать внутри цикла элементы массива для того, что бы создать каждый элемент. Надеюсь, я правильно понял вопрос )

@evanchu8321 Жыл бұрын

Спасибо вам

@alex_dudukalo Жыл бұрын

Взаимно :)

@user-xz7jj8xe6c 5 ай бұрын

1.04.50. По клику удаляется объект с сервера и строчка из таблицы. Однако остаётся в массиве если не обновлять страницу. Если добавить нового студента, удалённый студент снова появляется в таблице. То же самое при фильтрации.(

@megabulk Жыл бұрын

КРУТО!!!!!

@alex_dudukalo Жыл бұрын

Спасибо ))

@andreyfedyukin8360 Жыл бұрын

Спасибо 👍 Очень интересно, но не всё пока понятно.

@alex_dudukalo Жыл бұрын

Да, понимаю ) Это видео не разбирает основы, а лишь демонстрация примера :) Спасибо вам

@user-cn4rg9my5f 4 ай бұрын

Очень хочется пример работ с PACH методом. Теоретически должно работать по аналогии, но видимо есть нюансы.

@user-hm2ww5lu7b Ай бұрын

Почему у меня когда добавляю await на 26 строчке выдает ошибку что await не в зоне асинхронной функции?

@snegosvin6815 3 ай бұрын

А если ID хочешь добавить в таблицу (id автоматически формируется сервером), как его брать из сервера?

@user-pt6bg5qi1p 4 ай бұрын

Здравствуйте, есть ли примеры как изменить на сервере данные через метод PACH

@user-kh4vh9dr1i Жыл бұрын

Вчера ломал голову над похожим задачей Только у меня слайдер, при каждом нажатии на вперед и назад формируется рандомные товары За раз показывается 3 товара карточки Общее количество товаров 8 Как можно реализовать ?

@alex_dudukalo Жыл бұрын

Здравствуйте, если в качестве слайдера вы используете свайпер, то вы можете попробовать такой пример qna.habr.com/q/1080780

@user-kh4vh9dr1i Жыл бұрын

@@alex_dudukalo спасибо

@agur4ik135 Жыл бұрын

💯

@user-tg5kb4mn9p 10 ай бұрын

Всё понятно. Но есть один вопрос - как это реализовать на хостинге, а не через локальный сервер? Спасибо.

@alex_dudukalo 10 ай бұрын

Здравствуйте, в этом случае серверную часть придется перенести на хостинг с поддержкой VPS/VDS :)

@user-tg5kb4mn9p 9 ай бұрын

Спасибо. Попробую. Как раз дошёл до 11 модуля. Потом напишу.

@user-tg5kb4mn9p 8 ай бұрын

@@alex_dudukalo Добрый день! Ваш вариант локально классно работает. Хотел уточнить может у Вас есть материал ( ссылка), как бекенд правильно перевести на сервер? ( как я понимаю это не просто адрес поменять). Спасибо

@snegosvin6815 6 ай бұрын

Я сейчас работаю над списком студентов. Создание сервера здесь обязательно?

@alex_dudukalo 6 ай бұрын

Рад, что вы посмотрели видео. Если вы имеете ввиду работу 10 на Скиллбокс, то в этом работе сервер будет не нужен. Но в работе 11 он точно понадобится :)

@user-gn5th5gt2w Жыл бұрын

Если снимешь видео о том как такой сервер деплоить, то будет просто чудесно

@alex_dudukalo Жыл бұрын

Думаю об этом. Но тут наврено нужно целую серию делать. Так, как там подвязана куча тем ))

@user-pv2bk9mm4h Жыл бұрын

Одного не пойму почему у меня при вызове функции, await перед функцией вызывает ошибку, а на видео нет ошибки, что за фокусы?(

@liissav7985 Жыл бұрын

@user-fh7dx7tz4p 7 ай бұрын

Спасибо, !!! Было бы не плохо показать, как изменить данные, при клике на кнопку изменить

@alex_dudukalo 7 ай бұрын

Спасибо вам за комментарий. Да, хотел это добавить, но это сильно удлинило бы видео, учитывая что нужно создать форму для редактирования данных. Идея хорошая, думаю я сделаю такое. Прошу прощения за долгий ответ. Не всегда получается ответить быстрее :(

@user-fh7dx7tz4p 7 ай бұрын

@@alex_dudukalo спасибо!!!! Ещё бы финалку по js SkillBox продвинутый уровень, вот мы обнаглели наверно да?

@alex_dudukalo 7 ай бұрын

@@user-fh7dx7tz4p 😀, да там точно одним видео обойтись не получится

@user-fh7dx7tz4p 7 ай бұрын

@@alex_dudukalo да хоть 10 видео, просто без вас это задание не осилить

@arthurarmadov4446 Жыл бұрын

Не че так про window.location надо тему разобрать

@alex_dudukalo Жыл бұрын

Хорошая идея) думаю сделать большой ролик по этой теме ) там много интересного )

@shamidinoff Жыл бұрын

Как добавить видеоплеер? У вас есть такой урок?

@alex_dudukalo Жыл бұрын

Здравствуйте, по видеоплееру ролика нет) Но думаю в будущем сделаю :)

@user-en7qg2dq3m 5 ай бұрын

Что за классы в конце видео?

@alex_dudukalo 5 ай бұрын

Дело в том, что ранее я записывал серию видео о том, как сделать такое приложение, основанное на классе сотрудников. Это упоминание для тех, кто делал работу по этому видео. Если будет интересно, вот ссылки на видео :) Список сотрудников. Часть 1: kzfaq.info/get/bejne/mtOhqceXnM2zf4U.html Список сотрудников. Часть 2: kzfaq.info/get/bejne/jLaPeaVmydHPdWQ.html Список сотрудников. Часть 3: kzfaq.info/get/bejne/qaqKqKh1ltCakoE.html

@brauchesehen Жыл бұрын

Я три часа просидела, но так и не поняла как это с классом реализовать, так и не заработало ничего ахах

@cherievishnevskaya 8 ай бұрын

та же проблема..

@cherievishnevskaya 8 ай бұрын

как провернуть то же самое, только с классами

@alex_dudukalo 8 ай бұрын

В конце ролика я дал короткое описание, но кажется здесь следует записать более подробный ролик. Я так понял, вы сделали работу по видео с классами :)

@user-pe6nv8yp2m 8 ай бұрын

присоединяюсь к вопросу, тоже делаю через классы, но не получается удаление, как то нужно это связать с id, не понятно. А видео отличное.@@alex_dudukalo

@cherievishnevskaya 8 ай бұрын

@@alex_dudukalo дада

@candyflip8466 8 ай бұрын

@@alex_dudukalo Запишите пожалуйста ролик с более подробным разбором работы с классами и сервером. Третий день мучаюсь и ничего не получается((

@user-lm9ee1gn5p Жыл бұрын

00:00 вступление/подготовка(верстка/стили); 13:56 пишем js (создаем массив студентов); 18:27 создание и вывод студентов через цикл for of; 30:31 пишем функцию render(), которая будет запускаться каждый раз при обновлении таблицы; 32:10 добавление нового студента; 37:11 работа с сервером

@alex_dudukalo Жыл бұрын

Еще одна подборка тайм-кодов :) Спасибо вам :) Забрал в описание

@user-lm9ee1gn5p Жыл бұрын

@@alex_dudukalo подпольный ghostwriter 🤣 всегда пожалуйста)

@user-lm9ee1gn5p Жыл бұрын

@@alex_dudukalo кстати, возник такой вопрос, когда изучал дату, нашел такой метод toLocaleDateString ()Можно ли его использовать как альтернативу Вашей функции, которая переводит в нормальную дату ?

@YourPlayGamer Жыл бұрын

Отдельное видео про JSON

@alex_dudukalo Жыл бұрын

Уже есть :) kzfaq.info/get/bejne/l6mHdLyI3t_Rp3U.html

@user-wj4pc7te1j 4 күн бұрын

Нет, не умеешь ты объяснять. Не твоё это. Не делай этого больше.

@PieceOfInternet 11 ай бұрын

Привет, как всегда отличное видео) спасибо По поводу даты, где-то на 26-27 минуте ты искал как привести дату к читаемому виду) Если я не ошибаюсь то у даты есть метод toLocaleDateString() который удобно преобразует дату в нормальный вид const birthday = new Date(1997, 4, 1); const readableBirthday = birthday.toLocaleDateString() -> // 01.05.1997

@alex_dudukalo 11 ай бұрын

Здравствуйте, да. Спасибо вам за комментарий :) Да, функция toLocaleDateString знакома, но насколько я помню там есть проблемы с совместимостью в браузерах. Думаю следует проверить эту информацию )) Спасибо вам

@relaxdeepsleepmusic3608 Жыл бұрын

Классное видео, узнал много нового, спасибо.

@alex_dudukalo Жыл бұрын

Большое спасибо за ваш комментарий :)