Icosahedron: Perlin Noise + Isolines + SelectiveBloom

Анимированная сфера, выполненная с применением библиотеки Three.js.

👉 @sWebDev

Решено: Не работает ввод — React

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

👉 @sWebDev

Umbrella JS

Umbrella JS - JavaScript библиотека для работы с DOM-элементами. Она предоставляет чистый и простой API, который можно использовать для создания, поиска и манипулирования элементами на странице. Код библиотеки легко читаем и понятен. Основным преимуществом является небольшой размер.

👉 @sWebDev

Donuts Paradise

Генератор пончиков, выполненный с применением библиотеки Three.js.

👉 @sWebDev

Менеджер задач на React + Hygraph

В статье описано создание полноценного приложения по управлению задачами с помощью React и библиотеки Hygraph. Рассмотрим основы создания CRUD-приложений, реализацию базовых функций и использование Hygraph для управления состоянием приложения.

👉 @sWebDev

Sacred geometry 3D - 2

3D-анимация, выполненная с помощью Three.js.

👉 @sWebDev

Barcode Writer in Pure JavaScript

JavaScript библиотека для генерации штрих-кодов. Не требует установки сторонних программ или плагинов, работает в браузере. Библиотека поддерживает множество типов штрих-кодов, включая EAN, CODE128 и QR-коды, и позволяет настраивать многие аспекты генерируемого кода.

👉 @sWebDev

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

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

👉 @sWebDev

Новые возможности Angular Router

Автор описывает новые возможности и улучшения в Angular Router. Например, переходы на несколько URL-адресов, сохранение состояний маршрутов и поддержку браузерной истории.

👉 @sWebDev

Откладываем загрузку компонента в React

React.lazy() - функционал, который позволяет отложить загрузку компонента до момента, когда он будет необходим для отображения. Например:

        import React, { lazy, Suspense } from 'react';

        const MyComponent = lazy(() => import('./MyComponent'));

        function App() {
        return (
            <div>
            <Suspense fallback={<div>Loading...</div>}>
                <MyComponent />
            </Suspense>
            </div>
        );
        }

👉 @sWebDev

Управление состоянием в Vue с Pinia ORM

Гайд по использованию Pinia ORM для управления состоянием в Vue.js. В материале достаточно примеров и объяснений, которые помогут разработчикам эффективнее управлять состоянием приложения и упростят код.

👉 @sWebDev

Анимированный фон на Pixi.js

Реализация анимированного фона с использованием библиотеки Pixi.js.

👉 @sWebDev

Immer

Библиотека предоставляет удобный способ изменения неизменяемых объектов в JavaScript. Immer предоставляет метод produce, который позволяет создавать неизменяемые копии объектов и изменять их, не нарушая принцип неизменяемости.
Например, следующий код создает неизменяемый объект и изменяет его, используя метод produce:

        import produce from 'immer';

        const state = { value: 0 };

        const newState = produce(state, (draftState) => {
        draftState.value += 1;
        });

Immer будет полезен для разработчиков, которые занимаются созданием приложений React и Redux.

👉 @sWebDev

Переходы между страницами В ReactJS с React Router V6 И встроенным View Transitions API

Узнаем, как использовать новое встроенное API переходов в React Router v6. Это поможет при создании эффектных переходов между страницами в React приложении.

👉 @sWebDev

Таймер на Vue и Gsap.js

Проект анимированного таймера, выполненного с использованием библиотек Vue и Gsap.js.

👉 @sWebDev

X5 Frontend Meetup #2 – митап по фронтенду, который состоится 12 апреля

В программе:
- «Что нам стоит блог построить?», Никита Дубко, доброжелюбный бородач из подкаста «Веб-стандарты»

- «Мобильное приложение за три дня! Самый быстрый старт!», Андрей Поляков, руководитель фронтенд-разработки в команде торговой сети «Чижик»

- «State Of A11y 2023», Лена Райан, фронтенд-разработчица в команде «Обратной связи» в X5 Tech

Онлайн и бесплатно
12 апреля в 18:00 по мск
Регистрация на мероприятие

Nano ID

Легковесная библиотека для генерации уникальных идентификаторов с использованием криптографически безопасного случайного числа. Nano ID может генерировать идентификаторы различной длины и с разными параметрами, такими как использование только символов верхнего или нижнего регистра, цифр, а также символов из пользовательского набора.

Пример использования библиотеки Nano ID для генерации случайного идентификатора длиной в 10 символов с использованием символов верхнего, нижнего регистра и цифр:

        import { nanoid } from 'nanoid';

        const id = nanoid(10);
        console.log(id);
        // "g5U5Fzv1iR"

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

👉 @sWebDev

Как условно рендерить элементы на основе булевого значения Vue.js?

Используя одну из директив Vue мы можем рендерить элементы на основе булевого значения. Какая это директива?

👉 @sWebDev