- Видео 19
- Просмотров 378 903
Как стать программистом
Россия
Добавлен 4 фев 2020
Всем привет. Меня зовут Адам Балкоев. И на этом канале я рассказываю как стать программистом. Обязательно подпишись на канал!
🍿 Betflix / Разработка ОНЛАЙН кинотеатра (2024) [REACT, REDUX, MUI]
⭐️ Подпишись на Телеграм канал: t.me/balkoev_blog
💜 Поддержать донатом: boosty.to/balkoev
👨💻 Ссылка на репозиторий: t.me/balkoev_blog/25
🎥 В этом длинном видео уроке мы напишем на React кинотеатр с возможностью онлайн просмотра фильмов.
➡️ Ссылки из видео:
kinopoiskapiunofficial.tech/
pleer.videoplayers.club/
⏳ Таймкоды:
00:00:00 Введение
00:06:07 Настройка окружения
00:10:57 Eslint + Prettier
00:17:54 Eslint sort imports
00:20:57 Routing + MUI
00:26:00 Navbar
01:05:14 Footer
01:14:38 Обзор API
01:23:33 Redux toolkit
01:49:45 Переменные окружения (ENV)
01:56:27 Страница с коллекциями фильмов
02:32:04 Пагинация
02:39:04 Главная страница - api
02:59:01 Главная страница - карусель
03:26:31 Компонент ErrorMessage...
💜 Поддержать донатом: boosty.to/balkoev
👨💻 Ссылка на репозиторий: t.me/balkoev_blog/25
🎥 В этом длинном видео уроке мы напишем на React кинотеатр с возможностью онлайн просмотра фильмов.
➡️ Ссылки из видео:
kinopoiskapiunofficial.tech/
pleer.videoplayers.club/
⏳ Таймкоды:
00:00:00 Введение
00:06:07 Настройка окружения
00:10:57 Eslint + Prettier
00:17:54 Eslint sort imports
00:20:57 Routing + MUI
00:26:00 Navbar
01:05:14 Footer
01:14:38 Обзор API
01:23:33 Redux toolkit
01:49:45 Переменные окружения (ENV)
01:56:27 Страница с коллекциями фильмов
02:32:04 Пагинация
02:39:04 Главная страница - api
02:59:01 Главная страница - карусель
03:26:31 Компонент ErrorMessage...
Просмотров: 5 820
Видео
#9 ПРИЛОЖЕНИЕ С ЗАМЕТКАМИ на Javascript (NotesApp JS)
Просмотров 9 тыс.2 года назад
Проект на Javascript - Заметки js / NotesApp js ⭐️ Инфо для проекта: cdnjs.com/libraries/font-awesome ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
#8 Github API поисковик на Javascript
Просмотров 6 тыс.2 года назад
Проект на Javascript. Воспользуемся github api для получения данных о пользователях. ⭐️ Инфо для проекта: docs.github.com/en/rest/users/users#get-a-user ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
#7 ГЕНЕРАТОР ПАРОЛЕЙ на Javascript (Password Generator JS)
Просмотров 4,8 тыс.2 года назад
Проект на Javascript - Генератор паролей js / Password Generator js ⭐️ Инфо для проекта: www.w3schools.com/howto/howto_js_copy_clipboard.asp ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
#6 Пишем ПАГИНАЦИЮ на Javascript (PAGINATION JS)
Просмотров 24 тыс.2 года назад
Проект на Javascript - Пагинация js / Pagination js ⭐️ Инфо для проекта: jsonplaceholder.typicode.com/ ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
#5 МОДАЛЬНОЕ ОКНО на Javascript
Просмотров 12 тыс.2 года назад
В этом видео мы напишем учебный проект на Javascript - Модальное окно. По практикуем взаимодействие с API и Document Object Model. Поехали! Этот видео урок подойдет новичкам, которые уже познакомились с Html, Css, Javascript и знают, что такое Document Object Model (Dom). ⭐️ Инфо для проекта: kinopoiskapiunofficial.tech/ api key: 8c8e1a50-6322-4135-8875-5d40a5420d86 ⭐️ Код из видео: github.com/...
#4 Пишем КИНОСАЙТ на Javascript
Просмотров 66 тыс.3 года назад
В этом видео мы напишем учебный проект на Javascript - Киносайт или Movie App. По практикуем верстку, взаимодействие с API и Document Object Model. Поехали! Этот видео урок подойдет новичкам, которые уже познакомились с Html, Css, Javascript и знают, что такое Document Object Model (Dom). ⭐️ Инфо для проекта: kinopoiskapiunofficial.tech/ api key: 8c8e1a50-6322-4135-8875-5d40a5420d86 ⭐️ Код из в...
#3 Получаем картинки с помощью API Javascript
Просмотров 30 тыс.4 года назад
Напишем учебный проект на Javascript, в котором разберемся, что такое API и Fetch на примере котиков. Этот видео урок подойдет новичкам, которые уже познакомились с Html, Css, Javascript и знают, что такое Document Object Model (Dom). ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
#2 Счетчик на Javascript
Просмотров 8 тыс.4 года назад
Напишем учебный проект на Javascript, на котором будет счетчик. Этот видео урок подойдет новичкам, которые уже познакомились с Html, Css, Javascript и знают, что такое Document Object Model (Dom). ⭐️ Видео про DOM на моем канале по ссылке: ruclips.net/video/4nq-0QUY1ZA/видео.html ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ⭐️ Мои соц. сети Инстаграм: adam_ba...
#1 Меняем фон на сайте Javascript
Просмотров 24 тыс.4 года назад
Напишем учебный проект на Javascript, который изменяет Background на страницу при клике на кнопку. Этот видео урок подойдет новичкам, которые уже познакомились с Html, Css, Javascript и знают, что такое Document Object Model (Dom). ⭐️ Видео про DOM на моем канале по ссылке: ruclips.net/video/4nq-0QUY1ZA/видео.html ⭐️ Код из видео: github.com/balkoev/10-javascript-vanilla-projects ruclips.net/vi...
Fullstack за 3 месяца. Реальный кейс от выпускника школы программирования Elbrus BootCamp.
Просмотров 4,4 тыс.4 года назад
В этом видео мы пообщаемся с основателем elbrusboot.camp Поговорим с HR коучем, который даст советы для Junior разработчиков. Так же пообщаемся с выпускником, который после трёх месяцев обучения нашел работу на позицию Junior Frontend разработчика. Приятного просмотра! ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
Школа 21. Школа программирования. Глазами студента.
Просмотров 15 тыс.4 года назад
В этом видео я взял интервью у своего друга и студента школы программирования 21. Как стать программистом? Это один из путей. Он учится больше года в школе и ему есть, что рассказать! ⭐️ Ссылки Школа Elbrus: elbrusboot.camp/ Иснтаграм Далер: dalerlive Скриншоты: ibb.co/Fqz6cb3 ibb.co/d2J9LcM ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
Парсим сайт с помощью NodeJS, Cheerio
Просмотров 22 тыс.4 года назад
В этом видео мы рассмотрим библиотеку Node.js, Cheerio, которая является jQuery-подобным инструментом для сервера, используемого в веб-парсинге. ⭐️Подпишись и поделись видео с друзьями! ruclips.net/channel/UC4mIMZhNbSFzl38eE_xGJcA ⭐️ Ссылки Github: github.com/balkoev/cheerio-js-example ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
УЧИМ CSS ЗА 20 МИНУТ! [2020]
Просмотров 7 тыс.4 года назад
Хочешь научиться работать с CSS (Каскадные Таблицы Стилей)? Тогда смотри видео до конца! ⭐️Подпишись и поделись видео с друзьями! ruclips.net/channel/UC4mIMZhNbSFzl38eE_xGJcA CSS - формальный язык описания внешнего вида документа, написанного с использованием языка разметки. ⭐️ Мои соц. сети Инстаграм: adam_balkoev Вконтакте: adam_balkoev
Что такое DOM? На примере реальной задачи JS!
Просмотров 22 тыс.4 года назад
Хочешь научиться работать с DOM (Document Object Model)? Тогда смотри видео до конца! ⭐️Подпишись и поделись видео с друзьями! ruclips.net/channel/UC4mIMZhNbSFzl38eE_xGJcA DOM или Объектная Модель Документа, предосталяет возможность взаимодействовать программисту с веб страница при помощи JavaScript. Видео рассчитано для новичков в программировании. ⭐️ Ссылки Код из видео: github.com/balkoev/js...
6 практических советов по JS коду! [2020]
Просмотров 5 тыс.4 года назад
6 практических советов по JS коду! [2020]
Учим JavaScript за 1 час! Как стать программистом. [2020]
Просмотров 43 тыс.4 года назад
Учим JavaScript за 1 час! Как стать программистом. [2020]
Какой язык программирования учить новичку в 2020?
Просмотров 43 тыс.4 года назад
Какой язык программирования учить новичку в 2020?
19:12 , 26:52 , 33:12 , 56:51 , 1:07:13 , 1:15:18 , 1:45:14 , 1:56:30 , 2:05:53 , 2:09:01 , 2:10:30 , 2:27:17
После того как создал хук.Пришла такая ошибка.Cannot destructure property 'countries' of 'useSelector(...)' as it is undefined.Что только не делал.Проверил все.Безуспешно
Спасибо! А то что картинки к фильмам разных размеров это нормально?) ну типо с бэка картинки одной высоты должны быть или тут в верстке опустили этот момент? Ломаю голову как сделать верстку. Карточке задать ширину 215px картинке width/maxwidth 100%. А высоту как в этом случаи задавать, фиксированное значение? И названию фильма поставить flex grow 1 на случай если название длинное чтоб расширялся элемент.
после 2 часов 16 минут после вкладки комиксы фильмы не отображаются. Везде request url правильный и response 200, но после комиксов сам response пустой ({"total":0,"totalPages":0,"items":[]}). Подскажи, пожалуйста, в чем может быть дело. Спасибо
Вы нашли в чем проблема? У меня так же, но я думаю это проблема самого сервера, раз он присылает пустой массив.
@@ilyailya8363 Там дальше правда ничего нету. Видимо API изменился. Если его код скачать, то тоже не показывает
3:08:57 "Cannot destructure property 'countries' of 'useSelector(...)' as it is undefined." не видит данные из стора, уже все перепробовал. До этого работало все... И вторая проблема не ниже вампиров не появляются карточки. Перепроверил, все данные на сервере актуальные, в нетворк все приходит. Просто не рисует.
та же проблема
Вы нашли решение?
@@ЕгорФедоткин-я4ис толкнулся с такой же проблемой
Здравствуйте, спасибо вам за этот урок. Но не могли бы вы помочь у меня проблемы с видео-плеером, сделала все в точности как у вас и в первый раз все отработало корректно. Открываю проект через пару дней и в консоли постоянно вылазит ошибка: Cannot read properties of null (reading '1') в Network показывает 307 статус и говорит что присходит переадресация. С чем это может быть связано?
У меня кажется тоже такое иногда бывает, скорее всего проблема в плеере. Сейчас работает?
@ нет, но может ли это быть из за того что бесплатный тариф у плеера и есть ограничения?
спасибо большое за это видео и за Ваш труд сам пишу на реакте, но до этого уровня мне ещё пыхтеть и пыхтеть
Если Вы осилили это видео, то я верю, что у Вас обязательно все получится!)
Он говорил, что изучал питон параллельно с си. Это просиходило в стенах школы или же вне?
Спасибо большое за интервью, правда, мужчина с бородой постоянно перебивал Далера, не давая ему закончить важную мысль, но тем не менее спасибо!)
Хотелось бы больше объяснений, но и за такой труд большое спасибо, я наконец его закончила. Делайте ещё, часов на 20))
Супер . было бы круто сделать отдельный плейлист улучшений.У одного американского блогера есть такая рубрика . Он делает сайт так же чуть ли не 10 ч . А затем пару коротких роликов улучшений . Допиливал сайдбар , переделывал авторизацию
Спасибо за этот бесплатный курс. Продолжайте также дальше🥰🥰🤩
Спасибо тебе большое!
можете подсказать, хочу к нг разработать свой сайт для себя тоже мини кинотеатр, Суть вопроса: Я понимаю что не практично создавать каждую страницу с отдельным фильмом, но можете подсказать как сделать так, как у вас, т.е разные плееры которые не утратят много памяти на сервере и т.д
vscode перестал показывать ошибки. Например, когда только объявляем Navbar 27:53 у вас показывает ошибку, т.к. компонента такого еще нет. У меня нет ошибки, хотя компонента не существует
Попробуй выгрузить vscode и заново запустить, он иногда может подвисать.
Пофиксил. Вместо { languageOptions: { parserOptions: { ecmaFeatures: { jsx: true } } } },, был ...parseOptions. Вдруг кому пригодится
Спасибо за доступное объяснение на примере! ❤🔥🔥
Спасибо! То что мне было надо, чтобы воткнуться для начала, без бла-бла-бла.
А если в файле джейсон вскода нету этих настроек?То как их туда добавить
Ctrl+Shift+P -> User settings Или ты про другое?
@@balkoev ,да за это,вот только в сетинг,не как не могу найти
Спасибо) а что лучше и лаконичней использовать RTK query или React query?
Хороший вопрос, мне не приходилось работать с React query. Мне кажется +\- одно и тоже получится.
У меня в консоли сайта нечего не пишет, по типу 22:31, и остальное. у меня показывает ошибку с app.js, не в коде а с файлом, я не понимаю что делаит
решил проблему?
@РустамАетбаев-р4к та я забил в тот же день
@@COMABAR жалко
можно же сделать намного проще
<div class="btn-wrapper"> <button id="btn">Change background</button> <div class="title"> <p id="title"></p> </div> </div> <script> const btn = document.getElementById("btn") const background = document.body btn.addEventListener("click", function changebck() { let randomColor = "#" + Math.floor(Math.random() * 16777215).toString(16) let title = document.getElementById("title") background.style.backgroundColor = randomColor title.textContent = `${randomColor}` }) </script>
сделай аналог рутуб, или ютуб)
Рад видеть вас снова. Смотрел ваши видео и по несколько раз - принесли много пользы) Буду смотреть и это конечно!
Ждём такой курс на typeScript
Автор просто топ, ЖГИ 🔥🔥🔥🔥
Чувак ты лучший ❤ , жду новых видео
😂😂😂 и всё ровно не получилось сделать копию. Топорно работает
ой как же рад видеть тебя, ты самый лучший мужик. Спасибо за крутой контент!
спасибо 🙏
Адам, гIалгIай ви хьо?
Ва
@@balkoev👍 я тебе в телегу написал
футболка классная, классика!
Реально круто и легко)
почему 21? Потому что очко.
Отличный пример, спасибо. Методом тыка понял, что месяца в countdownDate отсчитываются с нуля, те Январь === 0
Я чуть истерить не начал
Спасибо за труд и время. Прошел курс Яндекса, но именно таких практически работ не хватает!👍
В Яндексе же делают проекты для портфолио. Разве вы не делали?
Спасибо за урок
.btn { background-color: transparent; padding: 8px; border: 2px solid #222; border-radius: 5px; font-size: 16px; letter-spacing: 1.5px; color: #222;outline: none;cursor: pointer; transition: 0.275s ease-in} .btn:hover {background-color: #222; color: #fff;} и в hover белый цвет можно указать и не 6тьмия ffffff а всего 3 fff и не надо ставить transition (all) без all надо просто так как элемент один
А зачем ты вписал transition в .btn:hover если по факту его нужно вписать в .btn так как при входе мышке у тебя будет медленно а при выходе быстро но если transition вписать в btn то вход будет плавный и выход будет плавный то есть:
Это не благотворительность, а подбор и обучение персонала
А где же продолжение? Очень хорошо объясняешь :(
Спасибо большое. JS - это моя боль!
объяснение хорошее, видно что парень знает своё дело)))
Всем привет доброго времени суток, есть фигма этого проекта ?
Ошибаешься: твое решение как раз таки самое оптимальное из всех что я нашел на ютубе! И именно по этой причине я здесь!)
а где стрелочки и многоточие вместо большого количества страниц?
А если сделать end = rowPerPage * page start = end - rowPerPage Это же будет работать? По моему должно
спасибо за уроки 🤝
Спасибо за отличный урок!
Половина видео - настройка стилей(