Библиотека superplaceholder.js

Это простая библиотека поможет вам прокачать плейсхолдеры на вашем сайте, добавив им анимацию:

https://www.npmjs.com/package/superplaceholder

#библиотека

Эффект качающейся лампы с GSAP

Достаточно простой проект, который реализует анимацию качания лампы с помощью библиотеки GSAP. Лампа же в свою очередь «освещает» заранее подготовленную картинку, добавляя ей атмосферности и реалистичности.
Посмотреть код можно тут:

https://codepen.io/Since1979/pen/podveKZ

#codepen #gsap

​Сайт-портфолио с React, GreenSock и Animate.css

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

https://youtu.be/bmpI252DmiI

#видео

​Создаём VR и AR прямо в браузере

Для этого нам понадобится JavaScript-библиотека A-Frame, которая позволит нам создавать трёхмерные миры с помощью HTML и Entity-Component, работающие с Quest, Rift, WMR, SteamVR, мобильным устройствами и компьютерами.

Подробности, инструкция и примеры тут:

https://aframe.io/

#библиотека

​Как создать роутер для пользовательского приложения SPA

Если вы разрабатывали SPA, то знаете о необходимости обработки несколько страниц в одностраничном приложении, как бы странно это не показалось. А если работали с React, то должны быть знакомы и с React Router, которая решает эту задачу.

Но в этой статье речь пойдёт о способе, который позволит вам избежать необходимости подключения лишней библиотеки, дав вам возможность использовать собственный маршрутизатор на ванильном JS. Подробнее в статье:

https://www.wiktorwisniewski.dev/blog/how-to-create-router-library

#spa #javascript

Подготовили для вас подборки полезной информации по различным направлениям

— любителям Java: @a_cup_of_java;
— всё о нейросетях: @neuro_channel;
— нужные инструменты для разработчиков: @prog_tools.

Выбирайте, что вам интересно, переходите по ссылке и жмите на закреп. И не забудьте подписаться — там ещё много всего интересного!

​Программирование помогает решать множество старых споров и задач. Вот и ещё один спор решён благодаря программистам:

​Симулятор x86 подобного процессора на машине Тьюринга

Как можно понять из названия, автор решил бросить самому себе вызов и создать весьма необычный проект. Буквально с нуля, используя JavaScript, он создал машину Тьюринга, которая симулирует работу процессора на архитектуре х86, а также написал собственный Assembler для неё.

Подробнее:

https://habr.com/ru/post/665776/

С лёгкостью создаём анимации прокрутки с помощью Lax.js

Библиотека Lax.js не только простая, но и лёгкая. При этом она позволяет создавать плавные и красивые анимации при прокрутке страницы на ванильном JavaScript.

Подробнее:

https://github.com/alexfoxy/lax.js

#библиотека

Анимация повторения текста при прокрутке

Интересный эффект анимации текста, который позволяет создать «отражения» при прокрутке страницы. При желании можно реализовать различные варианты такого поведения, подобрав наиболее подходящий для вашего проекта. Здесь ещё несколько примеров и способ создания эффекта:

https://tympanus.net/codrops/2022/04/13/on-scroll-text-repetition-animation/

#фронтенд

​​Mailwind — используем Tailwind для создания электронных писем

Mailwind представляет собой версию Tailwind CSS, созданную специально для разработки электронных писем в формате HTML. Если работали с оригиналом, то и тут проблем не возникнет, но зато вы сможете сэкономить кучу времени и сил.

Подробнее об установке и использовании тут:

https://github.com/soheilpro/mailwind

#библиотека #tailwind

​​Фронтенд-разработчики, когда увидели новый фреймворк:

​Как создавать шаблоны блочных тем в WordPress 6.0

Блочные шаблоны, также часто называемые разделами, были введены в WordPress 5.5, чтобы пользователи могли создавать и совместно использовать предопределённые макеты блоков в каталоге шаблонов.

Эта статья призвана научить вас создавать шаблоны без регистрации, а также использовать их:

https://css-tricks.com/how-to-create-block-theme-patterns-in-wordpress-6-0/

#wordpress

​Решения для ведения журналов для Node.js

Ведение журнала является неотъемлемой частью создания современных веб-приложений. Это помогает разработчикам исследовать различные проблемы с приложениями и быстро находить решения.

В этой статье представлены различные решения для ведения журналов для вашего приложения Node.js — Winston, Pino, Bunyan, Log Level и npmlog:

https://blog.bitsrc.io/logging-solutions-for-node-js-964487f169ea

#nodejs

Анимация набора текста на чистом CSS

Плавная и аккуратная анимация ввода текста выполнена на чистом CSS. JavaScript здесь отвечает только за её перезапуск. Посмотреть, как реализовано можно тут:

https://codepen.io/5t3ph/pen/qBdJVEq

#codepen #css

Крутые эффекты наведения CSS, использующие обрезку фона, маски и 3D

В этой статье вы найдёте целую подборку различных эффектов наведения на CSS с инструкциями по их созданию:

https://css-tricks.com/css-hover-effects-background-masks-3d/

#css #фронтенд

Покайтесь, грешники!

​GitHub прекратила разработку редактора кода Atom

Один из популярных редакторов кода уходит на покой. Уже в конце этого года компания переведёт репозиторий проекта в режим архива, оставив его доступным только для чтения. Информация об этом появилась в официальном блоге GitHub.

Проект просуществовал 11 лет, но теперь команда GitHub сосредоточится на развитии Microsoft Visual Studio Code, GitHub Codespaces и других облачных решений.

https://habr.com/ru/news/t/670510/

#новости

Есть желающие развивать форк?

​Разбивка на страницы и фильтрация на стороне сервера Angular

В этой статье вы узнаете, как использовать RxJS для реализации разбиения на страницы и фильтрации на стороне сервера для таблицы данных в приложении Angular:

https://levelup.gitconnected.com/angular-server-side-pagination-and-filtering-2206ce8279d1

#angular

Необычный часы для вашего сайта

Эти часы выполнены в футуристичном стиле и представляют собой комбинацию SVG и ванильного JavaScript. Забирайте себе на сайт:

https://codepen.io/jkantner/pen/MWEmExB

#codepen