Привет! Сегодня я хочу поделиться тем, как я создал компонент React Selfie AI Background Remover с использованием TensorFlow.js. Весь код доступен в публичном доступе на GitHub, и вы также можете исследовать его в виде отдельного пакета на NPM. Также доступно live demo, которое вы можете попробовать.
Рубрика «React» - 3
Введение в AI Selfie Background Remover с использованием TensorFlow.js для React-приложений
2024-10-15 в 14:15, admin, рубрики: AI Background Remover, Background Removal, Frontend AI Integration, image segmentation, JavaScript Libraries, machine learning, MediaPipe Selfie Segmentation, React, web applicationsПошаговое руководство по предварительной подписи URL-адресов AWS S3 и получению защищенных изображений S3 в React Native
2024-10-15 в 11:15, admin, рубрики: AWS, aws s3, images, javascript, React, react native
Введение
В современных приложениях, особенно работающих с мультимедийным контентом, эффективное управление такими ресурсами, как изображения, имеет решающее значение для плавного пользовательского опыта. Amazon Simple Storage Service (S3) является популярным выбором.Читать полностью »
Vike — современный SSR-фреймворк
2024-10-06 в 11:16, admin, рубрики: front-end, React, seo, ssr, Vike, гайд, Изоморфное приложение, серверный рендерингВсем привет. Я являюсь ведущим frontend-разработчиком компании 21Yard. Мы разрабатываем сервис для поиска строительных подрядчиков.
На проект я пришел желторотым масленком, который мало смыслил в seo-продвижении продукта, но жизнь внесла свои коррективы, и сейчас я хочу рассказать о современном ssr-фреймворке -vike, показать его основные аспекты.
P.S. Статья рассчитана в первую очередь на таких же молодых и зеленых, но будет возможно полезна и матерым калачам.
Мотивация для написания статьи
Мой вариант аутентификации с помощью JWT в FastAPI + React
2024-09-29 в 8:15, admin, рубрики: fastapi, jwt, jwt auth, python, ReactВ создании своих pet проектов у многих возникает вопрос аутентификации пользователя. Это может быть связано с персональным отображением страниц, настройки доступа и т.д.
В этой статье я хочу показать мое решение вопроса. Сразу скажу, что оно может быть не идеальным, могут быть другие варианты решения, но, мне кажется, для pet проекта, а может и больше этого вполне достаточно.
Что будем использовать?
Я решил поэкспериментировать с JWT (JSON web token) токеном, так как его не нужно хранить в базе или где то на сервере, это упрощает архитектуру приложения.
Для работы нам необходимо установить PyJWT
pip install pyjwt
Читать полностью »
@tanstack-react-query + react typescript
2024-09-14 в 12:16, admin, рубрики: @tanstack/react-query, FrontEnd Development, frontend react, frontend-разработка, React, react query, react.js, TypeScriptХотелось бы рассказать, как я использую в своих проектах при построении архитектуры приложения.
Все приложения, которые в той или иной мере имеют связь с сервером требуют выполнение стандартного набора действий:
1. Загружать данные;
2. Хранить эти данные;
3. Информировать о том что идет загрузка;
4. Информировать о том что произошла ошибка;
Давайте создадим базовый набор компонентов, методов, типов для построения такого приложения.
Инфраструктура
Будем считать, что у нашего приложения есть backend, и для нас он предоставляет следующие REST ручки.
-
Получение списка записей GET Читать полностью »
Практическая реализация современной аутентификации на платформе .NET: OpenID Connect, шаблон BFF и SPA
2024-08-29 в 11:15, admin, рубрики: .net, architecture, authentication, BFF, C#, oauth2, OIDC, React, SPAВведение
Истории и боли frontend-разработчика
2024-08-28 в 18:16, admin, рубрики: javascript, pwa, React, TWA, vue, web-разработка, производительность, фронтендНет, истории будут не про то, как я заказывал лавандовый раф, а мне принесли с сиропом топинамбура.
*в этом абзаце вы узнаете, какой я крутой и почему вы должны это читать*

Хочется вспомнить SOLID принципы и рассмотреть, как можно их применять в разработке интерфейсов на примере React компонентов.
S: Single Responsibility Principle (Принцип единственной ответственности). Означает, что каждый класс/функция/компонент должны выполнять только одну конкретную задачу.
На примере React компонента: Читать полностью »