JavaScript для Начинающих 2022 (Полный курс за 2 часа)
Рет қаралды 26,161
Күн бұрынИсходный код: t.me/stackdevru/28
Telegram: t.me/stackdevru
00:00:00 - Вступление
00:02:56 - Настройки браузера и VSCode (тема + Live Server плагин)
00:05:24 - Где мы будем писать наш код JavaScript (добавляем файл)
00:10:41 - Переменные в Javascript (var, let, const)
00:15:30 - Типы данных в JS
00:24:35 - Булевая логика + операторы сравнения
00:28:10 - Условия в JS
00:38:32 - Функции
00:50:26 - Массивы
00:58:35 - Объекты
01:12:49 - Циклы
01:19:31 - JavaScript DOM (Document Object Model)
01:35:05 - Обработчики событий JS
01:39:50 - Асинхронность
Дополнительные видео:
1) Создание переменных: • ES6 #1. Let, Const и V...
2) Функции (механизм "поднятие"): • Уроки Javascript #3. П...
3) Функции (сравнение стрелочных и обычных функций): • ES6 #2 - Стрелочные фу...
4) Массивы (главные методы часть 1): • Урок Javascript #8. Ме...
5) Массивы (главные методы часть 2): • Урок Javascript #9. Ме...
6) Как копировать объекты и массивы: • Уроки Javascript #6. О...
7) Объекты (оператор опциональной цепочки): • #12. Optional Chaining...
8) Объекты (что такое прототип): • #11. Что такое prototy...
9) Объекты и значение THIS: • #10. Bind, call, apply...
10) Классы + прототипное наследование: • ES6 #13. Все о Классах...
11) Сравнение циклов: • ES6 #11. Цикл for...of...
12) Работа с DOM: • Уроки Javascript #5. К...
13) Обработчики событий: • Уроки Javascript #1. О...
14) Объект событие: • Уроки Javascript #2. О...
15) Асинхронность (Промисы): • ES6 #12. JavaScript Pr...
Немного практики:
1) Создаем анимированные ссылки: • Создаем Анимированные ...
2) Работаем с Local Storage: • Уроки Javascript #7. L...
3) Создаем "брауновское движение": • Javascript Практика 01...
+ Важный момент!
Когда-то очень давно, добавление любого функционала JavaScript на страницу - происходило внутри тэгов Script (как в этом курсе).
Сегодня базовая структура любого проекта на JS - состоит из так называемых модулей и большого количества разных пакетов (зависимостей).
Для того чтобы собрать проект, который состоит из нескольких модулей - используется сборщик Webpack.
Также, сегодня везде используется так называемый транспайлер кода под названием Babel - который решает проблему совместимости новых фич JS в старых браузерах.
4 Видео, где мы используем Модули, Webpack & Babel для создания базовой струкутры современного проекта на JS:
1) Структура + Зависимости: • ES6 #07. JS Модули 1: ...
2) Настраиваем Webpack + Babel: • ES6 #08. JS Модули 2: ...
3) ES6 Import: • ES6 #09. JS Модули 3: ...
4) Практика с ES6 Модулями: • ES6 #10. Модули Javasc...
Мои Курсы:
Gatsby JS (полный курс): gatsbyjs.ru
React для начинающих: react001.ru
Все мои курсы (+ исходные файлы): stackdev.ru
Подписывайся на соц сети:
Telegram: t.me/stackdevru
VK: vasilymur
Instagram: / vm_online
Мой блог о веб-разработке: stackdev.blog
@Alex-xf2dd 2 жыл бұрын
Василий, спасибо за видео!
@OptimistStoik Жыл бұрын
Доброго здоровья, Василий! Приятно было узнать краткое по : var, let, const. Обычно многие Гуру игнорируют разъяснение мелочей, а на них ведь строится и главное. И потом использование редактора в конкретных целях отладки программ, тоже понравилось. Успехов в Ваших делах! Спасибо!
@caveofmovies8597 2 жыл бұрын
сходу лайкнул годноту!
@user-jq6tr6rr8v 2 жыл бұрын
Спасибо большое! Еще бы здорово задачник с разбором по каждой теме для закрепления материала.
@valentynazhuravlova6902 2 жыл бұрын
Спасибо огромное за Ваше время и материал) бесценно для начинающих) А ещё приятнее учить когда преподаватель распологает к себе)
@stackdev 2 жыл бұрын
Спасибо большое!
@alexidino 2 жыл бұрын
Топ, спасибо) предвкушаю потрясающуй подачу! Сам на 14 видео по реакту, буду смотреть параллельно.
@stackdev 2 жыл бұрын
Спасибо!
@kinomir20 Жыл бұрын
Спасибо! Теперь понял, что такое промисы
@vladimirpuzey713 2 жыл бұрын
Давно, не было новых видео - класс 👌
@stackdev 2 жыл бұрын
Спасибо!
@vladimirpuzey713 2 жыл бұрын
@@stackdev ещё раз спасибо за видео! Наконец-то получил обьяснение в чём разница между else if-ами и условиях на if-чиках.
@-Vladimir-- 2 жыл бұрын
Как всегда на высоте!
@stackdev 2 жыл бұрын
Спасибо!
@rostyslavkinash5232 2 жыл бұрын
Спасибо за урок
@stackdev 2 жыл бұрын
Спасибо за поддержку!
@dobrMAV 2 жыл бұрын
Огромное спасибо за курс! Начинаю проходить,хочется научиться понимать и уже самостоятельно применять JS ,пока для меня JS загадка .
@stackdev 2 жыл бұрын
Главное - не отступать.
@dobrMAV 2 жыл бұрын
@Ultra Cheburek учу,непросто,но буду продолжать.
@NailIsmailov 2 жыл бұрын
Шикарное видео. Буду рекомендовать всем начинающим ваш канал. Спасибо за прекрасное и доступное обьяснение.
@stackdev 2 жыл бұрын
Спасибо!
@olgafedyanova Жыл бұрын
привет Nail. Надеюсь у тебя всё хорошо.
@NailIsmailov Жыл бұрын
@@olgafedyanova Все отлично) ответил в фейсбуке)
@sashavlazyk8504 2 жыл бұрын
Просто, интересно, без воды. 👍
@stackdev 2 жыл бұрын
Спасибо!
@therelaxingsound6903 Жыл бұрын
Чудесно объясняете, спасибо Вам большое! Все по полочкам, никаких излишних усложнений. Но лично мне очень не хватает закрепления материала задачами. Алгоритм понятен, но именно ступор в том чтобы правильно записать и не запутаться в названиях, скобочках и стрелочках. Было бы классно по каждой теме несколько задач из codewars например. п.с. сделала отличные конспекты по вашему ролику 😊
@stackdev Жыл бұрын
Спасибо!
@AntonioBenderas Жыл бұрын
1:39:00 а можно в колбек функцию передать параметр и внутри неё методом forEach перебрать массив картинок, например галереи?
@TeomunMete 6 ай бұрын
Не всегда можно писать стрелочные функции в одном строке. Вы все это так знаете. Писал ради комментарии 😊
@andreygrachev8573 2 жыл бұрын
Хорошая подача материала, без "воды'. Пописывал чуть на стороне сервера под nodjs, а с этого урока наконец пришёл ликбез на стороне браузера.
@stackdev 2 жыл бұрын
Спасибо!
@alexforos5425 Жыл бұрын
👍👍👍
@stackdev Жыл бұрын
Спасибо!
@runaruni898 Жыл бұрын
✌👍👍👍
@welcomebrat 2 жыл бұрын
Хочу все знать
@stackdev 2 жыл бұрын
Спасибо!
@ignativanopulo7037 2 жыл бұрын
Теги ... лучше вообще помещать после закрывающего , перед закрывающим . Браузер всё равно перебросит их перед , но визуально, при написании кода, приятней когда ... не смешивается с обычными тегами.
@slavkapiyavka 2 жыл бұрын
где тег написан, там он и останется, ничего браузер не перекинет самостоятельно
@mikhailburtsev3697 2 жыл бұрын
@@slavkapiyavka самостоятельно попробуйте написать, например, тег между и , и открыть структуру страницы через инспектор кода. Всё добавится внутрь 👍.
@ignativanopulo7037 2 жыл бұрын
@@slavkapiyavka А вот и перекинет !
@user-ug6cp5bs9d 2 жыл бұрын
ребят я тупой, и хоть убейте мне не понятны эти основы, объясню почему. Мне не понятно потому что, я не понимаю область применения этих самых основ, читаю тот же МДН, для меня как смотрю в книгу вижу фигу, в ютюбе полно всяких курсов с основами ЖС, и смотря эту информацию, я не понимаю что и для чего, как это работает, для чего те или иные вещи нужны, и самое главное как это всё применяется? Примеров наглядных нету. Скажите мне, я один такой и ни че не понимаю? Или таких как я много? А то аж обидно как то)
@stackdev 2 жыл бұрын
Вы поднимаете важный вопрос! Я добавил в видео пару ссылок с небольшими практическими проектами.
@alexidino 2 жыл бұрын
Все так начинают, я тупо долбил практику на learnJS 2 месяца, мне помогло стартануть здесь в плейлисте для начинающих. Просто учи и все придет само со временем. Освоить может любой, главное упорство. Другое дело, что крутым спецом станет не каждый. Посмотрел тайм коды, просто заучивай что дается в этом видео, дальше иди в плейлист JS для начинающих и пазл начнет складываться.
@stackdev 2 жыл бұрын
@@alexidino Я бы еще добавил, что понятие "крутой спец" - в разных компаниях отличается (также как и понятия Senior, Middle или Junior)... Senior в небольшом российском стартапе - это не Senior в Google в штатах.... Я к тому, что работы сейчас много для всех....
@alexidino 2 жыл бұрын
@@stackdev Да и это радует. Под крутым имел ввиду талантливого человека)
@gomuncool1004 2 жыл бұрын
Нужно начинать с того как работает интернет и его протоколы, потом изучить html, CSS. Далее dom дерево - это и есть то как js взаимодействует с html. И тогда только вы узнаете 1 процент от этого языка)))
@user-ev5tj4vj5k Жыл бұрын
А я думал тоже что я один такий тупой. Начал с HTML, CSS как то все легко понял, изучил. Думаю так ничего сложного нету, все так легко мне идёт. И тут начал просматривать js уроки, на разных Ютуб канал, просмотрел больше 10а, и понял что нифига все равно не понимаю. Вроде как бы понимаю, но что где куда так и не понимаю как применять
@Mark-ry9lu 2 жыл бұрын
У меня только один вопрос! Почему у тебя так мало подписчиков???
@stackdev 2 жыл бұрын
:)) Работаю над этим
@novichok3417 2 жыл бұрын
А кто сказал хоть раз спасибо токарю, фрезеровщику, водителю и тд ?
@user-ml2kt1rr4o 2 жыл бұрын
В чём логика константу называть переменной? Это запутает только. Она на то и константа, что ее значение нельзя изменить.
@ambitious9940 2 жыл бұрын
типы данных, а залез в массивы. Нет чтобы показать преобразования? закрыл урок
@SteamStyle Жыл бұрын
Классный курс, вот смотрю его и натолкнулся на то, что пишу как у вас if (car.engine) { console.log(car.engine.type) }; и он его все равно не видите и пишет Uncaught ReferenceError: car is not defined at :1:1
@chikenmacnugget Жыл бұрын
полная дезинфа как работает язык, чел ни разу оф спеку не открывал. Сидит фантазии свои рассказывает
Василий Муравьев
Рет қаралды 160 М.
Pomazkov JS
Рет қаралды 23 М.
Dharni
Рет қаралды 26 МЛН
[36] Event Delegation (Делегирование событий) | JavaScript | [Подготовка JS разработчика к интервью]
Developer In US
Рет қаралды 906
BrainsCloud
Рет қаралды 392 М.
Василий Муравьев
Рет қаралды 3,1 М.
DKA-DEVELOP
Рет қаралды 261 М.
Dharni
Рет қаралды 26 МЛН