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

Директива Angular для обработки события отправки формы? В Angular есть директива, которая используется для обработки события отправки формы, что это за директива? 👉 @sWebDev

Character Tutorial - Final Анимированная 3D модель, реагирующая на действия пользователя. Выполнено на Three.js. 👉 @sWebDev

Компонент для измерения производительности React компонентов? Компонент, позволяющий измерять производительность компонентов и их потомков. Включает в себя следующие параметры: id, функцию`onRender`, которая принимает три аргумента. Что это за компонент?

Hotkeys.js Библиотека для обработки горячих клавиш в JavaScript. Она позволяет легко определять пользовательские сочетания клавиш и назначать им обработчики событий. Библиотека поддерживает различные комбинации клавиш и позволяет определять последовательности нажатий. 👉 @sWebDev

SPB Frontend и X5 Tech проводят совместный митап! 📆 19 июля 📍 Санкт-Петербург, пер. Пирогова, дом 18, особняк «Пальма» 🌐 ОНЛАЙН В программе митапа - выступление 4 фронтенд-разработчиков, обмен опытом, кофе-брейк и афтепати. ✅ Темы к обсуждению: что происходит в браузере после ввода запроса в поисковую строку; как сократить код и ускорить выполнение запроса; как создать гибридное мобильное приложение с нуля за короткий срок; какие сейчас существует тенденции на IT рынке. Подробности и регистрация Присоединиться к митапу можно онлайн и офлайн. Количество офлайн-билетов ограничено.

Создаем приложение на Svelte с SSR рендерингом при помощи SvelteKit Подробное руководство по созданию приложений на Svelte с использованием SvelteKit и серверного рендеринга. В статье объясняются основные концепции и шаги, необходимые для настройки SvelteKit и создания компонентов. 👉 @sWebDev

Все кто выбрал вариант 1 - молодцы 👍 Остальным рекомендую с этим разобраться в первую очередь! Это простые и очень мощные инструменты для адаптивных макетов Например, чтобы расположить элементы как на картинке достаточно добавить 2 свойства для родительского блока:

flex;
align-items: (один из вариантов)

Но это только верхушка айсберга, чтобы понастоящему разобраться - поиграйтесь с этим тренажером Ребята разложили все по полочкам, а задания можно выполнять прямо в браузере 😼 P.S. выравнивать нужно будет в основном котов erid:Kra23oS9N

Cities Slider (React) Анимированный слайдер из столиц государств, выполненный на React. 👉 @sWebDev

Faker.js Инструмент для генерации случайных данных, таких как имена, адреса, номера телефонов и многое другое. Она помогает разработчикам создавать реалистичные тестовые данные для своих приложений или сайтов. Библиотека легка в использовании и предлагает широкий спектр опций для настройки генерируемых данных. 👉 @sWebDev

Руководство по использованию Bootstrap с React По ссылке руководство по использованию Bootstrap с React. В материале рассматриваются основные концепции и шаги для настройки Bootstrap в React-приложениях. 👉 @sWebDev

Would you like fries with that? Сборщик бургеров, выполненный на Vue.js. 👉 @sWebDev

Официальный язык, на котором пишут нейросети, теперь в Telegram! Для всех, кто мечтал написать свою нейросеть за 0.03 наносек открылся канал с гайдами по Python. Примеры кода, книги, ответы на задачи с собеседований Ядндекса/Озона/Google. Вникайте: Python practics

Измеряем производительность компонентов React <Profiler> - это компонент, который позволяет измерять производительность компонентов и их потомков. Он помогает идентифицировать медленные или затратные операции и оптимизировать приложение. Компонент принимает параметры: id: идентификатор; onRender: функция, вызываемая при каждом рендеринге компонента. Принимает три аргумента: id профайлера, фазу (phase) и фактическую продолжительность (actualDuration) рендеринга.

   <Profiler id="App" onRender={onRender}>
     <App />
   </Profiler>

👉 @sWebDev

Создаем приложение аудио-в-текст с помощью Whisper, React и Node По ссылке руководство по использованию библиотеки Whisper для преобразования речи в текст с помощью React и Node.js. Авторы предоставляют четкие инструкции и примеры кода, позволяющие создать приложение, которое распознает и транскрибирует аудиозаписи. Статья обращает внимание на важные шаги и рекомендации по настройке и использованию Whisper, а также демонстрирует интеграцию с фронтендом на React и бэкендом на Node.js. 👉 @sWebDev

Как динамически отобразить содержимое шаблона в текущем месте использования в Angular? В Angular есть директива, которая позволяет динамически отображать содержимое шаблона в текущем месте его использования. Что это за директива? 👉 @sWebDev

React Vertical Carousel Анимированная карусель изображений, выполненная на React. 👉 @sWebDev

Tippy.js Мощная библиотека для создания красивых и интерактивных подсказок на веб-страницах. Tippy предлагает легкий и простой в использовании интерфейс, позволяющий настроить различные параметры всплывающих подсказок, включая положение, стилизацию, анимацию и поведение. 👉 @sWebDev