☑️ CONTEXT и SCOPE

Проводил недавно собеседования.
Спрашивал про scope и context в JavaScript.

Примерно половина людей думает что это одно и то же, а другая половина путается и теряется.

Особенно важно обратить внимание начинающим разработчикам.
Разбираемся вместе.

☑️ ОТРИЦАТЕЛЬНЫЙ margin

Существует несколько точек зрения на использование отрицательного значения, как резко негативное, так и положительное.
Разбираемся в том, что же это такое: хак или обычное значение?

☑️ 10 способов скрыть элементы в CSS

Иногда появляется необходимость скрыть некоторые элементы с сайта (блоки, картинки, DIV и так далее), либо просто скрыть текст при помощи CSS. Для этого существует несколько различных способов, которые отличаются по эффекту. Далее вы можете узнать о них.

🎉 КАНАЛУ 1 ГОД 🎉

Спасибо что читаете!

В связи с этим, и пролонгацией карантина я решил сделать бесплатный онлайн курс по front-end разработке.

Заинтересовало?

Детали в соответствующем канале: https://t.me/free_front_end

☑️ min(), max(), clamp()

В апреле 2020 появилась поддержка этих функций в основных барузерах.
Что это за функции и чем могут быть полезны – в посте.

☑️ АДАПТИВНЫЕ ИЗОБРАЖЕНИЯ HTML5

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

☑️ НОВЫЕ ОПЕРАТОРЫ В JavaScript

JavaScript очень быстро развивается. В последнем стандарте были добавлены новые операторы, которые позволяют писать более красивый и выразительный код. Рассматриваем их здесь.

☑️ CКРОЛЛ К ТЕКСТУ БЕЗ ЯКОРЕЙ И JavaScript

Разбираемся с функциями прокрутки до фрагмента текста.

☑️ ВСЕ СПОСОБЫ ПОЛУЧЕНИЯ ДАННЫХ ИЗ ФОРМЫ В JavaScript

🤓 Данный пост рассчитан на новичков, но и опытные разработчики могут найти для себя что-то новое.

С помощью JavaScript мы можем получать значения формы и манипулировать полями.
Способов сделать это множество. Разбираем их в новом видео на Youtube канале WiseJS.
Текстовый формат, конечно же, остается: кликай здесь.

Голосуйте ниже, какой формат вам нравится больше видео (📹) или текстовый (🗒).

Все еще желаете освоить Front-end 💻, но так и не переходите к его изучению, или не знаете с чего начать?

Начните с HTML!

Выучите данный язык разметки всего за 40 минут моем новом видео!

☑️ TIPS AND TRICKS #1

Самый простой способ создать HTML-элемент из строкового шаблона.

The easiest way to create an HTML element from a string template.

☑️ ВСЕ, ЧТО НУЖНО ЗНАТЬ ПРО ТЕГ SCRIPT

Разбираемся с особенностями атрибутов, и порядком исполнения скриптов по ссылке.

🚀🚀🚀

☑️ TIPS AND TRICKS #2

Получаем полное название дня недели из объекта Date:

✅ на любом языке
✅ без использования сторонних библиотек

Верстаем сайт с нуля за 4 часа!🔥 Бесплатный марафон по HTML/CSS + Bootstrap.

🗓 Когда: с 12 по 13 октября (2 дня), начало в 19:00 по Киеву.

👥 Рассчитан на новичков+, которые хотят прокачать свои навыки или попробовать себя в верстке сайтов*.

📍Где: прямой эфир на YouTube канале. Подписывайтесь чтобы не пропустить начало!

✔️за 4 часа мы сверстаем сайт в прямом эфире;
✔️я познакомлю Вас с основами и тонкостями верстки сайтов;
✔️”оживим” его с помощью JS
✔️Вы “примеряете” на себе новую професcию;
✔️получите ответы на все интересующие вопросы в прямом эфире;
✔️мотивация и советы куда двигаться дальше в подарок 😁

Все материаллы, файлы и ссылки будут опубликованы в телеграмм канале: https://t.me/free_front_end

*Чтобы иметь минимальные знания рекомендую посмотреть мое видео HTML за 40 минут.

☑️ TIPS AND TRICKS #3

Условие prefers-color-scheme в @media используется для определения темной/светлой темы в CSS.

Определить значение этого свойства можно и через JavaScript.

Используем window.matchMedia() с соответствующим запросом, чтобы проверить настройки цветовой схемы пользователя.

☑️ ВСЕ, ЧТО НУЖНО ЗНАТЬ ПРО ТЕГ LINK

Разбираемся с особенностями атрибутов: preconnect, prefetch, preload и многих других по ссылке.

☑️ TIPS AND TRICKS #4

В мире JavaScript для таких задач написаны даже отдельные npm пакеты.
Но сами функции могут занимать всего несколько строк.
Преобразовываем URL параметры в объект и наоборот.

☑️ НОВЫЕ ВОЗМОЖНОСТИ ES2021 / ES12

Новые версии спецификации ECMAScript дополняются каждый год, а новые предложения для изменений финализируются довольно быстро.
Узнайте, какие возможности получил JavaScript по ссылке.

🚀🚀🚀

☑️ TIPS AND TRICKS #5

Распространенной потребностью является возможность копировать текст в буфер обмена одним нажатием кнопки.

🎯 Такую функциональность можно реализовать с помощью данной функции.

☑️ WEB ПРИЛОЖЕНИЕ С НУЛЯ: react, hooks, redux, redux-saga, material-ui

Записал туториал по разработкие приложения с использованием выше перечисленных технологий.

Welcome 🙌

P.S.: За лайки и комментарии + в карму 🎯

☑️ TIPS AND TRICKS #6

В обработчиках событий мы извлекаем значение с помощью event.target.value. И он всегда возвращает строку. Но что, если нам нужно число? Использовать Number(), parseInt() или parseFloat() для преобразования?

🎯 Вместо этого используйте event.target.valueAsNumber. Он возвращает значение как число.

Работает с type: date, month, week, time, number, range.