Сергей Константинов
Сергей Константинов
  • 28
  • 198 459
Что должен знать ДЖУНИОР Фронтенд разработчик в 2024? Необходимая БАЗА. Актуальный Roadmap!
Почти все роадмапы - большие доски миро с кучей технологий, которые в реальности даже не используются. Вопрос - зачем?
В этом видео я собрал только НУЖНОЕ для начинающего в IT.
Посмотрев это видео, вы узнаете:
- Что должен знать джуниор фронтен разработчик?
- Что учить, чтобы стать джуниор фронтенд разработчиком?
- Как быстро стать фронтенд разработчиком?
- Frontend Roadmap без воды, только нужное.
Мой телеграмм канал:
t.me/konstantinov_it
ССЫЛКА НА ПЛАН изучения разработки:
konstantinov-it.notion.site/Frontend-Developer-Roadmap-2024-f557e5682eb6491785fd63214754c013
00:00 - Вступление
00:29 - Структура плана
00:48 - HTML
02:06 - CSS
05:29 - JavaScript
09:29 - Инструменты
10:12 - Frameworks
13:09 - NodeJS
13:22 - Дополнительно
Переглядів: 917

Відео

10 Советов Эффективного Обучения
Переглядів 5794 місяці тому
Учеба является неотъемлемой частью нашей жизни, и чтобы изучать новые навыки быстрее и продуктивнее нам нужно делать это правильно. В этом видео я дам 10 советов, как учиться максимально эффективно и при этом не потерять мотивацию на следующий день. Мой telegram канал с полезными статьями и анонсами - t.me/konstantinov_it Статьи на тему изучения и нашего мозга: Как навсегда запомнить выученное ...
Игра на Phaser JS: #6 Механика боя. Рисование на Canvas. Работа с текстом.
Переглядів 1,5 тис.7 місяців тому
Мы продолжаем разработку игры на phaser.js и в этом видео мы реализуем механику боя, отрисуем полоску хп используя инструменты рисования на canvas, а также отрисуем счетчик противников в виде текста. Помимо, рассмотрим как вешать слушатель события на пробел для реализации атаки. Мой telegram канал - t.me/konstantinov_it Спрайты для игры - tiny.cc/hmcyvz Скачать Tilemap Editor - www.mapeditor.or...
Игра на Phaser JS: #5 Tweens API - Добавление Врагов, Механика Агро и Следования
Переглядів 1,1 тис.7 місяців тому
Мы продолжаем разработку игры на phaser.js и в этом видео мы добавим на сцену врагов (кабанчиков), посмотрим как анимировать объекты в phaser с помощью Tweens API, а также реализуем механику агро, как в world of warcraft и следование за персонажем. Мой telegram канал - t.me/konstantinov_it Спрайты для игры - tiny.cc/hmcyvz Скачать Tilemap Editor - www.mapeditor.org/ GitHub проекта - github.com/...
Игра на Phaser JS: #4 Физика, коллизии. Работа с камерой. Генерация карты
Переглядів 1,1 тис.8 місяців тому
Мы продолжаем разработку html5 2D игры на phaser.js и в этом видео мы поработаем с аркадной физикой в phaser, реализуем механизм коллизий, а также обновим карту с использованием инструмента случайной генерации. Мой telegram канал - t.me/konstantinov_it Спрайты для игры - tiny.cc/hmcyvz Скачать Tilemap Editor - www.mapeditor.org/ GitHub проекта - github.com/deeamtee/rpg-course 00:00 - Вступление...
Игра на Phaser JS: #3 Добавление Персонажа и Анимации
Переглядів 2,1 тис.8 місяців тому
Мы продолжаем разработку игры на phaser.js и в этом видео мы добавим персонажа на сцену, научимся работать с анимацией в phaser, а также работать с пользовательским вводом с клавиатуры. Мой telegram канал - t.me/konstantinov_it Спрайты для игры - tiny.cc/hmcyvz Скачать Tilemap Editor - www.mapeditor.org/ GitHub проекта - github.com/deeamtee/rpg-course
Игра на Phaser JS: #2 Создание карты в Tilemap Editor
Переглядів 2,1 тис.9 місяців тому
Мы продолжаем разработку игры на phaser.js и в этом видео мы создадим Tilemap карту игрового мира. Воспользуемся редактором tilemap editor и настроим синхронизацию с проектом и hot reload. Мой telegram канал - t.me/konstantinov_it Наборы тайлов - tiny.cc/hmcyvz Скачать Tilemap Editor - www.mapeditor.org/ GitHub проекта - github.com/deeamtee/rpg-course
Игра на Phaser.js + TypeScript. #1 Введение. Установка окружения, старт проекта.
Переглядів 3,3 тис.9 місяців тому
В этой серии роликов мы разработаем пиксельную RPG игру по вселенной Warcraft'a с помощью движка Phaser.js. Мы будем разрабатывать на языке TypeScript, и собирать проект с помощью Vite. Основная задача - на примере игры показать современный стек и подходы, использующиеся также в коммерческой разработке классических web-приложений. Мой тг канал - t.me/konstantinov_it Ссылки из видео: Установка n...
Работай с API правильно! REST, Swagger, RTK-Query - запись онлайн трансляции
Переглядів 3,2 тис.9 місяців тому
Как спроектировать правильный API, а также как кэшировать запросы, и как в этом поможет Redux RTK-Query? Как работать с документацией в команде и что такое swagger? В этом стриме Сергей Константинов и Зар Захаров подробно разобрали эти вопросы на примере разработки React приложения с RTK-Query. Подписывайтесь на каналы авторов и будьте в курсе следующих закрытых онлайн трансляций: Мой тг канал ...
Хук, который я использую во всех проектах! + TypeScript
Переглядів 73910 місяців тому
В этом видео вы узнаете, как написать свой кастомный react хук для дублирования состояния useState в локальное хранилище localStorage. А также разберём как его типизировать с помощью TypeScript. Ссылка на мой телеграмм - t.me/konstantinov_it Ссылка на видео про управление состоянием инпутов - t.me/konstantinov_it/21 Ссылка на исходный код хука - gist.github.com/deeamtee/16b7848fa130de33a63933a7...
Как научиться печатать быстро? Подробный гайд! (140 WPM)
Переглядів 145 тис.10 місяців тому
В этом видео я расскажу, как научиться слепой печати десятипальцевым методом, какие инструменты использовал я, а также почему этот навык слепой печати полезен для здоровья. Мой телеграм канал: t.me/konstantinov_it Статья про "метод фоновой обработки" - t.me/konstantinov_it/18 Ресурсы из видео: 1. typerun.top/#rus_basic - тренировка зон пальцев 2. www.keybr.com/ - отработка букв и сочетаний 3. m...
Brainfuck за 100 секунд 🤯
Переглядів 675Рік тому
Brainfuck - в прямом смысле слова, это взрыв мозга, особенно, когда встречаешь его впервые. В этом видео я расскажу о языке программирования brainfuck, его принципе работы и командах за 100 секунд. Интересный факт: Brainfuck может быть применен для решения задач, требующих ограниченное количество операций, например, для реализации работы релейного компьютера. Полезные ресурсы из видео: minond.x...
Топ 5 Советов Для Трудоустройства!
Переглядів 799Рік тому
Топ 5 Советов Для Трудоустройства!
Как работают методы массивов? Все тонкости и реализация под капотом.
Переглядів 438Рік тому
Как работают методы массивов? Все тонкости и реализация под капотом.
Как Reduce работает под капотом? Популярный вопрос на собеседовании по JavaScript.
Переглядів 696Рік тому
Как Reduce работает под капотом? Популярный вопрос на собеседовании по JavaScript.
Метод массивов forEach | НЕ путай с циклом for
Переглядів 546Рік тому
Метод массивов forEach | НЕ путай с циклом for
Нейросеть ChatGPT заменит программистов?
Переглядів 519Рік тому
Нейросеть ChatGPT заменит программистов?
Быстрая сортировка за 4 минуты. Алгоритмы на JavaScript
Переглядів 9 тис.Рік тому
Быстрая сортировка за 4 минуты. Алгоритмы на JavaScript
Бинарный поиск. Алгоритмы на JavaScript | Подготовка к собеседованию
Переглядів 2,8 тис.Рік тому
Бинарный поиск. Алгоритмы на JavaScript | Подготовка к собеседованию
Алгоритмы на javascript. Стек и рекурсия.
Переглядів 7 тис.Рік тому
Алгоритмы на javascript. Стек и рекурсия.
Алгоритмы на JavaScript. Сложение двух чисел. Связный список.
Переглядів 333Рік тому
Алгоритмы на JavaScript. Сложение двух чисел. Связный список.
Алгоритмы на javascript. Метод указателей. Квадраты отсортированного массива. Leetcode #977
Переглядів 1,4 тис.Рік тому
Алгоритмы на javascript. Метод указателей. Квадраты отсортированного массива. Leetcode #977
Базовая теория алгоритмов. Метод указателей. Валидный палиндром.
Переглядів 958Рік тому
Базовая теория алгоритмов. Метод указателей. Валидный палиндром.

КОМЕНТАРІ

  • @Cyborg_Lenin
    @Cyborg_Lenin 4 дні тому

    Опа Nuphy gang!

  • @ВладКупный-ч7х
    @ВладКупный-ч7х 6 днів тому

    проект на гите специально не последней версией ?)

  • @Killer-Queen999
    @Killer-Queen999 7 днів тому

    1:24 есть люди печатающие 6 пальцами?

  • @alexles5003
    @alexles5003 13 днів тому

    в 2024 году джуниор должен знать, что он нафиг никому не нужен. Айтишка была ориентирована в основном на западного заказчика. Этот сегмент если не ушел совсем, то максимально сдулся. А на внутреннем рынке сейчас уже мидлы крепкие довольно неуютно себя ощущают.

  • @johnkramer8499
    @johnkramer8499 16 днів тому

    Мдэээ. Что ж такой junior собрался на работе то делать , кнопочки что ли красить и бургер меню реализовывать? Я понимаю, что все хотят все побыстрее, но... Ребят, честно , программирование с нуля это не проезд в автобусе оплатить - это годы обучения.

  • @LUNAJINNER
    @LUNAJINNER 25 днів тому

    Извините а какая у вас клавиатура ?!?!!

  • @dydai
    @dydai 27 днів тому

    Привет, я новичок в работе с vscode, подскажи какие плагины актуальны для работы с фазер и разработки игры на этом движке?

  • @aydarvalim8272
    @aydarvalim8272 Місяць тому

    ААААААА СУХОЖИЛИЕ СЛОМАЛ!!!!!!!!!

  • @Tony-ws1ym
    @Tony-ws1ym Місяць тому

    Не согласен с тем , что на первой итерации аккум был пустой , если не задавать значение аккума, то оно будет равно первому элементу массива, поэтому на первой итерации акк как раз равен 1. Но ролик все равно годный , спасибо )

  • @_webAmoeba
    @_webAmoeba Місяць тому

    эти 10 минут тренировки летят в трубу, если твоя работа за компуктером, и вне тренировки ты возвращаешься к старому способу. Пусть скорость работы упадет, а она упадет, нужно полностью переходить, можно и без тренажеров, можно распечатать клавиатуру, раскрасив разными цветами зоны, на гаджете открыть, да и на клавиатуру вроде не сказать что вредно смотреть, главное научиться правильно водить кистями и заточить под одну клавишу строго один палец, кроме пробела, приобретя мышечную память

  • @osidpgipsoe
    @osidpgipsoe Місяць тому

    Да не гэкай ты

  • @osidpgipsoe
    @osidpgipsoe Місяць тому

    Отличное видео! Только гэканье режет слух

  • @артёмкоролёв-ю6е
    @артёмкоролёв-ю6е Місяць тому

    скипнул на плане.Очередной продавец курсов :)

  • @Art.154-f7c
    @Art.154-f7c Місяць тому

    Спасибо

  • @Foxfaxfox
    @Foxfaxfox 2 місяці тому

    2 пальца 156 слов в минуту😅

  • @LavandaKicK
    @LavandaKicK 2 місяці тому

    Вы мощный дуэт! Годнейший контент! Благодарю!

  • @romanpritkov1107
    @romanpritkov1107 2 місяці тому

    git master типа не поллиткоректно)))))))))) master вроде как белый колонист

  • @dotadlyazadrota3427
    @dotadlyazadrota3427 2 місяці тому

    Привет, там на гитхабе вроде не последняя версия приложения, без последнего урока

  • @tsuker26
    @tsuker26 2 місяці тому

    Супер курс)Надеюсь будет продолжение)

  • @Dennica
    @Dennica 3 місяці тому

    Спасибо, классное видео, почти всё знал, кроме обновления по таймеру) но очень доступно и понятно)

  • @seastar32
    @seastar32 3 місяці тому

    На Mac OS надо alt (option) + backspace. Если нажать Cmd+backspace то сотрется вся строка

  • @slftv6944
    @slftv6944 3 місяці тому

    Подскажите инструмент для создания карты с ортогональной сеткой и поиска пути по ней.

  • @DmytriyScience
    @DmytriyScience 3 місяці тому

    Что за бред ? Там одну вёрстку нужно учить пол года,ты о чем какие 3 недели 😂😂😂

    • @yoz0__
      @yoz0__ 3 місяці тому

      Лол, полгода, skill issue

    • @ЭТОЯ-я1ц
      @ЭТОЯ-я1ц 2 місяці тому

      соглы)

  • @Фед-п2й
    @Фед-п2й 3 місяці тому

    Спасибо за контент для практики в самый раз!

  • @buttsin
    @buttsin 3 місяці тому

    Такой контент на вес золота. Очень жду продолжения. Спасибо за ваш труд.

  • @jeltkoff
    @jeltkoff 3 місяці тому

    Сперва мне очень помог твой ролик про слепую печать, теперь это. спасибо большое. ❤

  • @Tony-kd3ko
    @Tony-kd3ko 3 місяці тому

    А где алгоритмы? 🤔

    • @konstantinov_it
      @konstantinov_it 3 місяці тому

      Они не нужны тем более

  • @АнжелкаИванова-ь6й
    @АнжелкаИванова-ь6й 4 місяці тому

    для кулдаунда атак (и др событий) можно использовать таймеры: атака, флаг на блок атаки у персонажа и таймер на 300мс со снятием блока. Так же можно функцию нанесения урона в сам таймер положить и сделать таймер повторяющимся. и да, подписка, ждем продолжения🔥

    • @konstantinov_it
      @konstantinov_it 4 місяці тому

      Хорошая идея, я пробовал через таймеры, но у меня что-то не завелось. Надо будет еще раз попробовать, а то, действительно, мега костыльно)

  • @SergeyKardashev
    @SergeyKardashev 4 місяці тому

    Спасибо.

  • @КатяОстровская-з6й
    @КатяОстровская-з6й 4 місяці тому

    Спасибо, Сергей! Крайне важно! Мне было очень полезно

  • @dimitrusmeleskausas2086
    @dimitrusmeleskausas2086 4 місяці тому

    уже ни в первый раз пересматриваю, спасибо за такой полезный контент!

  • @Severenit
    @Severenit 4 місяці тому

    Шикарное новое видео) ты прям растешь)

  • @abiks4918
    @abiks4918 4 місяці тому

    В первом уроке было разрешение 800 на 600. С учетом того что карта 960x640 нужно менять. Спасибо за контент Upd: если есть возможность, то где можно почитать про адаптацию под разные устройства(разрешение и размер) вместе с Tilemap?

    • @konstantinov_it
      @konstantinov_it 4 місяці тому

      В одном из последующих уроках рассматривается, как сделать управление камерой, чтобы перемещаться по всей карте, перемещая камеру. Относительно адаптации канваса, затрудняюсь ответить. В общем случае, по идее, это должна быть математика в JS. Я бы обратился к ИИ с таким вопросом и исходя из ответа гуглил, искал в документации.

    • @abiks4918
      @abiks4918 4 місяці тому

      @@konstantinov_it Да, я камеру прикрутил. Но разрешение было бы неплохо сделать нормальным. К сожалению гпт очень тупит в более углублённых вопросах изучения phaser.

  • @dydya_dima
    @dydya_dima 4 місяці тому

    Привет от команды номер 2 😀

    • @konstantinov_it
      @konstantinov_it 4 місяці тому

      Привет! Круто, что нашли видео 🔥

  • @АлександрГрачев-в4м
    @АлександрГрачев-в4м 4 місяці тому

    Огонь) В проекте переходим как-раз на ртк. Подскажите, пожалуйста, что за автокомплитер кода стоит?

  • @PetrSha
    @PetrSha 4 місяці тому

    Очень хорошая подача информации. Короткая и эффективная! Приятно слушать (и смотреть=))

  • @Severenit
    @Severenit 4 місяці тому

    Спасибо за видео. 🎉 круто продолжай ❤

  • @YusheeroFirsov
    @YusheeroFirsov 4 місяці тому

    Спасибо за такой контент

  • @АлександрСтремоухов-ф4у

    а у меня клава такая же крутая !

  • @евгенийфедосеев-к3ъ
    @евгенийфедосеев-к3ъ 4 місяці тому

    Большое спасибо, за столь подробный гайд, кажется это первый бесплатный обучающий материал (кроме оф доки, где не хочется копаться), в котором делаются компоненты и используется наследование. На Phaser для баловства написал уже 3 игры, но в курсе все равно для себя подметил полезные вещи. Ты топыч, буду надеяться, что появятся еще обучающие материалы по Phaser. Очень интересно, было бы посмотреть, как ты верстаешь в нем менюшки и подалки под разные экраны :)

    • @konstantinov_it
      @konstantinov_it 4 місяці тому

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

  • @Андрей-с9н1д
    @Андрей-с9н1д 4 місяці тому

    Я с 2 Х пальцев, а не с 6 😂 (мне капец)

  • @РыжийПыжий-т9ъ
    @РыжийПыжий-т9ъ 4 місяці тому

    Очень полезно !

  • @t3r3mokk
    @t3r3mokk 4 місяці тому

    раньше я думал, что все люди, у которых есть харизма и талант популярны, но тебя почему-то не знал( успехов тебе!

    • @konstantinov_it
      @konstantinov_it 4 місяці тому

      Спасибо! Работаю над этим! 🙌

  • @bloodness0
    @bloodness0 5 місяців тому

    У меня рекорд 156 слов в минуту

  • @ElenaNebutina
    @ElenaNebutina 5 місяців тому

    spasibo xorosee prepodavanie

  • @lakumatina
    @lakumatina 5 місяців тому

    если тренирубсь утром, фоновая обратока работает?

    • @konstantinov_it
      @konstantinov_it 5 місяців тому

      Конечно! Например, когда гуляешь или даже смотришь youtube :)

  • @SergeyKardashev
    @SergeyKardashev 5 місяців тому

    Спасибо. Годный ролик. Во время прохождения курса руки не дошли до этого ролика, а после диплома взялся пересматривать отложенное, а там просто сокровища!

  • @ext_0015
    @ext_0015 5 місяців тому

    Очень круто ! Пожалуйста не останавливайся! Урок 🔥 🔥🔥

  • @makspropropro6100
    @makspropropro6100 5 місяців тому

    Что за монитор ?

  • @lewisgreed9406
    @lewisgreed9406 5 місяців тому

    Привет, на счет параметра Frame у scene, могу ошибаться, но вроде как Phaser умеет разбивать спрайты на кадры, условно разделяя на равные прямоугольники картинку, размеры которых мы указываем при загрузке спрайта в frameWidth и frameHeight, то есть можно указать конкретный кадр, отсчет слева направо сверху вниз, то он его отрисует.