🕹️ Parallax Photo Carousel
👉 Открыть полностью

#фишкиCodepen

Stories Slider

Необычный слайдер с круглыми слайдами, созданный на JS без использования сторонних библиотек.

​​Лучшие книги по JavaScript 2021 года

JS — по-прежнему один из самых популярных языков программирования, если не самый популярный. По крайней мере, в сфере веб-разработки без него не обойтись. Не удивительно, что постоянно выходят все новые книги по JavaScript, а также заново издаются старые.

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

Читать...

Проверка орфографии в полях ввода

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

Атрибут необязательный и может иметь значения true или false, дефолтное значение зависит от настроек браузера.

Пример кода:

<input
value="amazzing HTML!"
spellcheck="true"
/>

✅ Итог: слово amazzing будет подчеркнуто красной строкой.

❗P.S Наверное единственный случай в моей работе когда это могло пригодиться это русская буква "c" в английском слове

 #html #features

Как проверить, содержится ли значение в коллекции Set?

Метод set.has() проверяет, содержится ли значение в коллекции Set. Если значение есть в коллекции, метод вернёт true, в противном случае — false.

Пример
const watchList = new Set(['Сияние', 'Интерстеллар', 'Казино'])

console.log(watchList.has('Казино'))
// true

console.log(watchList.has('Чёрная пантера'))
// false

Задача по JavaScript 🚀

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

Ответ и объяснение

Свой вариант ответа указывай в комментарии 🔥👇

Что будет выведено в консоль?

Ответ - https://telegra.ph/Answer-10-27-5

3D Carousel

Автор создал необычную карусель с нуля на React. Стилизация реализована с использованием препроцессора SCSS.

Задача

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

Ответ

Hover Card

При наведении курсора на карточку, задействуются CSS анимации и трансформации, которые создают уникальный эффект раскрытия.

Что будет выведено в консоль?

Answer - https://telegra.ph/Answer-06-06-2

The React Workshop

Автор: Brandon Richey, Ryan Yu, Endre Vegh, Theofanis Despoudis, Anton Punith, Florian Sloot
Год издания: 2020

#react #english

console.trace();

Выводит трассировку стека в консоль.

function foo() {
function bar() {
console.trace();
}
bar();
}
foo();

В консоли отобразится следующая трассировка:

bar
foo
<anonymous>

#console #js

Простое сжатие

Вам дана строка, состоящая из повторяющихся символов. Создайте функцию, которая обработает эту строку и преобразует её в массив, состоящий из кортежей (число повторений, символ).

Примеры:
string1="aaaaaaaaaaaaaaaaaaaaaaaaaabaaaaaaaaaaaaaaaaaa"
output1='[26,"a",1,"b",18,"a"]'

string="aaaaaaaabaaaa"
compressed=[8,"a",1,"b",4,"a"]

Become a ninja with Angular

Автор: Ninja Squad
Год издания: 2021

#angular #english

Метод String.replaceAll (ES12 / ES2021)

String.prototype.replaceAll() заменяет все вхождения строки другим строковым значением.

В настоящее время в JavaScript у строк есть метод replace(). Если входной шаблон для замены является строкой, метод replace() заменяет только первое вхождение. Поэтому в коде второе вхождение «Back» не заменяется.

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

Было:
const str = "Backbencher sits at the Back";
const newStr = str.replace(/Back/g, "Front");
console.log(newStr); // "Frontbencher sits at the Front"

String.prototype.replaceAll() пытается произвести замену всех вхождений, даже если входной шаблон является строкой.

Стало:
const str = "Backbencher sits at the Back";
const newStr = str.replaceAll("Back", "Front");
console.log(newStr); // "Frontbencher sits at the Front"

#js

Затмение

Этот красивый эффект достигается использованием CSS анимаций, фильтров и теней.