DocHub - документация по веб технологиям
Хватит зависеть от интернета! Документация по веб-технологиям теперь всегда в твоём кармане. Никаких «нет соединения», никаких подвисающих вкладок. HTML5, CSS3, JavaScript, TypeScript, Node.js, Angular, React, Vue.js — всё это доступно офлайн в любой точке мира. Установи приложение сейчас и забудь про поиск в сети. Ты либо тратишь время на загрузку страниц, либо работаешь. Выбирай профессионализм.
Доступно в RuStore
Шахматная 8
Число 8 - шахматное число. Ведь 8 в квадрате даёт в результате 64, количество клеток на шахматной доске.
Шахматный мир является упрощённой (примерно в миллиард раз) копией человеческого мира. Именно поэтому изучение шахмат - интереснейшее занятие.
Поздравляю прекрасных дам с наступающим праздником 8 марта и настоятельно рекомендую заняться шахматами. В нашем шахматном мире соотношение мужчины - женщины примерно 10 к 1. Не хватает нам прекрасных дам с их красотой и интуитивным подходом!
Отмазка, что "я не умею играть" не прокатывает. Специально для вас я написал "Шахматы, самоучитель для новичков". Немедленно изучайте и поражайте мужчин не только своей личной красотой, но и красотой своей игры.
Пару недель назад я презентовал тренажёр "Шахматный адрес" для тренировки кисти руки и улучшения понимания шахматной нотации.
Теперь я презентую вам подробную инструкцию к этому тренажёру.
В кратком изложении эту инструкцию можно представить так. Система даёт запрос в стандартном формате адреса шахматной клетки (например: f5). Игрок должен быстро среагировать на запрос, нажав в ответ соответствующую клетку на шахматной доске.
А в подробном изложении читайте здесь. Разобраны все элементы игры. Приведены примеры игр на компьютере и на смартфоне.
Особый интерес может быть информация для новичка-разработчика js. Здесь дан подробный разбор функционала игры.
Для новичков изучение JS - отличная стартовая точка для погружения в IT.
Широкий спектр применимости. JS универсален: он применяется как на клиентской стороне (в браузерах), так и на серверной (через Nodejs).
Низкий порог входа. Начало работы с JS довольно простое. Можно изучать основы прямо в браузере, используя встроенный инструмент разработчика. Уже сейчас вам дан готовый пример, с которым вы можете "поиграться".
Огромная библиотека ресурсов. Интернет полон бесплатных курсов, руководств, статей и учебных материалов по JavaScript. Существует огромное сообщество опытных разработчиков, готовых помогать начинающим решать проблемы и отвечать на вопросы.
Популярность и востребованность. JS давно стал стандартом де-факто для веб-разработки. Фреймворки и библиотеки на основе JS (React, Vue, Angular, Nextjs и другие) используются повсеместно, создавая огромный рынок вакансий и карьерные перспективы.
Легкое освоение базовых концепций. JS хорошо подходит для понимания фундаментальных принципов программирования, таких как циклы, условия, функции, работа с объектами и массивами. Эти знания легко переносятся на другие языки программирования, помогая быстрее осваивать новые технологии.
Итак, прекрасные дамы, надеюсь, я вас убедил заняться шахматами и программированием на JS. Прямо сейчас и начинайте!
PS
Обратите внимание на картинке на шахматную позицию. Это необычная шахматная задача. Белые должны поставить мат в 3 хода, но так, чтобы сохранилась цифра 8. Подсказка здесь.
...
Первоисточники:
Игра тренировка "Шахматный адрес".
Программа сделана на чистом нативном JS.
Вы можете бесплатно не только прокачать знание шахматной нотации и быстроту реакции, но также скачать дистрибутив и потренироваться в программировании на этом реальном несложном примере.
Игра тренировка "Шахматный адрес" - большой анонс
Подробная инструкция и разбор функционала.
"Шахматы, самоучитель для новичков - 2"
Играть в шахматы - хорошо! Но играть хорошо - ещё лучше. После прочтения и изучения второй части самоучителя вы научитесь обыгрывать сильных шахматистов, возможно, даже мастеров и гроссмейстеров.
Шахматы. 8 Марта. Мат в 3 хода.
Условие: цифра 8 должна сохраниться на доске в итоговой позиции.
===
Пишешь код, а звучит музыка. Как я сделал бесплатную лайвкодинг-платформу для создания музыки с ИИ-агентом и почему вам стоит попробовать
Всем привет! Знаете это чувство, когда ты ищешь решение какой-то конкретной проблемы, а находишь целое новое хобби? Вот у меня примерно так и вышло.
Как значит было дело. Сидел я, как обычно, никого не трогал, починял примус... а если конкретнее - делал небольшую игру-платформер. Задумка была в том, чтобы она была процедурно-генерируемой, причем я хотел чтобы все уровни генерировались через большую языковую модель. Как оказалось позже, идея была провальной, потому что LLM не очень хорошо понимает расстояние, и я в итоге сделал процедурную генерацию просто на скриптах. Ну да ладно, не об этом сейчас.
И всё вроде бы хорошо, уровни генерируются, персонаж бегает, но единственная проблема с которой я столкнулся - это музыка. Ну реально, что делать со звуком когда у тебя претензия на процедурность? Вставлять музыку в base64 - это какая-то жесть. Подключать MP3 или MIDI - тоже не прикольно когда у тебя всё генерируется на лету. Тут я вспомнил про музыку из кейгенов, но оказалось что и чиптюн не встроить просто так на веб-страницу.
В итоге я остановился на какой-то совсем примитивной версии из нескольких нот и отложил это до лучших времен. Типа потом разберусь.
Но не тут-то было! Буквально на следующее утро в телеграм-канале я увидел пост про Strudel. И знаете - меня как током ударило. Потому что эта штука делала именно то, что я искал и не смог реализовать сам. Движок для програмимрования музыки. Прямо в браузере. Подключается одной строкой. Код для мелодии занимает буквально ничего.
Я открыл их сайт, вставил пример кода, нажал play... и залип на два часа. А потом ещё на три. А потом скормил их документацию нейросети, сделал генератор треков, встроил музыку в ту самую игру, сделал трек который дообработал в нейронке, сделал промптер... Короче, меня понесло. И понесло настолько сильно, что в какой-то момент я понял - мне мало просто пользоваться. Я хочу сделать свою версию. Лучше, удобнее и на русском.
Так родилась Булка. Но обо всём по порядку.
Меня зовут Илья, я основатель сервиса для генерации изображений ArtGeneration.me, блогер и просто фанат нейросетей. При этом не являюсь программистом в классическом смысле - т.е. вообще совсем. Скорее энтузиаст, предпочитающий генерировать код с помощью нейросетей, а не писать его с нуля. Но мне дико нравится ковыряться в разных технологиях и делать из них что-то своё.
И вот именно эта комбинация - "не умею кодить, но очень хочу" - привела меня к лайвкодингу музыки. Потому что Strudel (а теперь и Булка) - это как раз тот случай, когда тебе не нужно быть ни музыкантом, ни программистом. Достаточно быть любопытным. А если подключить ИИ-агента - то вообще можно просто писать на русском "сделай мне техно-бит" и наслаждаться результатом.
Но давайте сначала разберемся, что это за зверь такой - лайвкодинг.
❯ Что такое лайвкодинг и причем тут Штрудель
Для тех кто не в курсе - лайвкодинг это когда ты пишешь код и он тут же превращается в музыку. В реальном времени. Ты меняешь строчку - звук меняется. Добавляешь новую - появляется ещё один инструмент. Это как диджеинг, только вместо вертушек у тебя текстовый редактор. И да, люди реально так выступают вживую - есть целое комьюнити которое устраивает лайвкодинг перформансы, это называется Algorave. Например посмотрите, что творит в реальном времени в Штруделе Switch Angel, одна из участниц этой движухи.
У истоков всего этого стоит Tidal Cycles - язык паттернов для создания музыки через код. Штука мощная, но для запуска нужно было ставить Haskell, SuperCollider и ещё кучу всего. Для гиков - ок, для нормальных людей - гиблое дело.
И тут появился Strudel - порт Tidal Cycles на JavaScript. Вся та же мощь паттернов, но работает прямо на веб-странице. Вот чтобы вы понияли насколько это компактно, смотрите:
// Простой бит - бочка и снейр
s("bd sd bd sd")
Одна строчка. Одна. Строчка. И у вас играет ритм. Хотите добавить хай-хэты?
// Бочка, снейр и хай-хэты
s("bd sd bd sd, hh*8")
Две строки - уже полноценная ритм-секция. А вот так звучит классический хаус-бит на драм-машине Roland TR-909:
sound("bd*4, [~ cp]*2, [~ hh]*4").bank("RolandTR909")
А вот басовая линия:
note("c2 e2 g2 a2").s("sawtooth").lpf(800)
Это note задает ноты, .s("sawtooth") выбирает пилообразную волну как тип синтезатора, а .lpf(800) - это фильтр низких частот на 800 герц. Если вам это ни о чём не говорит - не парьтесь, мне тоже поначалу не говорило. Суть в том, что за пару строк кода вы получаете живой, пульсирующий звук. И можете крутить его как угодно прямо на лету.
А самое крутое - из коробки доступны сотни семплов. Драм-машины 808 и 909, оркестровые инструменты, синтезаторы, фолк со всего мира. Не нужно ничего скачивать и подключать, просто пишешь название банка - и играешь. А если вдруг встроенных мало - можно подключить любой пак семплов с GitHub или загрузить прямо с компьютера. Так что ветераны Fruity Loops, ваши гигабайты семплов накопленные за годы - тоже пойдут в дело, не переживайте.
Сфера применения ограничена только фантазией. Можно медитативно вайбкодить вечерком, подбирая грувы. Можно встраивать в свои веб-приложения. Можно выступать вживую. Но у оригинального Штруделя были проблемы, которые мне не давали покоя...
❯ Почему Штрудель - это круто, но мне было мало
Окей, Strudel прекрасен. Я залипал в нём неделями, делал треки, встраивал в проекты, даже промптер для нейронки написал чтобы она генерировала мне паттерны. Но чем больше я им пользовался, тем больше замечал вещей которые меня раздражали.
Во-первых - всё на английском. Интерфейс, документация, туториалы, комментарии в примерах. И как бы не то чтобы это прямо проблема - понятно что можно перевести страничку в браузере. Но есть ведь ещё встроенный редактор, который подсказывает функции и автодополнения, и его вот уже гугл-транслейтом не возьмёшь. Так что было решено делать полную качественную локализацию - не просто перевод интерфейса, а именно всю экосистему: документацию, воркшоп, подсказки в редакторе.
Во-вторых - нет записи. Вот ты сидишь, накрутил крутой бит, он играет, ты доволен... а как его сохранить? Распечатать код на принтере и показать другу распечатку? Ну уж нет, не наш вариант. Нужна возможность записать трек в максимальном качестве и потом использовать. При желании можно создавать семплы прямо в Булке, записывать их и встраивать в новые треки - как будто перед паровозом строите рельсы. Но кнопки для этого в оригинале не было.
В-третьих - никакого ИИ-помощника. Strudel - это всё-таки про код. И если ты не разобрался в синтаксисе паттернов (а он местами бывает крайне нетривиальный) - ты один на один с документацией. Нельзя просто написать "хочу грустный эмбиент с реверберацией" и получить результат. А я как человек, который все последние годы живет в нейросетях, понимал что именно так это и должно рабортать.
В-четвертых - баги. Штрудель тоже делали энтузиасты, и они наэнтузиастили там немало косяков. Например Hydra - движок для визуализаций - была очень не полностью интегрирована. Из-за этого нельзя было включить на фон видео, или гифку, или ютуб-ролик. Я это починил, но об этом чуть позже.
И вот в какой-то момент я поймал себя на мысли: я же не просто хочу пользоваться Штруделем. Я хочу сделать его лучше. Для себя и для всех русскоязычных энтузиастов. С ИИ-агентом, с записью, с нормальной локализацией. Штрудель - это выпечка. Значит мой форк тоже будет выпечкой.
Так появилась Булка. 🍞
❯ Встречайте Bulka - что конкретно я поменял
Bulka - это форк Strudel с открытым исходным кодом. Всё бесплатно, код на GitHub. Я взял оригинал и начал его методично допиливать. Вот что получилось.
Полная русская локализация. И я имею ввиду реально полная. Не просто кнопочки в интерфейсе перевёл - это было бы слишком легко. Перевёл всю документацию. Весь интерактивный воркшоп - это пошаговый курс где вы прямо в браузере учитесь делать музыку, от первых звуков до сложных паттернов. Подсказки в редакторе кода, описания функций, примеры. Открываешь bulka.app/workshop/getting-started и перед тобой полноценная база знаний на русском. Там реально огромный объём материала - секции по семплам, синтезаторам, аудио-эффектам, MIDI, визуализациям... Всё переведено.
Запись в WAV. Одна кнопка - нажал, записал, скачал файл в максимальном качестве. Казалось бы мелочь, но именно она открывает кучу возможностей. Но об этом чуть позже, когда расскажу про свой любимый кейс с Suno.
Починил Hydra. Hydra - это движок для генеративных визуализаций, он встроен в редактор и позволяет создавать графику которая реагирует на вашу музыку в реальном времени. Осциллографы, спектроанализатор, пианоролл - это всё из коробки. Но в оригинале интеграция была кривая. Например нельзя было поставить видео на фон, или гифку, или ютуб-ролик. Я это починил. Теперь можно и видео, и гифки, и ютуб, и даже вебкамеру подключить. Не знаю зачем вам вебкамера на фоне лайвкодинга, но это весело и это работает.
Undo/Redo. Звучит банально, но в оригинале не было нормальной отмены действий. Теперь есть, с визуальной индикацией - видно сколько шагов можно откатить.
Регулировка громкости. Удобный слайдер прямо в интерфейсе. В оригинале громкость регулировалась только из кода. Знаете, когда ты в час ночи экспериментируешь с басом и он вдруг вжарит на полную - хочется иметь слайдер поближе.
Шеринг и лента. Поделиться треком можно одной ссылкой - скинул другу, он открыл и сразу слышит что ты нагородил. Без регистрации и скачивания. Плюс добавил ленту где собираются примеры - можно посмотреть что делают другие и вдохновиться.
Поддержка MIDI и OSC. Для тех кто понимает - Булку можно использовать как секвенсор в связке с железом и DAW. Подключаете свой синтезатор или драм-машину и управляете ими из кода.
Офлайн-режим. Булка работает как PWA - можно установить на рабочий стол и исполльзовать даже без интернета. Удобно если хочется покодить музыку в поезде или в самолёте.
И это я ещё не добрался до главной фичи - ИИ-агента. Но про него стоит рассказать отдельно.
❯ AI-Агент: пиши на русском - получай музыку
Вот мы и добрались до самого вкусного. Того, ради чего собственно и стоило огород городить.
Когда я только начинал думать про агента, у меня в голове была одна конкретная картинка. Представьте: вы сидите, музыка играет, и вы просто пишете в чат - "добавь бас", "теперь синты", "сделай переход поплавнее". И музыка бесшовно обновляется прямо во время воспроизведения. Вы не трогаете код руками вообще. Просто выстраиваете трек по кусочкам, как режиссёр который говорит актёрам что делать. В идеальном мире это было бы убийственной штукой для лайвкодинга с живым выступлением - ты буквально разговариваешь с музыкой, а она слушается.
И знаете что? Оно работает. Не идеально конечно, LLM-ки иногда тупят и ломают паттерн, но сам принцип - он рабочий. Я реально так делаю: запускаю базовый бит, потом через чат постепенно наращиваю слои, и это ощущается совершенно иначе чем ковырять код руками.
В Булку встроен полноценный ИИ-агент. Не просто чатик куда можно написать вопросик - а именно агент с инструментами. Он умеет читать ваш код, редактировать его, запускать и останавливать музыку, искать по документации Strudel и подсвечивать нужные фрагменты прямо в редакторе. Всё это через function calling - то есть модель сама решает какой инструмент вызвать и когда.
Как это выглядит на практике? Открываете вкладку Чат, пишете "сделай техно-бит 120 bpm с глубоким басом" и... агент сам пишет код, вставляет его в редактор и запускает воспроизведение. Вы слышите результат. Не нравится бас? Пишете "замени бас на что-нибудь поглубже и добавь реверб". Агент находит нужный фрагмент в коде, меняет его и перезапускает. Всё на русском, всё в реальном времени.
У агента есть 8 инструментов которыми он оперирует:
readCode - прочитать что сейчас написано в редакторе
setFullCode - заменить весь код целиком (когда пишет с нуля)
editCode - найти кусок кода и заменить на другой (когда правит)
appendCode - дописать что-то в конец
playMusic / stopMusic - запустить или остановить воспроизведение
searchDocs - поискать в документации Струделя нужную функцию или приём
highlightCode - подсветить конкретный фрагмент в редакторе, чтобы показать о чём он говорит
То есть это не просто "ответил текстом и разбирайся сам". Агент буквально работает с вашим проектом как напарник. Написал код - вставил. Нашёл ошибку - починил. Не знает какую функцию использовать - залез в документацию и нашёл.
Кстати, про ошибки. Булка умеет ловить ошибки кода и показывать кнопку "В чат" прямо на сообщении об ошибке. Нажали - ошибка улетела агенту, он её прочитал, понял что не так и исправил. Не нужно копировать стектрейс руками и объяснять в чем проблема. Одна кнопка - и он сам разберётся.
Ещё прикольная штука - можно выделить кусок кода в редакторе и отправить его агенту с комментарием. Типа "вот этот блок - сделай чтобы он звучал как 80-е". Агент получит именно выделенный фрагмент и будет работать с ним, а не со всем файлом.
Какие провайдеры поддерживаются?
Я специально сделал так чтобы было максимум выбора. Пять платных провайдеров:
OpenAI - GPT-5.2, GPT-5.1, GPT-5.1-Codex-Max и другие
Anthropic - Claude Opus 4.5, Claude Sonnet 4.5, Claude Haiku 4.5
Google Gemini - Gemini 3 Pro, Gemini 2.5 Flash, Gemini 2.5 Pro
Z.AI - модели GLM
OpenRouter - а это вообще агрегатор, через него доступны сотни моделей от разных провайдеров. Подключил один ключ - и выбирай из всего что есть на рынке
Списки моделей подгружаются динамически с API провайдеров. Вышла новая модель - она автоматически появится в списке, мне не нужно обновлять код. Для Claude и Gemini есть отображение extended thinking - прямо видно как модель рассуждает перед тем как дать ответ. Всё работает в режиме стриминга, токен за токеном, как вы привыкли в ChatGPT.
Для подключения нужен API-ключ соответствующего провайдера. Ключ хранится локально в вашем браузере (localStorage), на сервера Булки ничего не уходит. Код и сообщения отправляются напрямую провайдеру. Полная приватность, исходники открыты - можете сами убедиться.
И тут есть один нюанс. Раз всё выполняется локально в вашем браузере - то и все ограничения вашего интернет-провайдера тоже действуют. А это значит что до некоторых провайдеров LLM вы можете просто не достучаться из-за блокировок РКН. Если агент упорно не отвечает, а интернет вроде бы работает - вы знаете что делать. Три волшебные буквы, и провайдеры снова доступны.
Но я понимаю что не у всех есть API-ключи. И не все готовы за них платить чтобы просто потыкать. Именно поэтому я прикрутил кое-что ещё...
❯ А если нет API-ключа? GPT4Free спешит на помощь
Окей, я понимаю ситуацию. Вы прочитали предыдущий раздел, загорелись, открыли Булку, а потом увидели поле "API ключ" и такие - ну нафиг, я просто хотел потыкать. Знакомо. Именно поэтому я прикрутил в Булку GPT4Free - опенсорсный проект который даёт бесплатный доступ к разным языковым моделям. Без ключей. Без регистрации. Без оплаты. Открыл - и поехал.
Настройка занимает секунд десять. Открываете вкладку Чат, жмёте шестерёнку в настройках, выбираете провайдер GPT4Free, выбираете модель и провайдера из списка - готово, можно писать. Список моделей подгружается автоматически.
Но давайте я буду честен - бесплатный сыр имеет свои особенности. GPT4Free работает не так как платные провайдеры. Главное отличие - модели через GPT4Free не поддерживают function calling. Это значит что агент не может напрямую вызывать свои инструменты. Вместо этого я реализовал симуляцию через текстовые маркеры - модель генерирует текст со специальными метками типа [PLAY] и [STOP], Булка их парсит и выполняет соотвтествующие действия.
Что работает:
Генерация музыкального кода - пишете "сделай драм-н-бейс" и получаете код
Код из ответа автоматически вставляется в редактор
Запуск и остановка музыки через маркеры
Объяснение кода и помощь с синтаксисом Strudel
Если в ответе есть код но нет маркеров - музыка запустится автоматически
Что не работает:
Поиск по документации Strudel
Просмотр примеров кода
Подсветка фрагментов в редакторе
То есть базовый флоу "написал запрос - получил код - музыка заиграла" работает. Но всякие продвинутые штуки типа "найди в доке как сделать арпеджио" - увы нет. Для этого нужен полноценный агент с API-ключом.
И ещё - бесплатные провайдеры бывают капризные. Некоторые могут вставлять рекламу в ответы. Скорость ответа зависит от нагрузки на провайдера и иногда приходится подождать. Какие-то провайдеры могут временно не работать. Если один не отвечает - просто попробуйте другой, их там много. Ну и лимиты на количество запросов тоже бывают. Короче, для экспериментов и знакомства с Булкой - отлично. Для серьёзной работы - лучше взять нормальный ключ.
А где взять API-ключи если решили?
Тут на самом деле всё просто:
Google Gemini - aistudio.google.com/apikey. У гугла есть бесплатный тир, так что можно получить ключ и пользоваться не заплатив ни копейки. Для старта - самый простой вариант.
Anthropic - console.anthropic.com. Claude Sonnet 4.5 отлично справляется с генерацией музыки, плюс у него есть extended thinking.
OpenAI - platform.openai.com/api-keys. Ну тут всё понятно, GPT классика жанра.
OpenRouter - если не хотите заводить ключи у каждого провайдера по отдельности, OpenRouter даёт доступ к сотням моделей через один аккаунт. Один ключ - и выбирайте из всего что есть на рынке. Удобно.
Разница между GPT4Free и платным режимом если совсем коротко: платный агент ищет по документации, сам правит код точечно, подсвечивает фрагменты, стабильно и быстро работает. Бесплатный - генерирует код и вставляет его, запускает музыку, но без продвинутых инструментов и с переменной стабильностью. Для максимального кайфа я бы рекомендовал взять ключ от Gemini (бесплатно же) или Anthropic - Claude реально хорошо пишет музыкальный код. Но начать с GPT4Free чтобы пощупать - милое дело, для этого он и сделан.
❯ Мой любимый кейс: Bulka + Suno = полноценные треки
Ладно, тут я хочу рассказать про штуку которая лично меня прёт больше всего. Это не фича Булки как таковая, это скорее воркфлоу который я для себя нашёл и теперь использую постоянно.
Смотрите в чём фишка. Булка создаёт программную, алгоритмическую музыку. Это значит что вы контролируете каждую ноту, каждый паттерн, каждый ритмический рисунок. Звучит это как синтезатор - чистый электронный звук. Круто, но до продакшн-качества далековато. А Suno (и подобные нейросети) наоборот - генерирует трек целиком, с вокалом, с аранжировкой, звучит как студийная запись. Но проблема в том что ты почти не контролируешь результат. Написал промпт "сделай грустный лоу-фай" и молишься чтобы повезло с мелодией. Иногда везёт, иногда получается каша.
И вот я подумал - а что если объединить?
Делаю так. Сажусь в Булку, накидываю мелодию которая мне нравится. Подбираю ноты, темп, может быть басовую линию отдельно прописываю. Трачу минут 15-20, но зато точно знаю что мелодия - огонь, потому что я её слышу в реальном времени и подкручиваю пока не зазвучит как надо. Потом жму кнопку записи, скачиваю WAV. Одна кнопка, помните?
А дальше беру этот WAV и скармливаю в Suno как референс. И вот тут начинается магия. Suno берёт мою мелодию как основу и достраивает вокруг неё полноценный трек - с живыми инструментами, с вокалом если нужно, с продакшном. Но мелодическая основа - моя. Та которую я сам выстроил нота за нотой.
Результат получается на порядок лучше чем если генерить в Suno с нуля. Трек не рваный, мелодия осмысленная, потому что я её контролировал. А Suno добавляет то чего Булка дать не может - живое звучание, аранжировку, глубину.
По сути Булка тут работает как инструмент точной настройки. Ты выстраиваешь скелет трека - ритм, мелодию, басовую линию. А нейросеть натягивает на этот скелет мясо. И это реально мощная связка, потому что ты получаешь и контроль, и качество одноврменно. Чего по отдельности ни один из этих инструментов не даёт.
Кстати, можно и наоброт. Сгенерировать в Suno что-то интересное, вытащить оттуда мелодию на слух, записать её в Булке как паттерн и дальше развивать уже программно. Или взять семпл из Булки и закинуть его не в Suno, а в любую другую нейросеть для музыки, или в DAW типа Ableton - WAV он и в Африке WAV.
❯ Для кого это и что ещё можно делать с Булкой
Может показаться что Булка - это какая-то супер-нишевая штука для гиков которые одновременно и программисты и музыканты. Не-а. Давайте разложу.
Если вы музыкант - это новый инструмент в вашем арсенале. Паттерны в Strudel позволяют создавать ритмические структуры которые руками на миди-клавиатуре хрен набъёшь. Полиритмия, евклидовы ритмы, рандомизация с сидом - код даёт точность и контроль которых у классических DAW просто нет. Плюс MIDI и OSC поддержка - Булка может управлять вашим железным синтезатором напрямую. А если выступаете вживую - с агентом можно буквально разговаривать с музыкой на сцене, направляя трек текстом в реальном времени.
Если вы программист - музыка как ещё одна область для творчества. Язык паттернов реально элегантный - функциональное программирование в чистом виде. Цепочки трансформаций, композиция функций, ленивые вычисления. Если вы фанат Haskell или Clojure - вам тут понравится. Ну и пакеты на npm под неймспейсом strudel - можно встроить движок в свой сайт, в игру, в интерактивную инсталляцию. Я собственно с этого и начинал, когда делал процедурно-генерируемую игру.
Если вы вообще не программист и не музыкант - вот тут как раз и пригождается агент. Просто пишете на русском что хотите услышать. "Сделай бит как в 90-х", "хочу что-нибудь грустное на пианино", "драм-н-бейс с тяжёлым басом". Агент напишет код за вас. Вам вообще не надо разбираться ни в музыке ни в программировании. А если захотите - есть полностью русский воркшоп который проведёт от первого звука до сложных композиций.
Если вы стример или контент-мейкер - тут сразу пачка применений. Hydra визуализации - это генеративная графика которая пульсирует и меняет цвета в такт вашей музыке. Включаете на втором мониторе, захватываете в OBS - готовый анимированный фон для стрима который никогда не повторяется. Бесплатно, без After Effects. Плюс уникальные семплы для роликов и музыкальные подложки записанные в WAV - никаких проблем с авторскими правами на сгенерированый код.
Если вы геймдев, подкастер или просто нужны звуки - из коробки доступны сотни семплов: драм-машины 808/909, оркестровые инструменты, синтезаторы, фолк со всего мира. Комбинируете их как угодно, накладываете эффекты, записываете в WAV - и получаете уникальные звуки для своих проектов. Нужен необычный эффект для игры? Подложка под подкаст? Джингл для ролика? Накрутил в Булке за пять минут, записал, вставил. Причём звуки получаются уникальные, потому что вы их буквально програмируете.
Если вы преподаватель - Булка это готовая платформа для обучения основам программирования через музыку. На русском. В браузере. С мгновенной обратной связью. Ученик написал s("bd sd") и сразу услышал бочку и снейр. Попробуйте объяснить ребёнку циклы через for(i=0; i<10; i++) а потом через "bd*8" где бочка повторяется 8 раз - и скажите мне что сработало лучше. Звук как обратная связь - это совершенно другой уровень вовлечения.
Или если вам просто скучно вечером - откройте bulka.app, выберите GPT4Free чтобы не париться с ключами, напишите "удиви меня" и посмотрите что получится. Или попросите агента "сделай что-нибудь расслабляющее в стиле эмбиент" - откиньтесь в кресле и залипните на полчаса под генеративную музыку с визуализациями. Знаете, иногда после рабочего дня это именно то что нужно. Терапевтичнее любого плейлиста в спотифае, потому что ты сам это создал. Ну или агент создал. Но по твоей просьбе, так что считается. Пять минут. Бесплатно. В худшем случае потеряете пять минут, в лучшем - найдёте новое хобби. Я вот нашёл, и оно меня до сих пор не отпускает.
❯ Поддержите проект!
Булка - полностью бесплатная и опенсорс. Я не беру денег, не показываю рекламу, не собираю ваши данные и ничего из этого не планирую. Код открыт, лицензия GNU AGPL v3.0 - берите, форкайте, контрибьютьте если хотите. Мне просто кайфово делать штуку которая приносит людям радость.
Но есть одна вещь где каждый может помочь!
Мы сейчас на Product Radar и очень хотим забрать звание "Продукт недели". Каждый голос на счету - буквально каждый, ведь кто ещё поддержит отечественный опен сорс. Проголосовать можно за минуту:
Заходите на productradar.ru
Находите Bulka.app в списке проектов
Жмёте стрелочку вверх справа от названия чтобы она стала синей
Авторизуетесь через Google или Яндекс в один клик
После авторизации ещё раз нажимаете на стрелочку вверх - готово
Пять кликов. Мне будет очень приятно, а вам ничего не стоит.
Ну и если Булка вам зашла:
Поставьте звёздочку на GitHub - это бесплатно а мне греет душу
Попробуйте bulka.app прямо сейчас - серьёзно, прям щас откройте в соседней вкладке
Пройдите воркшоп если хотите разобраться
Почитайте документацию по агенту если хотите подключить ИИ
Заходите в телеграм-сообщество - там можно задать вопрос, показать свой трек или просто потусить
А если вы разработчик и вам понрваилась идея - приходите контрибьютить, код открытый, задачи есть. Или просто напишите мне, может нам по пути.
Словарус.рф 2.0 — русская замена иностранных слов
Сайт Словарус 2.0 – это вторая улучшенная версия сайта с русской заменой иностранных слов, который я ранее делал по заказу Love Media и лично господина Маркелова.
Задача. Восстановить сайт из веб-архива и сделать его лучше.
История проекта
Первая версия сайта Словарус была запущена в 2012 году. Тогда я старался активно развивать свои навыки программирования. Создание этого сайта тогда сильно помогло мне прокачать свои знания в этой сфере.
Шло время, автор идеи проекта постепенно потерял к нему интерес. Я отдалился от веб-разработки и занялся комплексным интернет-маркетингом. В какой-то момент сайт перестал существовать и о нём все забыли. Но спустя время я снова увлекся веб-разработкой. Однажды вспомнил про этот сайт и решил его восстановить и улучшить. Так и начинается история сайта Словарус 2.0.
Дизайн и верность корням
Оригинальный дизайн сайта был почти полностью сохранён – это дань уважения автору и обеспечение преемственности версий. Тем не менее я реализовал ряд изменений по дизайну. Проверенный временем шрифт Georgia был заменен на более современный и выразительный шрифт Lora. В оформлении также добавился дополнительный акцентный оранжевый цвет.
Особенности новой версии
Конечно, главным улучшением на новой версии стала адаптация под мобильные устройства. Сейчас это считается стандартом для всего сайтостроения. А в 2012 году об этом думали гораздо меньше.
Доработки дополнительных разделов
Помимо основного движка сайта и главного функционала я также доработал дополнительные разделы сайта. Такие как «Список слов» и «Присылайте слова» и вот что получилось сделать:


Список слов
Раздел со списком слов получил полноценный быстрый поиск взамен изящного, но уже примитивного поиска по странице через «Ctrl+F». Также на месте осталась функция перехода к конкретному слову по якорю.
Присылайте слова
Присылать новые слова стало ещё удобнее. Ранее это был просто адрес электронной почты, теперь его место заняла полноценная форма обратной связи, которая сохраняет предложения в системе управления сайтом.
Контентное развитие проекта
Помимо технического улучшения и легкого рестайлинга я также дополнил и планирую дополнять базу слов проекта. Помимо этого я предусмотрел возможность добавления страниц с подробным описанием пар англицизм + замена. Это дает широкие возможности по дальнейшему масштабированию контента на сайте.
Система управления и технические особености
Основой сайта стала моя любимая CMS WordPress. Слова добавляются как страницы со специальным шаблоном к которому также привязана группа произвольных полей (ACF).
Заключение
Эта работа вызвала у меня много приятных чувств и воспоминаний. Я мысленно вернулся в те времена, когда только начинал заниматься разработкой сайтов. Мир был совсем другим.
Если вы хотите поддержать проект, напишите мне, а ещё присылайте слова
Автор: Тимофей Кузнецов (Tiku Digital)
Сделал игру MasterMind при помощи БЕСПЛАТНЫХ нейросетей
Сейчас этим никого не удивить, но все же смысл в посте есть - это пост сравнение нейросетей, кто лучше. Началось все с того что как-то давным давно я сидел и захотел какую-нибудь игру в браузере на javascript чтобы можно было играть просто открыв в браузере, без всяких установок и ничего лишнего. Тогда я ее делал пару вечеров, а может и больше и получилась она максимально простая - белый фон, без всяких эффектов, но небольшая и вполне работающая, сейчас я хочу ее выложить в чуть обновленном виде - просто чтобы не было белого фона - мне кажется темный фон солиднее (попросил нейронку обновить стили, остальная логика моя) и вот как она стала выглядеть:
А это ссылка чтобы поиграть https://boolkin.github.io/html/Vibe/MasterMind/mm-my.html
Но поиграть можно в более продвинутые игры, потому что когда узнал про нейросети, я решил сделать такую при помощи нейросети. В прошлом году в августе я убил примерно 3 дня чтобы довести до текущего вида игру которую играю периодически сам:
Поиграть можно тут: https://boolkin.github.io/html/Vibe/MasterMind/
Делал я это при помощи Qwen. Как и говорил, мне потребовалось несколько часов чтобы довести до играбельного вида, а до нынешнего 3 дня, но и добавил кучу функций еще (больше 1000 строк), поэтому эта игра самая навороченная. На тот момент нейросети были не такие умные как сейчас, поэтому результат требовал много трудозатрат. Сейчас же они стали умнее, и буквально с одного промпта (но очень качественного и продуманного что важно, если хочется конекретный результат) они могут сгенерировать то что просит пользователь практически сразу. И именно поэтому я и решил написать эту статью чтобы об этом рассказать.
В общем для того чтобы тестировать умность, я придумал такой промпт и отправлял его нескольким нейронкам, чтобы они сгенерировали код как и просил:
Нужно разработать игру mastermind на html, css и js с простым адаптивным дизайном для удобного игрового процесса на мобильном устройстве.
Задача игрока угадать последовательность из 4 цветов (цвета могут повторяться в последовательности). Игра состоит из игрового поля, блока с текущей попыткой и панели управления. Сверху игровое поле, под ним блок с текщей попыткой и в самом низу панель управления (в нижней части экрана). Панель управления состоит из блока с 6 разноцветными кругами (конфигурация 3*2) и справа от блока с цветами будет блок из 2 кнопок ("проверить" и "убрать". распологаются друг под другом) в самом низу должна быть кнопка "новая игра".
По клику на каждый круг этот цвет должен наполнять текущую попытку (блок текущей попытки), заполняя игровую зону последовательно друг за другом, что означает что если щелкнул например красный круг первым, то он встает в угадываемую последовательность на первое место. После заполенения 4 цвето нажимается кнопка "проверить" после чего вся последовательность перемещается в игровое поле с номером попытки и результаотм в виде черных и белых кружов указывающие на соответствие цветов в угадываемой последовательности (черный - цвет на своем месте, безый - цвет есть, но не на своем месте). Если нажать на кнопку "убрать" до проверки то из текущей попытки убирается последний добавленный цвет и можно добавить другой при ошибке. Угадываемые последовательности цветов в игровой зоне нужно заполнять снизу вверх: это означает что последняя угадываемая последовательность цветов должна находиться всегда внизу, и обязательно прикреплена к нижнему краю игрового поля (выравнивание по низу внутри игрового поля). Попытки пронумеровать и расположить так чтобы первая была вверху, последняя внизу. (например было 3 попытки соответственно вверху первая, ниже вторая, еще ниже третья - все три прилипают к нижнему блоку с текущей попыткой). При угадывании выдавать сообщение с количеством попыток и просмотром правильной комбинации Нужно использовать только javascript html и css - все в одном файле чтобы запустить локально.
Этот промпт уже уточненный, до него был еще чуть размытее и чаще всего нейронки ошибались на нем слали совсем не то что нужно. Я очень удивился когда на arena.ai на том пропте claude-opus-4-6 сгенерировал отличную играбельную игру и все как я и просил, с теми нюансами. В тот момент я осознал что они теперь на это способны. Но клод это платная нейросеть, в России не доступна, а хочется бесплатных, и они есть. И начну с того что меня прям удивило. Это гугл. Если не авторизовываться то на главной странице поисковика есть режим ИИ и ему можно задать запрос в чате, я спросил, и он выдал замечательный маленький код (самый маленький) и при этом рабочий - очень круто. Скрины выкладывать не буду, буду кидать просто ссылки: https://boolkin.github.io/html/Vibe/MasterMind/mm-goog.html (10 кБ всего = 305 строк. Моя версия 6 кБ = 196 строк)
Дальше снова квен qwen, но он отработал не сразу, только режим веб выдал играбельную версию по запросу, остальные режимы и режим по умолчанию не справились. Играть тут: https://boolkin.github.io/html/Vibe/MasterMind/mm-qwen-web.html (18кБ = 515 строк)
Потом есть другая нейросеть, которая меня удивила: Kimi. Как-то я ей не пользовался особо, но он сделала сходу очень приятную игру и тоже с небольшим объемом: https://boolkin.github.io/html/Vibe/MasterMind/mm-kimi.html (20кБ, 660 строк)
Нашумевший дипсик справился не сразу тоже, только в режиме с думаньем (thinking) он смог сгенерировать лучше, играть можно, но в целом я не сильно доволен, если честно, особенно глядя на то как другие делают. И вообще дипсик не заходит, но говорят не совсем для кодинга он, как знать. И еще его версия самая кривая, интерфейс необычныйи может под мобильном смотреться не очень, но принял результат потому что он как бы соответствует ТЗ, и поэтому надо включить в обзор, к тому же не так много нейронок бесплатных бывает. Проверить его творчество: https://boolkin.github.io/html/Vibe/MasterMind/mm-deep-th.html (553 строки)
Это все китайские нейросети (кроме гугла), и следующая тоже китайская: GLM (Z.ai). Я ей частенько пользуюсь она мне нравится, но у нее есть иногда проблемы что как будто не хватет токенов, и GLM 4.7 иногда даже лучше чем 5 версия, просто потому что 5 перестает отвечать, просто тупо не пишет и все. В данном случае самый киберпанковый интерфейс - очень эффектно, очень красиво, хотя и спорно. Весит тоже не много, относительно, хотя и конечно с гуглом совсем не сравнится, но красивее, однозначно: https://boolkin.github.io/html/Vibe/MasterMind/mm-glm.html (22 кБ, 872 строки)
В обзор не попали российские нейросети. Алиса АИ не смогла дописать код дважды - видимо токены совсем мало дают, при том что даже есть подписка и пишет алиса плюс активна - считаю это позор, особенно после того что творят китайцы. и Гигачат не попал тоже - он сгенерировал причем минимальный код - но это не работало практически никак, верстка поехавшая, играть невозможно результат печальный.
И еще я запустил на локальной машине qwen 4b instruct и на удивление он выдал вполне неплохой код, это выгляело стремно, совсем не так, но это играло. криво, но играло. Я удивлен. 372 строчки 3308 токенов на ноуте с картой 1650 - это хороший результат
Большая Пятница: шахматы и js
Наши встречи по пятницам неожиданно стали доброй традицией. И вот опять мы встречаемся после бурной трудовой недели в уютном дружеском кругу. Сегодня не просто "пятница", а "большая пятница". Это значит, что за такой пятницей следует сразу три выходных дня. Это приятно! Два выходных дня уже неплохо, а три - вообще большое удовольствие.
Сегодня мы с вами займёмся шахматами и программированием на JS (JavaScript, ДжаваСкрипт, ЯваСкрипт).
Я тут недавно накатал книжку "Шахматы, самоучитель для новичков - 2" и вот теперь для усиления влияния этой книги на улучшение игровых качеств шахматиста-новичка написал маленькую программку: Игра тренировка "Шахматный адрес".
Длительность игры 10 секунд. Система даёт запрос в стандартном формате адреса шахматной клетки. Вы должны быстро среагировать, кликнув заданную клетку. Развивает реакцию, запоминание шахматной нотации и скоростные навыки, необходимые для игр "блиц" и "пуля".
Если вы прокачаетесь до стабильного результата 7 удачных реакций белыми (это когда доска в положении "белые внизу" и 6 удачных реакций чёрными (это когда доска в положении "чёрные внизу"), то ваш шахматный рейтинг вырастет на 100 пунктов только за счёт быстрого и чёткого ориентирования на шахматном поле боя.
Шахматную нотацию надо знать. Можно, конечно, "шлёпать" и без знания нотации. Это как современные композиторы пишут музыку без знания нот. Но это не наш путь. Наш успех в шахматах и в программировании базируется на крепком здоровом фундаменте.
Кстати, с этого примера вы можете начать свой путь в программировании на JS. Этот язык прекрасен тем, что ничего не требуется для работы программ на вашем устройстве. Если есть любой браузер - программа на JS будет работать.
На странице игры есть также ссылка для скачивания дистрибутива. Скачайте его и распакуйте. Все 5 файлов разместите в одну папку.
19.02.2026 20:59 3690 index.html
19.02.2026 20:48 3823 local1.css
19.02.2026 21:04 8729 local1.js
14.02.2026 21:44 5449 correct.mp3
14.02.2026 22:07 8917 wrong.mp3
В браузере открываете файл index.html и процесс пошёл. Внесите изменения в этот функционал (например, замените файл wrong.mp3) и посмотрите, как отобразились эти изменения.
Сообщайте, понравилась программа или нет, получилось ли установить на своём устройстве.
...
Первоисточники:
Игра тренировка "Шахматный адрес".
Программа сделана на чистом нативном JS.
Вы можете бесплатно не только прокачать знание шахматной нотации и быстроту реакции, но также скачать дистрибутив и потренироваться в программировании на этом реальном несложном примере.
"Шахматы, самоучитель для новичков - 2"
Играть в шахматы - хорошо! Но играть хорошо - ещё лучше. После прочтения и изучения второй части самоучителя вы научитесь обыгрывать сильных шахматистов, возможно, даже мастеров и гроссмейстеров.
===






















