Tilt Hover Effect + Flying Chef

В JS создана логика изменения поворота карточек и положения элемента на карточке. Градус поворота зависит от положения курсора при наведении.

Статья дня. Создание микроинтерфейсов Svelte с помощью Podium

Читать статью

#читать

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

Ответ

Wifi Signal animations

Элементы созданы на canvas и анимированы в JS.

Статья дня. Глубокое копирование в JavaScript с использованием structuredClone

Читать статью

#читать

Gooey Navigation

Элементы меню - это svg картинки, стилизованные в SCSS.

Задача

Дан массив arr из N целых чисел, где значение arr[i] находится в диапазоне [1, N].

Необходимо найти все целые числа в диапазоне [1, N], которые не входят в исходный массив.

Входные данные: N == arr.length, 1 <= N <= 10^5.
Выходные данные: список пропущенных элементов

Ответ

JavaScript for impatient programmers

Автор: Dr. Axel Rauschmayer
Год издания: 2019

Рецензия на книгу:

Эта книга делает JavaScript менее сложным в освоении для новичков, предлагая современный, максимально последовательный взгляд на язык.

Плюсы:
1. Охватывает все основные функции JavaScript
2. Лаконичность
3. Хороший авторский стиль.

Минусы: не замечено.

#javascript #english

Скачать книгу

Loaders

Подборка svg-загрузчиков в едином стиле.

You Must Build a Lighthouse.

Игра на HTML и SCSS. Каждый квадрат, в котором можно построить часть дома - radio кнопка, при активации которой задействуются CSS стили.

Задача

Напишите программу, которая выводит на экран числа от 1 до num. При этом вместо чисел, кратных трем, программа должна выводить слово «fizz», а вместо чисел, кратных пяти — слово «buzz». Если число кратно и 3, и 5, то программа должна выводить слово «fizzbuzz» .

Входные параметры: num - целое число, num > 1

Ответ

Principles of Web API Design

Автор: James Higginbotham
Год издания: 2021

Рецензия на книгу:

Книга объединяет принципы и процессы, которые помогут вам добиться успеха на протяжении всего жизненного цикла разработки API.

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

#english

Скачать книгу

Форма входа

Анимированная версия входа в google.

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

Ответ

spider

Создано на canvas и чистом JS.

Хамелеон с острова Null

В зависимости от положения курсора, Хамелеон меняет цвет. При этом он может "поймать курсор"

Book reviews

Верстка реализована при помощи CSS Grid. Анимации созданы библиотекой gsap.

Кнопка подтверждения

При нажатии на кнопку запускается анимация, созданная при помощи библиотеки gsap.

Статья дня. Добавляем и стилизуем видео на заднем фоне с помощью CSS и JS

Обзор вариантов исполнения популярной фичи с примерами.

Читать статью

#читать

3D Room - Pure CSS

Вращающаяся 3D-комната. Написана на чистом CSS.