«Микрофронтенды в компании, которая доставляет пиццу? Серьёзно? Зачем? Да и куда? У вас же всего лишь приложенька с каталогом и заказом товара. Какие ещё микрофронтенды?»
Одно из самых распространённых заблуждений о том, что в Dodo до микрофронтендов не доросли. Но сегодня я постараюсь его развеять и рассказать, как мы докатились до такой жизни и какой путь при этом был пройден. Усаживайтесь поудобнее, мы начинаем наш рассказ.
Во множестве проектов web разработки для улучшения пользовательского опыта используются всплывающие подсказки - tooltips. В статье рассматривается создание переиспользуемого и гибко настраиваемого React компонента для отображения таких всплывающих подсказок.
Да, про эту нейросеть сейчас слышно отовсюду, как она пишет текста песен, сдает экзамены, пишет куски кода, но я подумал, а сможет ли она сама целиком завершить проект под моим руководством?
Создание веб приложения на основе React и Django, с базой данных на postgress, небольшое прощупывание RabbitMQ и чуть-чуть nginx, потом объясню зачем. Ах да! Завернём все в контейнеры и заставим подниматься в три команды!
В этой статье речь пойдет о наложении HUD на карту. Рассмотрим на конкретных примерах методы для взаимодействия с картой. Реализуем функционал перехода центра камеры на конкретную координату, зум камеры, а также функцию подгонки камеры под такую позицию, при которой все маркеры отображались бы на экране.
Yandex Maps SDK: использование в React Native-приложении
В этой статье расскажу о том, как я лично столкнулся с Yandex Maps SDK для React Native и опишу базовый инструментарий, который предоставляет эта библиотека с небольшими примерами.
6 февраля начинается очередной поток нашей школы Metaclass по курсам frontend и backend для начинающих.
После учебы мы всегда спрашиваем наших студентов о курсе: что было легко, что не очень, как знания с курса помогли в карьере. Сегодня о своём опыте расскажет недавний выпускник курса Начинающий React-разработчик Настя Жукова.
Ещё одна история изучения и использования технологии WebRTC (Web Real-time Communication). Краткое описание создания готовой библиотеки для её переиспользования в разных проектах.
Привет, друзья!
Представляю вашему вниманию перевод этой замечательной статьи, в которой автор просит ChatGPT разработать компонент модального окна на React.
ChatGPT — это чат-бот с искусственным интеллектом, разработанный компанией OpenAI и способный работать в диалоговом режиме, поддерживающий запросы на естественных языках. ChatGPT — большая языковая модель, для тренировки которой использовались методы обучения с учителем и обучения с подкреплением. Чат-бот основывается на другой языковой модели от OpenAI GPT-3.5 — улучшенной версии модели GPT-3.
ChatGPT был запущен 30 ноября 2022 года и привлек внимание своими широкими возможностями: написание кода, создание текстов, возможности перевода, получения точных ответов и использование контекста диалога для ответов, хотя его фактическая точность подверглась критике (источник — Википедия).
Интересно? Тогда прошу под кат.
Хранимые данные (persistent data) являются неотъемлемой частью современных веб-приложений. Они нужны нам для сохранения информации о пользователях, предоставления платежной информации и многого-многого другого. Теперь вы можете подключать свои любимые технологии хранения данных (Prisma, Mongoose, MySQL и другие) через npm и в Deno!
React Native предоставляет Animated API который может покрыть часть базовых потребностей вашего приложения, однако если вы хотите создавать сложные и производительные анимации на 60fps, без сторонних библиотек вам не обойтись. И сегодня я хотел бы рассказать о Reanimated 2 и продемонстрировать ее возможности на примере создания компонента счетчика.
Технология css-in-js существует уже довольно давно. Ещё в начале своего профессионального опыта я встречал подходы, в которых стайлинг локальных частей интерфейса пробрасывался в html через javascript в виде css директив. Иногда это необходимая мера, хотя необходимой она случается изредка, но раз в год, как говорится, и палка стреляет. У меня на опыте был пример построения раздела интерфейса, в котором устанавливаемое на сайт пользователя модальное окно можно рестайлить через кодовый редактор с live preview. css-in-js бывает оправдан, поэтому хочу сразу оговориться - хоронить никакой подход не стоит. Но и идеализировать его как универсальную пилюлю тоже не надо. Рендер стилей, привязанный к логике рендера компонентов в контексте всего проекта - это просто свой путь со своими приключениями, появившийся на мой взгляд в общей психопатии привязывать к state всё что только можно. Что если посмотреть - откуда взялась эта техногогия? На сегодняшний день на рынке проектирования интерфейсов сложился монополист react, диктующий программистам свои правила игры, и который даже без использования styled модуля имеет в себе простейщую инверсию управления cssInJs.
React - важный персонаж в этой теме. Он, словно useEffect всего современного front-end - стал центром силы, средоточием зла в виде голого state management, не предусматривающего из коробки ничего иного.
Как мы все знаем, в React есть функциональные и классовые компоненты. Каждый вид имеет свои плюсы и минусы.
Классовые компоненты имеют меньшую производительность по сравнению с функциональными и вызывают некоторые сложности в переиспользовании одинаковой логики.
И трам-парам как по-фолшебству, как в новогоднюю ночь, проявился код. Я подумал ведь можно же управлять состоянием приложения на React используя всего один дополнительный хук!
Большинство уже знакомо с ChatGPT, технологией способной выполнять такие задачи, как копирайтинг, отвечать на вопросы, переводить и делать практически все остальное, что связано с текстом. ChatGPT на столько продвинутая, что школы Нью-Йорка запретили её использование, чтобы студенты не выполняли с помощью нее свои домашние задания. Хорошо, что я больше не студент, так что использую модельку по много раз в день, чтобы выполнять свои ежедневные задачки.
Я дергаю ChatGPT так часто, что меня стало раздражать копировать текст, который я хочу отредактировать, открывать новую страницу chat.openai.com и вставлять его туда, писать свой запрос, получать ответ модели, а затем копировать и вставлять его обратно туда, где он был мне нужен изначально. Именно поэтому мы с друзьями сделали расширение для Chrome, которое позволяет решать задачи без лишних действий и переключений вкладок.
Кому интересны детали, прошу следовать за мной!
Привет, я Данильян, работаю в Самокате фронтенд-разработчиком, разрабатываю бэкофисное приложение с использованием React. Когда я только начинал изучать Jetpack Сompose, я наткнулся на статью, в которой простым языком для людей, пришедших из мира веб-технологий в мир мобильной разработки, расписано, как писать код для мобильных устройств, чтобы было как в React. Из материала в статье особенно подкупали примеры: вот, что вы делали в React, а вот, как в Jetpack Compose получить то же самое.
Делюсь с вами переводом этой статьи.
В прошлой заметке я представил общественности шаблон проектирования Мейоз, как способ управления состоянием одностраничного javascript приложения. Шаблон не связан с конкретной библиотекой рендеринга, и опирается исключительно на небольшую функцию stream и нативную реализацию объекта Array в javascript.
Идея шаблона заключается в использовании streams (потоков) для хранения состояния приложения, глобального или локального (например состояния html формы), связывания, свертки и комбинации потоков в функциональном стиле. Шаблон предлагает использовать определенные реактивные структуры данных, но не обязательно буквально так как это делает автор. В рамках шаблона можно реализовать любое удобное и понятное поведение приложения.
В этой заметке я перепишу небольшое приложение "Кубики", и вместо библиотеки mithril для рендеринга будем пользоваться reactjs. Будем использовать потоки для управления глобальным и локальным состоянием, а так же, сервисы — объекты, определяющие функции, которые выполняются всякий раз, когда изменяется состояние.
Всем привет!
Все мы прекрасно знаем что построить полноценный стор на react context достаточно тяжело, а оптимизировать его ещё тяжелее.
А что если я расскажу как это можно сделать быстро и просто?
