Деволлим
226 subscribers
92 photos
15 videos
99 links
Привет, я Лёша - стартапер, фулл-стэк разработчик с 15+ годами опыта.

Делюсь тем, что реально помогает - как быстрее делать MVP, как балансировать между качеством, архитектурой и тем, что «работает сейчас».

@devall
Download Telegram
Промпт для IDE

У меня часто бывает так что я вымучиваю у gpt какие то подходы и расскручиваю их до нужного функционала

После чего можно было бы пойти имплементировать их руками, но это уже неэффективный подход

Ведь можно попросить gpt составить prompt для IDE, которая сама сделает всю рутину

@devallim
2
Если нужно быстро и аккуратно освободить место в системе - Cursor в агентском режиме лучшее средство

Похоже ли это на заявку в #вайбкодидеи - клинер с локальной llm моделькой?

@devallim
🔥2
Уверен, многие уже читали разные пересказы статьи “Attention Is All You Need”, вдавались в ретроспективу развития нейронных сетей к текущему дню.

Но если вам всё ещё интересно, хочется пробежаться по верхам ещё раз или вы искали лаконичную статью для родственников - сделал перевод статьи, которая реально заслуживает внимания.

https://telegra.ph/Vnimanie--ehto-vsyo-chto-vam-nuzhno-09-25

@devallim
❤‍🔥3🔥1
«4B-модель может гуглить сама? 😳»

Ollama выпустили Web Search API и дали возможность создавать поисковых агентов прямо из локальной модели - например, qwen3:4b.

Это не просто “интернет как контекст” - это когда модель сама принимает решение: “надо поискать” → делает запрос → подставляет результат в ответ.

Обо всем этом с примерами кода в свежей статье
https://ollama.com/blog/web-search#building-a-search-agent
👏21
Небольшой лайфхак на случай если нужно имплементировать что то размазанное по другому репозиторию

Уже давно должен быть известен repomix.com, но может казаться что загрузить в контекст целый проект неполучится, хотя на деле все решаемо внимательностью и… игнором бесполезных файлов (см скришоты)

⚡️В итоге репа на почти 5 млн токенов превращает в 50к - с этим уже можно работать и вместо copy paste доверить дело LLM

@devallim
🔥21
Есть одна игра, в которую я зависал лет 7 назад - NandGame

По сути это симулятор цифровой логики: начинаешь с базового NAND и шаг за шагом собираешь полноценный компьютер. Сначала простые логические элементы, потом память, процессор - и в итоге на собранном “железе” можно запускать простые программы.

Почему я считаю её must-have для программиста?
Потому что она очень наглядно объясняет, как всё работает под капотом. Когда видишь, что из примитивного NAND реально выстраивается полноценный CPU, по-другому смотришь на код, который пишешь каждый день.

Если бы в школе на информатике вместо “Word и Excel” давали пройти NandGame - многие наконец поняли бы, что компьютеры не магия.

Рекомендую пройти хотя бы пару уровней - это учёба, которая ощущается как игра 🎮
nandgame.com

@devallim
1🔥1
Если вдруг упустили - там в Cursor временно бесплатна моделька на 1млн контекста

@devallim
👀1
Достаточно бесшумно прошли последние обновления в Cursor, хотя за пару месяцев появились интересные и очень полезные фичи:

1. Plan Mode (линк; на скрине)
Фича с вайбом Kiro - и точно должна прописаться в вашем рабочем пайплайне. Агент теперь сам уточняет детали, собирает план и формирует Todo-лист в отдельном UI-табе (с кнопкой Build). Всё можно сохранить в .cursor/plans/ для будущих итераций.

2. Slash-команды (линк)
Это тоже прям must-have. Нажимаешь / и у тебя целая библиотека своих “вымученных” промптов. Всё хранится в .cursor/commands/. (потенциал - огромный, ведь можно делать кастомные цепочки с MCP и системными взаимодействиями в пару нажатий клавишь)

3. Prompt sharing (линк)
Теперь промпты можно шарить через deeplink - мой пример. Отличная возможность для внутренних каталогов или шаринга с командой. Ограничение 8к символов, но не страшно - ведь текст можно хранить где угодно и Cursor подтянет по ссылке web-tool’ом. (через эту историю можно как раз создавать “slash-команды”)

4. Browser integration (линк)
Cursor научился управлять браузером: навигация, клики, ввод текста, скролл страницы, скриншоты, в devtools мониторить консоль и сетевые запросы. Из кейсов звучит классно:
- разумеется дебаг
- автотесты
- генерация кода по скриншоту
- улучшение accessibility

5. Cursor Agent (линк)
Теперь агента можно запускать прямо из консоли. По сути, это те же локальные агенты, что и в IDE (видны в топбаре). При желании агент поднимается даже в GitHub Actions

6. Hooks (линк)
Позволяют вмешиваться в цикл работы агента и настраивать поведение под себя

@devallim
🔥2
Я немного устал от мешанины tailwind-классов и сделал свой пакет - styled-tailwind-variants

Когда используешь tailwindcss после styled-components или emotion, код выглядит как большая мешанина из классов, и очень хочется вынести его в отдельные мини-компоненты (особенно когда дублируется какой-то блок в коде). Для этого есть разные решения: class-variance-authority, tailwind-variants и ряд других, менее популярных. Так же раньше был классный twin.macro, который предоставляет нужный синтаксис и добавляет глубокую компиляцию, но выход tailwindcss@4 сломал всю совместимость. Автор говорит о невозможности перехода на следующую версию без поддержки со стороны tailwind (а они уже почти год отмалчиваются).

В целом, в индустрии, tailwindcss задал некоторый тренд по уходу от CSS-in-JS решений и я отчасти с этим согласен (вместо styled-components я предпочитал linaria - за возможность экстракции CSS во время билда - и старался минимизировать использование props)

Сейчас доступные инструменты для tailwindcss обычно предлагают создание CSS-классов, а не компонентов, которые сразу можно использовать. И я в этом вижу ущерб для DX, с которым решил разобраться - для себя и для тех, кому не безразлична эта тема.

Нехитрым образом, повайбкодя в Cursor с plan mode и доработав руками некоторые моменты, появилась библиотека, которую я теперь сам использую - styled-tailwind-variants.

Глобально это обертка вокруг популярной библиотеки tailwind-variants, но вместо классов на выходе готовые компоненты.

👉 Зову пробовать

@devallim
#buildinpublic #dx
🔥2
Если вам когда-то понадобится простой лендинг, а бюджета нет - начните с блоков с официального сайта TailwindCSS:
tailwindcss.com/plus/ui-blocks/preview

Примеры того, что получается, можно найти здесь (уже за денежку, но, думаю, вы найдёте способ это решить):
tailwindcss.com/plus/ui-blocks/marketing/page-examples/landing-pages

Также можно подобрать другой фон здесь - patterncraft.fun

Ну а для верстки конечно же возьмите styled-tailwind-variants (gpt отлично справится с конвертацией верстки в компоненты)

@devallim
#buildinpublic
2
Type-fest - это как “lodash”, но для типов.

Если вы разрабатываете продукты на TS - рано или поздно сталкиваетесь с вопросом: “почему этого типа нет из коробки?”

Дальше стандартный путь: идёте к GPT/гуглите, собираете свой “утилитарный” тип, радуетесь 5 минут… и забываете, где его сохранили.

Так вот - всё это уже сделали за вас. Есть пакет type-fest, где собрано вообще всё, что когда-либо нужно было в реальных проектах.

Мой топ SetRequired - превращает опциональные поля в обязательные (или наоборот SetOptional)

Советую пробежаться глазами и найти то, чему вы сами можете найти применение. Ну а если не хватает фантазии - все просто, посмотрите как другие люди его применяют

@devallim
#dx
👍3👀1
тест
1
Деплой пет-проектов

Для пет-проектов я давно использую dokploy - простая, но мощная штука для деплоя без боли (о ней вообще можно отдельный гайд писать).

Недавно захотел чуть оптимизировать рутину: под новый проект - агент для нейрокомментинга (собирает посты из каналов, генерит комментарии и шлет мне) - опять пришлось поднимать инфру, настраивать деплой, переменные и прочее.

Решил сделать удобнее:
- создать Cursor команду (о них уже упоминал)
- и использовать Dokploy API через MCP, чтобы одна команда запускала всё - создание проекта, деплой, конфиги.

Но оказалось что официальный mcp у Dokploy живёт своей жизнью - полусырой, почти не поддерживается (успел даже завести пару issues). Стало очевидно, что нужно создавать свой.

Eсли тоже деплоите пет-проекты через dokploy - зову пробовать
👉 github.com/tacticlaunch/dokploy-mcp

P.S. Были еще чуть шире идеи, но время ограничено на эксперименты:
- Сделать репу со всеми командами (в будущем скорее всего создам) и через промпт шаринг передать вам промпт, который бы скачал эту команду в проект
- Сделать хитрую систему поддержки пакета в духе настоящеего e/acc и меня очень впечатляет эта история:
- Настроить change detection на json swagger’а, чтобы мониторились изменения в dokploy api
- Слать запрос на вебхук (допустим в zappier), который бы создавал issue в репе моего dokploy-mcp и добавлял коммент с упоминанием cursor (их агент может в репах работать).
- Собственно агент бы создавал PR, который оставалось бы только проревьювить.


@devallim
#dx
1🔥1
Выделил из проекта пакет - react-portalslots

Если разберётесь - точно впечатлит. В OSS нет таких элегантных альтернатив.

- С его помощью очень удобно делать разные Layout‑штуки, не ломая логику компонентов.
- Можно локализовать рендеринг разных частей UI без глобального состояния (colocation + слоты), как описано в статье “avoid global state, colocate UI” от участницы команды radix.
- Это решает одну из самых раздражающих вещей, когда приходится писать что-то вроде:

<Layout
header={<button>Save</button>}
sidebar={<div>Navigation</div>}
>
<SomeToolbar />
</Layout>

- то есть передавать компоненты “сверху”, даже если логически они ближе к контексту внутри. Здесь же можно разместить логику прямо в нужных местах, и всё автоматом “подхватится” в layout.

👉 github.com/beautyfree/react-portalslots


@devallim
#dx
🔥3
Все-таки кросспостинг меня догнал, но из-за npm-пакетов (хотел пару месяцев назад сделать такой сервис)

Короче, с этими пакетами ситуация простая: делаю, чтобы переиспользовать в других проектах, а бонус - ещё и поделиться с сообществом. И было бы, конечно, здорово, чтобы сообщество тоже использовало, лайкало и т.д, но заниматься SEO пакетов не лежит в области профита, поэтому задача вторична.

Ну я и подумал, что было бы классно, допустим, писать статью в репозитории (а то ещё интерфейс и бэк кодить, хостить - это долго и отнимает ресурсы) в md-формате, и она по каким-нибудь площадкам кросспостилась. И реально нашёл решение на GitHub, которое кто-то навайбил 3 месяца назад и которое можно как CLI запустить в GitHub Actions.

Но, конечно же, оно не работало из коробки, т.к. автор использует type: module, а импорты без “.js”, и вообще пакет оказался не опубликованным, с косяками в документации. Я поправил, опубликовал и настроил репу с названием blog (на вырост).

Теперь могу создавать md-файлики, которые будут поститься в dev.to и Hashnode.

Делюсь тем, что уже автоматически опубликовалось:
- раз
- два

Ну а перенять опыт можно, подсмотрев, как организован репозиторий:
👉 github.com/beautyfree/blog

@devallim
#buildinpublic #dx
🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Не понимаю почему до сих пор не появились редакторы в которых одно из представлений кодовой базы это полотно

Иногда код настолько большой с большим количеством зависимостей (движок анимаций, например), что его не охватить с одного взгляда и в этом случае канвас с перелинкованными методами и зависимостями может быть единственным способом быстро понять точки входа (а может и в целом работать над проектом).

А пока нашел такой экстеншен codecanvas.app

@devallim
#dx
🔥3
Сайт со старыми играми портированными в браузер
https://dos.zone/

Там есть герои, дум, gta 1,2, фэллаут 1, дюна и много чего еще.
В том числе и мультиплеерные!
(важно заметить что на главном экране не все игры - советую пробежаться по сайдбару)

А в этом свежем видео рассказ о том как это все портируется https://www.youtube.com/watch?v=e63OrolJzNI

@devallim
🔥4
Хотел прийти с готовым инструментом в связке с repomix, но пока нет целесообразности этим заниматься, поэтому просто поделюсь этим классным “артефактом”.

Представим ситуацию, нужно:
- отрефакторить проект с помощью LLM,
- или “черрипикнуть” функционал из другого проекта в свой.

Для этого важно понимать зависимости нужного entrypoint’а - т.е. нужно пройтись по AST-дереву и собрать рекурсивно все импорты в файлах.

Есть ли уже решение для этого? Да, и не одно.

После серии экспериментов лучшим оказался madge - лёгкий, надёжный и хорошо ложится в пайплайн с LLM:


npx madge index.ts


Отличный способ быстро построить граф зависимостей и передать его в контекст модели.

Флаг -j для результата в json (больше токенов, но потенциально улучшит понимание моделькой). И сразу положим результат в файл:


npx madge -j index.ts > deps.json


Можно пойти дальше и передать пути в include параметр repomix’а и получить промпт с содержимым файлов.

⬇️ Больше в комментах (мой промпт и важное про --ts-config флаг)

@devallim
#dx
🔥3💯2
App Store выкатил новую веб-версию и забыли выключить source maps в проде.

В итоге весь исходный код торчал наружу и его уже аккуратно собрали на GitHub:
github.com/rxliuli/apps.apple.com
github.com/agentellisense/apps.apple.com.

P.S. Написано на Svelte
В CSS появилось крайне полезное свойство - corner-shape.

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

Отличный инструмент для тех, кто любит экспериментировать с визуальным языком интерфейсов.

Лично меня эта новость радует тем, что теперь без боли можно делать такую форму как squircle (а точнее corner-shape: superellipse(1.333)), которую apple использует в своих интерфейсах.

Посмотреть все в живую можно здесь:
https://codepen.io/una/pen/PwNozMX
🔥5