Выполняем реальный проект на JavaScript | ч.1
ฝัง
- เผยแพร่เมื่อ 12 ม.ค. 2025
- В этом ролике мы начинаем работу над реальным проектом, который заказчик просит "оживить" с помощью языка программирования JavaScript. Все нужные материалы и ссылки для работы ниже.
Понравилось видео - подписывайся на канал: / @campfireschool
================================
Ссылки:
Скачиваем исходники проекта - drive.google.c...
Техническое задание - docs.google.co...
Готовый код этого урока - github.com/yan...
Обязательно к установке (Node.js) - nodejs.org/en/
Что такое npm - habr.com/ru/po...
Что такое gulp - getinstance.in...
Проверить поддержку браузеров - browserl.ist/?...
Что такое модальное окно - ru.wikipedia.o...
DOMContentLoaded - developer.mozi...
CSS overflow - htmlbook.ru/css...
Одни из лучших и доступных курсов по JavaScript, верстке (html/css), React, Wordpress и многому другому вы найдете на campfire-schoo...
Мой инстаграм - / petrychenko_ivan
Телеграм-канал: t.me/petrychen...
Реализация реальных проектов - это то, чего не хватает русскоязычному контенту. Спасибо, не жалею что подписался.
Ооо даа, это именно то, чего мне так сильно не хватает - практики! Спасибо большое за уроки, Иван!
Наконец-то нашел тебя, уже изучил основы и основы основ, но как применять это все толком не представлял, и долго искал как создается реальный проект. Спасибо большое за вашу работу, буду смотреть дальше если не забросишь))
не смотря на то, что я только изучаю JS, да FrontEnd в общем, просмотрел все и мотивацию словил))) Спасибо
Это лучшее, из того что есть на Ру Ютубе.
Друзья, этими видео круто подкрепить курс Ивана по JS, который на Юдэми. Я купил и очень даволен. Особенно в связке теория - практика. Рекомендую.
P. S. Это не реклама. Ванек, а тебе огромное спасибо за твой труд.
Спасибо :)
Большое тебе человеческое спасибо, Иван. Ты лучший!
Практика на реальных проектах, это то что не хватало этому каналу. Ведь именно так можно чему-либо научиться. Очень надеюсь что таких видео будет очень много (много живых, реальных примеров). Как всегда подача материала на высоте, реально всё доходчиво и понятно! Спасибо Иван за старание!!!
Красавчик Вань! Почти закончил смотреть твой курс по js. Вот это то, что я искал после. Закрепить свои знания перед переходом к реакту.
Сейчас такая же ситуация, ещё не дошёл до реакта, но будет полезно закрепить знания.
За 2 года спустя как ты оставил свой комментарий многое прошло... Если не против, можешь рассказать, получилось ли устроиться frontend-ером? И кем сейчас работаешь?
@@flakeroo а у тебя?
@@Ramazannegma Привет, начинал в то время изучать реакт, уже успел его забыть. Ушёл в учёбу, поступил в университет, РТУ МИРЭА. Понимаю, что учёба всё равно в основном самостоятельная и то, что учил раньше, как-никогда пригодилось. Если хочешь чему-то научиться, делай это сам и не бросай
@@flakeroo понял принял) а сколько тебе лет?
@@Ramazannegma 17
Отлично, подобные примеры очень помогают и нужны. Спасибо большое, не забрасывайте данный плейлист )
Очень здорово! Как всё легко и играючи) с отличными подробными комментариями. Мне зашло. Вроде бы всё, что ты уже делал и раньше самостоятельно, но четко, аккуратно, системно! Спасибо! Помогает привести знания в систему и увидеть некоторые вопросы более глобально
Ваня, большое спасибо за хороший и нужный материал. Побольше подобных видео с разбором реальных задач из жизни, а не - голой теории. Спаибо
Огромное спасибо за данный контент. Действительно все очень ясно обьясняеться, без лишней воды и лишних разжевываний. Но что самое главное видно, что код автора надежный и правильно структурирован.
Отлично, практика на реальных задачах, то что нужно. Хорошая подача, лойс.
Это именно то, что нужно!
Вот это топовая задумка, пройду Ваш курс на удеми и займусь выполнением практики из этих заданий!
Очень классный и качественный урок. Понравилась подача, тембор и разбор. Большое спасибо!
Реальная практика.. То что нужно. Купил у автора курсы на udemy ) и тут смотрю )
Спасибо за твои труды. Прохожу твои курсы с юдми) Отлично получается объяснять.
Смотрю все твои видео. Иван, ты реально молодец. Классная подача, классный контент. Спасибо и удачи тебе! )))
Отличный рассказ , подписчики где вы ? Реальный боевой парень💪
Ваня как всегда красава! Я еще предыдущий курс по JS не прошел, а ты уже новый запилил)
Иван, спасибо!
в двойне тяжелее учить JS имея основное место работы не связанное никак с программированием, но легких путей я не ищу)
рад что с тобой Иван это у меня получается.
Как успехи?
@@Ycepego 🔥
Поддерживаю, с 8 до 17 работа, с 18 до 22 учёба программированию... С перерывами конечно, т. К. 2 месячный ребенок... Идем к мечте сменить работу на более интересную
@@ruslansnarovkin5227 получилось?
@@js.addiction привет! Как продвигается? Получается?
Спасибо за такой годный контент. Лайк)
Спасибо тебе мужик, спасибо что есть такие программисты как ты
Это Мега круто! Я новичок и учусь по вашим курсам. Нравится подход, речь. Я конечно далек пока от таких заданий, но с интересом смотрю, что и как мне предстоит делать в будущем! Спасибо вам Иван.
Бро, спасибо огромное за то, что ты это для нас делаешь!
Выглядит очень вкусно, особено тех задание
Замечательный контент, отличная подача, смотрю с удовольствием :) Спасибо за видео!
Привет, я и на юдеми на твои курсы записался и здесь смотрю!) Крутой учитель и крутой контент!! Удачи
Можешь скинут?)
Саму ссылку на нее
Привет сам в начале пути, Как успехи??
@@smittychannel3252 я промолчу)
@@oleksandrvorzhev5026 так и не скинул ссылку
Большое спасибо за конфигурационный файл gulp - сильно помог!
Это супер урок! Спасибо вам огромное за такую отлично изложенную практическую информацию!!!!!!!!
Спасибо за контент! Это именно то что нужно было!)
Самый лучший канал по обучению программирования 👍🏻👍🏻👍🏻👍🏻
Спасибо)
Вы гений, спасибо, что Вы есть
Спасибо! Отличные уроки)
Это очень круто, потренироваться на реальном заказе. Спасибо!)
Спасибо большое, то что нужно!
Спасибо! Отличный материал,шикарно объясняет суть необходимого.
Взял у вас курс JS+React от 0 до результата. Надеюсь я когда буду его проходить, все в этом пойму) Сейчас смотрю это и мозг «правиться» )
Я ваш ученик в udemy! Мне покупал мой брат) мне 15 мне нравится ваш обеснение очень круто я тоже хочу стать тоже крутым программистом как вы🙂
Как всегда неподражаем! ТОП!
спасибо у тебя крутые уроки )))
смотрю ваш курс на юдеми вот решил и этот плейлист глянуть!
Отличные уроки! спасибо
Спасибо за видео, в ютуб и правда одни верстальщики, такие проекты редко встречаются.
Владислава Минина посмотрите, тоже крутой преподаватель.
Очень хорошо и понятно все объясняешь, лукас
Хороший урок . Спасибо
Супер! Спасибо)
Спасибо друг ! За полезный урок.
Ну наконец то уроки не для умственно отсталых, а годный материал чтобы увидеть как оформляется нормальный проект. Так держать.
Братишка, ты крут ✊ Лайк, подписка
Круто! Спасибо за познавательный контент!
Привет и спасибо за вменяемую инфу. Очень классно
Жду продолжения
Ivan, thanks a lot!
This is quite helpful video for JS practice!🔥
I've found what I want! Brilliant💪
спасибо за видео спасибо за твои труды очень круто ))
Лайк и подписка. Отличный урок
Хорошая подача. Спасибо за видео. Лайк и подписка)))
Спасибо за Ваш труд
Друзья, у кого выкидывает ошибки при написании слова gulp в терминал, Вам нужно сначала установить gulp как глобальный пакет и далее запускать его, пишите команду в терминале:
npm install gulp-cli -g
Ждёте пока пакетный менеджер установит его и далее уже прописываете в терминал:
gulp
Всем Добра у Удачи!
капец куча вариантов перебрал и все равно не сработало ))))))))
Там выдаёт ошибку в task build js, глобально gulp установлен
@@oskaldev для мака в терминале написала : "sudo npm i gulp -g". sudo для пропуска команды от лица администратора. До этого gulp не устанавливался)
@@Алла-н5г спасибо, с той проблемой уже давно всё решил
Иван, большое спасибо за крутой урок. Отдельное спасибо, что подробно объяснил вначале по скриптам сборщиков! Интересно, за сколько ты выполняешь такой таск в рабочем режиме - без объяснений и примеров?
Рад помочь :)
Не засекал, но вот эти таски довольно быстро. Дальше по урокам будет уже сложнее)
Для новичков самое то. Но написано не так чисто как хотелось бы видеть от человека который обучает других людей
@@sergkyrios нихуя не понял что ты написал, но очень интересно.
@@sergkyrios 😅
Больше подобного!!!!!!!!!!!
Хотел после начального курса по JS углубиться в язык. Часов пять ушло на то, чтобы: установить node,npm, разобраться почему не устанавливаться gulp, настроить виртуальную среду в powerShell, пару тройку раз снести и загрузить проект, понять, что все равно ничего не работает, узнать и углубиться в nvm, все снести для его установки, установить его, потом понять, что он тоже не работает, после этого все-же разобраться и запустить через него node.js наконец (!!). И в конце, как вишенка на торте, увидеть что в html в теге скрипт написал src='main.js'.....ну, завтра можно будет приступить к проекту.
не получается чего-то. После команды gulp выдает ошибку
как офигенно.
Привет, спасибо за урок. Насколько я вижу последняя задача не доделана, после появления модального окна (через 60секунд) крестик и фон не будут закрывать его. Нужно добавить обработчики событий для них
Если бы я бы взял бы этот заказ он был бы для меня идеален, ибо посмотрел тз и понял что делать мне тут нечего так как я уже реализовывал подобный проект)
Очень достойное разъяснение. Автор большой молодец.
Иван, раз уж речь про модалки, то расскажите пожалуйста как наиболее просто решить проблему с прокруткой контента под оверлеем на Safari? Там простого overflow hidden недостаточно и страница прокручивается
Странно у всех все хорошо, а у меня ничего не получилось. Сделал первый урок кликаю по кнопке ВЫЗВАТЬ ЗАМЕРЩИКА и никаких popup окон не появилось. Скачал готовый проект, Window_step_1 открываю в Google Chrome index.html и тоже самое кликаю по кнопке ВЫЗВАТЬ ЗАМЕРЩИКА, никаких действий нет, в консоли вижу этот объект, все правильно, все скрипты есть button class="header_btn , но по клику никаких действий не происходит. В чем может быть проблема ?
Столкнулся с такой проблемой . Вроде все зависимости установлены. Но неработает код. При нажатие на кнопки не открываются табы. С чем это может быть связано.?
Спасибо просмотрю!
Здравствуйте я ваш студент на Udemy!😅😅😅
Привет :)
@@campfireschool а у вас менторство практикуется? после прохождения курса на Udemy хотелось бы практических задач побольше)
@@boycovclub добрый вечер. Пока нет, но если что-то изменится - сообщу в инстаграме)
Почему, когда я прописіваю в терминале "gulp" выкидывает ошибку?
Сам не знаю, но ошибка в таске build js, если подскажут как решить, толкни меня
У меня не запускается проект "gulp" почему? В чем может быть проблема?
исходники не работает команда gulp не работает
a na HTML / Pyton / XAMP ne delaeto etot projekt?
Nado offline Sait s media database i player (oflline - 10tb media danih)
18:34 окей, мы создали абсолютно левый файл и теперь вносим инфу в другой , а конечно понял , что через dist должно направить к main.js , но чет у меня не идет, так - же не работает gulp
аналогично ((((
на 17:22 кот мяукнул
Очень полезно, спасибо
HELP!!
Загрузил проект и дальше как как на видео было
1) npm i (все гуд, установилось все)
2) gulp -запускаю
но когда ввожу команду - gulp в терминале, то ошибка (bash: gulp: command not found)
Что не так делаю ??
А я все время думал что ТЗ это Требования Заказчика.
А это Техническое Задание)
Круто. Ваня, когда будет вторая часть?
Курашов Евгений залью через пару дней)
когда ты начал рассказывать про js код я резко понял что еще не дорос до такого
Добрый день. Появилась проблема с установкой npm. Установил Node.js, папка node_modules с npm внутри есть. В командной строке версию npm выдаёт. Но в терминале VS code выдает ошибку. Я канеш может чего то не понимаю, но я попытался даже установить node в папку с проектом, не помогло. Гугл тоже не помог. Путь в терминале правильный. Текст ошибки:
npm : Имя "npm" не распознано как имя командлета, функции, файла сценария или выполняемой программы. Проверьте правильность написания имени, а также наличие и правильность пути, после чего повторите попытку.
строка:1 знак:1
+ npm i
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
Руслан Халилов добрый день. Такое может быть по нескольким причинам:
1) если терминал внутри vscode - в верхнем правом углу выберите другой тип терминала. У Powershell бывают проблемы с npm
2) прописать в переменную среды PATH путь к папке nodejs (Мой компьютер - Свойства - Дополнительные параметры системы - Дополнительно - Переменные среды - Переменные среды для пользователя - Path - Изменить - Создать. В появившемся окошке вписать путь (в моем случае - C:\Program Files
odejs), сохранить и перезагрузить терминал.
@@campfireschool Спасибо
В чем смысл, не пойму, я купил такой же курс на юдеми, а тут все есть в открытом доступе...?
расширение vscode import cost при импорте пакетов пишет calculate какое то время, потом эта надпись пропадает, но размер пакета не показывается(
класс
gulp запускается! но чего то картинки не прогружаются, было у кого?
Иван
сделайте ролик по настройке VS Code хочу такие же настройки как у вас.
Спасибо!
при импорте slick-carousel и jqery пишет выдает $(document).ready(function () { где ready перечеркнуто в vs code
не запускает gulp что делать?????
19:06 команда gulp в терминале не распознана, не получается добавить файлы в папку dist, она пустая (((((((((((((((((((((((
такая же ошибка
@@Ramazannegma брат, я уже работаю
@@SNSDfOuкем ?
@@Inf11x очень крутым челом в бигтехе
Вот забавно, мне всегда было интересно, новички реально все знают что такое нпм галп и т.д., мне кажется что уже на этом этапе маиндблоу случится :)
Знают. Изучаю JS вторую неделю. Знаю и про галп, и про вэбпак, и про парсел и т.д.
@@phat80 Где изучаете
@@youtubecardinal7 странно, что человек, сидящий на ютьюбе, спрашивает такие вопросы ))) Да хотя бы тут. Уроков завались. Сразу, конечно, надо сказать, что естественно смотрю обычно англоязычные уроки, в русском сегменте полно шлака, трудно искать что-то приличное, так как у нас часто уроки записывают только ради денег, то есть пытаются брать количеством, не разбираясь в теме подробно.
@@phat80 Спасибо! Как ваши успехи с момента написания комментария? Что можете посоветовать новичкам?
@@youtubecardinal7 пал в степях украины...
Добрый день. Хотел поинтересоваться если возможно. Насколько реально освоить Яву на курсах , которые по продолжительности составляют месяц. Я без опыта и образования в этой сфере, курсы платные. Насколько реально понять эту сферу за месяц.
Иван, спасибо за такого рода уроки! Очень хочу поучиться на этом примере в частности, но при запуске gulp в терминале ошибка: /usr/local/lib/node_modules/gulp/bin/gulp.js:129
gulpInst.start.apply(gulpInst, toRun); галочка внизу начала слова apply и дальше TypeError: Cannot read property 'apply' of undefined. Хэлп, плиз!
Обязательно ли должен уметь это все делать джуниор ? я вот .например. сам бы не смог это сделать
Да, должен.
Круто
like!!
До меня все допереть не может ,с этими event . Function(e) {} ; не понимаю .