https://youtu.be/bD0UXb7kD_k
Первое видео из серии. Создаем приложение новостей используя React. На выходных будут следующие 2 и 3 серии.🎯

На данный момент сняты серии:

1. Скелетон при загрузке контента
2. Пагинация, переключение новостей

В пятницу устрою голосование, какую функциональность добавить в приложение💪🏻

Вставка элементов в DOM — это частая задача в веб-разработке. В JavaScript существует несколько способов вставки, удаления и манипулирования элементами DOM. Давайте рассмотрим некоторые из наиболее часто используемых методов:

1️⃣append()
Этот метод используется для вставки элемента в конец родительского элемента.

2️⃣before()
Этот метод позволяет вставлять элемент перед указанным элементом.

3️⃣replaceWith()
Этот метод заменяет существующий дочерний элемент на новый.

4️⃣insertAdjacentHTML()
Этот метод позволяет вставлять строку HTML в указанное место относительно элемента.

5️⃣prepend()
Этот метод вставляет узлы или строки в начало родительского элемента.

6️⃣after()
Этот метод вставляет содержимое после указанного элемента.

7️⃣innerHTML
Этот свойство позволяет манипулировать HTML содержимым элемента напрямую.

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

#JavaScript #ОбучающийПост #DOM

В России в четыре раза вырос спрос на IT-специалистов

"Авито Работа": за год в России почти вчетверо вырос спрос на IT-специалистов

Спрос на квалифицированных IT-специалистов в августе 2023 года вырос в 3,7 раза по сравнению с аналогичным периодом прошлого года, вместе с этим увеличились также зарплатные предложения, рассказал РИА Новости управляющий директор платформы "Авито Работа" Артем Кумпель.

Как я понял это именно на всех специалистов, в том числе и smm, дизайнеры и тд. ChatGPT пока что не заменяет никого. Только лентяев☝🏻😄

#news

Примеры использования методов вставки DOM элементов

#code #DOM #JavaScript

Компонент высшего порядка (Higher-Order Component, HOC) — это один из продвинутых способов для повторного использования логики. HOC не являются частью API React, но часто применяются из-за композиционной природы компонентов.

Говоря просто, компонент высшего порядка — это функция, которая принимает компонент и возвращает новый компонент.

#react #hoc #ОбучающийПост #live

Обработка событий в веб-разработке — это фундаментальный принцип, позволяющий создавать динамичные и интерактивные сайты. Вот основные аспекты, которые включает в себя обработка событий:

1️⃣ Типы Событий
События могут быть разных типов, в зависимости от взаимодействия пользователя с веб-страницей. Это могут быть клики мыши, нажатия клавиш, движения курсора и многие другие.

2️⃣ Обработчики Событий
Обработчики событий — это функции, которые вызываются, когда происходит определенное событие. Они могут быть назначены конкретным элементам или всей странице.

3️⃣ Делегирование Событий
Делегирование событий позволяет назначить один обработчик событий родительскому элементу, а затем управлять дочерними элементами. Это упрощает управление событиями, особенно когда элементов много.

4️⃣ Поведение По Умолчанию
Некоторые события включают в себя стандартное поведение браузера, например, переход по ссылке при клике на нее. Это поведение может быть переопределено или отменено.

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

6️⃣ Объект События
Когда срабатывает обработчик события, ему передается объект события, содержащий информацию о событии, такую как тип события, целевой элемент и другие детали.

7️⃣ Совместимость Браузеров
Разные браузеры могут по-разному обрабатывать события. Учитывание этой совместимости может быть важным для обеспечения корректной работы на всех платформах.

Обработка событий является ключевым элементом в создании интерактивных и отзывчивых веб-приложений. Она включает в себя множество аспектов и методов, которые позволяют вам реагировать на действия пользователя, предоставляя ему богатый и удобный интерфейс. Чем больше вы понимаете об этих аспектах, тем более мощные и гибкие решения вы сможете создать для своих пользователей.📌

#JavaScript #ОбучающийПост #DOM

Обработка Событий в JavaScript

#code #JavaScript #DOM

Обработка событий в JavaScript (1)

#code #JavaScript #DOM

Где брать опыт джуниору? Нужно ли подтверждать опыт? Нужен ли официальный опыт работы?

#live #junior #hr #work

Чистые функции являются одним из фундаментальных понятий в функциональном программировании. Они обладают рядом ключевых характеристик, которые делают их простыми для понимания и предсказуемыми.

1️⃣Всегда возвращает один и тот же результат для одинаковых аргументов. Если вы передадите одни и те же аргументы, вы всегда получите один и тот же результат.

2️⃣Не имеет побочных эффектов. Это значит, что функция не взаимодействует с внешним миром: не меняет глобальные переменные, не работает с вводом/выводом и т.д.

Почему чистые функции важны?

🔑Тестируемость: Чистые функции легко тестировать, так как для одних и тех же аргументов они всегда возвращают один и тот же результат.

👍Понятность: Они делают код более понятным и предсказуемым, уменьшая возможность ошибок.

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

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

#JavaScript #ОбучающийПост

Примеры чистых и нечистых функций

#code #JavaScript

Если вы хотите углубить свои знания в JavaScript и по-новому взглянуть на этот язык, рекомендую обратить внимание на серию книг "Вы не знаете JS" от Кайла Симпсона. Это настоящая сокровищница знаний для каждого, кто работает с JS.

1️⃣Введение в программирование. Идеальное начало для новичков и хорошее освежение для опытных.

2️⃣Область видимости и замыкания. Познайте, как JavaScript видит ваш код, и разберитесь с самыми сложными аспектами.

3️⃣this и Прототипы Объектов. Глубокое погружение в одну из самых запутанных особенностей JS.

4️⃣Типы и грамматика. Узнайте все тонкости типов данных и их преобразований.

5️⃣Асинхронность и Производительность. Освойте механику асинхронных операций и узнайте, как заставить JS работать ещё быстрее.

6️⃣ES6 и не только. Изучите новейшие возможности языка, которые делают кодирование в JS ещё удобнее и мощнее.

Эта серия книг может стать вашим ключом к глубокому пониманию JavaScript. Удачного чтения и новых открытий! 🚀📖

#JavaScript #book #post

Для начала в самый раз) всего 65 страниц

Вы когда-нибудь сталкивались с ситуацией, когда нужно было обрабатывать события множества элементов на странице? Делегирование событий — это решение этой задачи, которое сделает ваш код гораздо проще и эффективнее.

💡 Что такое делегирование событий?

Это техника, при которой вы не привязываете обработчик события к каждому элементу отдельно. Вместо этого, вы назначаете один обработчик для их общего родителя. Когда событие происходит, вы можете определить, на каком именно элементе оно случилось, используя event.target.

📌 Как это работает?

Назначьте обработчик события контейнеру (родителю).
Когда событие произойдёт, через event.target вы узнаете, на каком дочернем элементе оно случилось.
Обработайте событие нужным образом.

🥇 Преимущества делегирования:

1️⃣Экономия ресурсов: один обработчик вместо многих.

2️⃣Гибкость: легко добавлять и удалять элементы без изменения обработчиков.

3️⃣Упрощение кода: при массовых изменениях элементов можно просто обновить innerHTML.

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

#JavaScript #ОбучающийПост #делегирование

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

#JavaScript #code #делегирование