API. Это слово звучит в каждой статье, в каждой вакансии, в каждом разговоре разработчиков. Но когда гуглишь, что это, вываливается тонна заумных определений про «программные интерфейсы приложений», от которых мозг плавится.Так что сегодня объясню, что такое API, так, что ты точно поймешь: на простых примерах, интересно, да еще и с крутой графикой. Уже через несколько минут ты будешь великолепно знать, что такое API и как создать свой собственный.Знакомая ситуация из реальной жизниПредставь, чт…
Как‑то на одном проекте понадобилось красиво равномерно разместить небольшие блоки‑виджеты в контейнере на странице. Сложность в том, что эти блоки различаются, как по высоте, так и по ширине. При чём нужно учесть адаптивность вёрстки и динамическое изменение содержимого, как контейнера, так и самих элементов — виджетов. Собственно мои изыскания по этой теме и вылились в разработку собственного решения и эту статью, которые, я надеюсь, будут полезны читателям. Опишем подробно условия/пожелания …
SchemaПочему?Вы начинаете с объявления контента на базовом языке. Затем тратите время на копирование, отправку его вашему любимому AI-провайдеру, ожидание перевода и, наконец, вставку всего обратно в папку /locales или /messages. И вы повторяете этот процесс для каждой локали и каждого пространства имён.Каждый раз, когда контент изменяется, вы проходите через тот же мучительный цикл снова. Если ваши JSON-файлы слишком большие, вам, возможно, даже придётся разделять их на части, чтобы всё зарабо…
Микросервисы тут, микросервисы там… Из каждого утюга доносится дивный сказ про прекрасный мир микросервисов. А ведь это всего лишь один вид из десятка архитектурных стилей, который имеет свои достоинства и недостатки.В этом эксперименте мы внедрим микросервисы в личный сайт, нарушив ключевые принципы DDD. Я создам антипаттерн «бедных сервисов» (Anemic Domain Model) и покажу, чем опасен прямой доступ к данным между микросервисами.Эта статья о том, что за прекрасным внешним видом, большой функцио…
Привет!Сегодня я расскажу о своём опыте в создании фреймворка для фронтенд-разработки. Цель была ясна, как день: сделать так, чтобы всё можно было выучить за 5 минут, с расчётом на то, что человек уже знает React, Vue или Angular.Как создать компонентВариантов тут много. В React это просто функция. В Vue это файл. Мне лично нравится возможность в React создавать несколько вспомогательных компонентов внутри файла, поэтому мы решили, что компонент будет функцией и объявляется он следующим образом…
Моя история разработки инкрементальной игры о горнодобывающей промышленности Кузбасса с подробным разбором технической архитектуры, системы безопасности и монетизации.Игра на 80% сделана с помощью вайб кодинга, но это не так просто как звучит.💡 Идея проектаЯ родом из Кемеровской области (Кузбасс) - угольной столицы России. Регион известен своими месторождениями: угля, золота, редких металлов. Идея пришла простая: создать современную idle-игру про управление горнодобывающей империей, где все мес…
ElevenLabs выложила в открытый доступ проект Eleven Shopping - голосового агента, который превращает процесс выбора товаров и оформления заказа в диалог с ИИ. В основе - стек Next.js + React + TypeScript + Tailwind CSS и подключение к Shopify Storefront API через протокол MCP. Код доступен на GitHub.Что это за агентEleven Shopping - это не просто «говорящий чат-бот». Это реальный голосовой интерфейс к вашему интернет-магазину на Shopify, где взаимодействие происходит голосом, без кликов и форм.…
Всем привет! Сегодня я возвращаюсь с новой порцией TypeScript- и React-магии. Вместе разберем полиморфизм в React, а именно — паттерн as. Зачем он нужен, как его прикрутить без багов и почему это сделает ваши компоненты в разы круче. Как обычно — всё под катом.В каких случаях это нужноПредставьте, что вы сделали красивую кнопку Button. Всё летает, дизайнеры плачут от счастья. И тут приходит продукт-менеджер: «А сделай так, чтобы вот эта кнопка стала ссылкой на главную».«Не вопрос!» — говорите в…
Недавно мы переделали наши внутренние инструменты, визуализирующие компиляцию JavaScript и WebAssembly. При работе оптимизирующего компилятора Ion мы теперь можем генерировать интерактивные графы, демонстрирующие, как конкретно обрабатываются и оптимизируются функции.Вы можете сами поэкспериментировать с этими графами в оригинале статьи. Просто введите какой-нибудь код на JavaScript в функцию test, и наблюдайте за созданием графа. Также там можно щёлкать и перетаскивать граф, менять масштаб при…