Frontender Libs - обзор библиотек JS / CSS

Использование хуков React Материал по работе с хуками в React. Автор рассказывает о работе с хуками жизненного цикла, хуками контекста и кастомными хуками React. 👉 @sWebDev

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

В планах перейти в веб-разработку? Бесплатный вебинар 1 апреля в 14:00 (мск) обсудим варианты обучения с основателем буткемпа SaintCode Bootcamp Женей Гриценко и разработчицей в компании SoftSwiss Олей Кравченко. Выдаем дорожную карту для самообучения фронтенду и словарь современного айтишника. Записывайся — https://clck.ru/33vCam

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

        import { nanoid } from 'nanoid';

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

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

X5 Frontend Meetup #2 – митап по фронтенду, который состоится 12 апреля В программе: - «Что нам стоит блог построить?», Никита Дубко, доброжелюбный бородач из подкаста «Веб-стандарты» - «Мобильное приложение за три дня! Самый быстрый старт!», Андрей Поляков, руководитель фронтенд-разработки в команде торговой сети «Чижик» - «State Of A11y 2023», Лена Райан, фронтенд-разработчица в команде «Обратной связи» в X5 Tech Онлайн и бесплатно 12 апреля в 18:00 по мск Регистрация на мероприятие

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

Переходы между страницами В ReactJS с React Router V6 И встроенным View Transitions API Узнаем, как использовать новое встроенное API переходов в React Router v6. Это поможет при создании эффектных переходов между страницами в React приложении. 👉 @sWebDev

Открыта регистрация на серию митапов для начинающих разработчиков Intern Meetup Week в Яндексе с 17 по 20 апреля🎉 18 апреля состоится митап для направления Frontend. Будет доступен офлайн и онлайн формат. Регистрация по ссылке: https://clck.ru/33qVyG При отборе на митап у вас есть шанс получить приглашение на пробное собеседование на стажировку в Яндекс 🔥 В программе лекции экспертов о технологиях, общение с руководителями команд и рекрутерами, нетворкинг и подарки. 📆Когда: 18 апреля 18:00 - 21:30, сбор гостей с 17:30 🌐Где: офис Яндекса, ул. Льва Толстого, 16, м.Парк Культуры и трансляция онлайн Все подробности и регистрация по ссылке: https://clck.ru/33qVyG А чтобы быть в курсе всех новостей Young&&Yandex, подписывайтесь на чат-бот.

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

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

Планируете начать настраивать среды разработки с Vite.js? 🚀Приходите 30 марта в 20:00 на урок, который пройдет в рамках онлайн-курса «Vue.js разработчик». Vite отлично подходит для сложных проектов, где требуется взаимодействие с сервером. В отличие от других инструментов, он легко встраивается через терминал и может быстро разворачиваться. Приглашаем всех желающих на открытый урок, на котором рассмотрим миграцию на Vite с Vue CLI, а также его преимущества: - Мгновенное время запуска сервера разработки - Горячая замена модулей из коробки - Простая конфигурация - Поддержка модулей ES из коробки 👉🏻 Чтобы записаться на урок, пройдите вступительное тестирование https://otus.pw/jjcV/ Курс доступен в рассрочку. Реклама. Информация о рекламодателе на сайте www.otus.ru

Управление состоянием в Vue с Pinia ORM Гайд по использованию Pinia ORM для управления состоянием в Vue.js. В материале достаточно примеров и объяснений, которые помогут разработчикам эффективнее управлять состоянием приложения и упростят код. 👉 @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

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

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

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

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

❔❔ JS-разработчик? А насколько хорошо ты знаешь Vue.js? JS-разработчик? А насколько хорошо ты знаешь Vue.js? ✔️ Пройди тест из 20 вопросов и узнай, сможешь ли ты учиться на курсе "Vue.js Developer" от OTUS. Если правильно ответишь хотя бы на 12 вопросов - сможешь поступить на курс по специальной цене! ⏰ Время прохождения теста ограничено 30 минут ✍️ПРОЙТИ ТЕСТ: https://otus.pw/3MOJ/ Курс доступен в рассрочку. Реклама. Информация о рекламодателе на сайте www.otus.ru