Встраивание WebGL в HTML-страницу с помощью Three.JS

В статье рассмотрим совмещение WebGL‑анимации с прокруткой страницы HTML, используя библиотеку Three.js. Работа с ней во многом схожа с работой 3D‑редактора. Для получения результата в виде картинки или анимации необходимо создать сцену, поместить в нее камеру, создать примитив (геометрию или 3D‑модель), создать источник освещения и запустить процесс рендеринга.

👉 @sWebDev

jsPDF

jsPDF - это библиотека для генерации PDF-документов на стороне клиента. Она позволяет создавать PDF-файлы из HTML-страниц, изображений и других типов контента, поддерживает множество настроек и опций для создания настраиваемых документов. JsPDF не требует установки дополнительного программного обеспечения и может быть использована в любом современном браузере.

👉 @sWebDev

GSAP 3 Radio

Анимированное радио, выполненное с использованием библиотеки Gsap.js.

👉 @sWebDev

Зачем и когда использовать ng-template в Angular?

По ссылке обзор 3 полезных возможностей директивы <ng-template>.

NanoSQL

NanoSQL - легковесная и быстрая база данных, которую можно использовать как в браузере, так и на сервере. Библиотека обладает множеством полезных функций, таких как индексы, транзакции, агрегирующие функции и т.д. NanoSQL поддерживает различные бэкэнды баз данных, включая IndexedDB, WebSQL, SQLite, LevelDB и другие.

👉 @sWebDev

Toilet Paper Toggle

Забавный переключатель для сайта, выполненный с использованием библиотеки Gsap.js.

👉 @sWebDev

Часто используемые шаблоны проектирования в Angular

Обзор нескольких распространенных паттернов проектирования в Angular, таких как Singleton, Facade, Observer и других. Материал описывает, как использовать каждый паттерн и какие преимущества он может принести в разработке приложений.

👉 @sWebDev

Как отложить загрузку компонента React?

Каким инструментом React воспользоваться для того, чтобы отложить загрузку компонента до момента, когда он будет необходим для отображения?

👉 @sWebDev

Li´l Vikings

Анимированная сцена, выполненная с использованием Gsap.js.

👉 @sWebDev

Возврат отложенной версии переданного значения React

Рассмотрим грядущее изменение, которое появится в React 18. Хук useDeferredValue вернет отложенную версию переданного значения, которая будет “отставать” от исходной на время, равное таймауту:

     import { useDeferredValue } from "react";

    // ...

    const [text, setText] = useState("text");
    const deferredText = useDeferredValue(text, { timeoutMs: 2000 });

👉 @sWebDev

React Monochromatic Landscape Generator

Генератор ландшафта, выполненный с помощью SCSS, SVG и Babel.js.

👉 @sWebDev

Пишите хорошие тесты без stub/mock и заглушек маршрутизатора

В статье описаны методы тестирования Angular компонентов без использования стаб(stub), мок(mock) и заглушек для маршрутизатора. Авторы предлагают использовать реальный маршрутизатор и специальный класс, который позволяет создавать тестовые модули с минимальной конфигурацией. Это позволяет существенно упростить процесс написания тестов и повысить их точность.

👉 @sWebDev

React Spectrum

Компонентная библиотека от Adobe, созданная для создания современных пользовательских интерфейсов веб-приложений. Библиотека предлагает набор готовых компонентов тем и API, которые могут быть использованы в любом React-проекте. React Spectrum используют в Adobe Creative Cloud и других продуктах Adobe.

👉 @sWebDev

Alien Abduction

Анимированная сцена, выполненная с использованием библиотеки GSAP.js.

👉 @sWebDev

Generative UI - Orb Animation [pixi.js] + Frosty Elements

Анимированный фон, реализованный на Pixi.js.

👉 @sWebDev

Как разделить приложение Angular на приложения с микроинтерфейсом

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

👉 @sWebDev

js2flowchart

Библиотека визуализации для преобразования JavaScript кода в наглядную SVG-схему. Изучайте чужой код, делайте рефакторинг, не путаясь в функциональности.

👉 @sWebDev

Как передавать функции из компонента родителя в React?

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

👉 @sWebDev

Airport Distance Map

Веб-приложение, показывающее расстояние от одного аэропорта до другого. Выполнено на GSAP.js.

👉 @sWebDev