Саймон Уиллисон одним промптом для GPT-5.5 сделал веб-компонент для встраивания кода с GitHub
Известный разработчик Саймон Уиллисон (автор Datasette и sqlite-utils) опубликовал в блоге экспериментальный Web Component (пользовательский HTML-элемент) <github-code> для встраивания фрагментов исходного кода с GitHub прямо в веб-страницу. Компонент он не писал руками: попросил модель GPT-5.5 одним промптом, «давай сделаем веб-компонент для встраивания кода с GitHub», и там же добавил, что компонент должен принимать обычные GitHub-ссылки на файл с диапазоном строк вида https://github.com/simonw/sqlite-ast/blob/437c7591.../parser.py#L9-L18, а затем отдельно попросил показать предпросмотр в браузере, чтобы сразу увидеть результат.
По описанию Уиллисона, логика компонента простая: такая ссылка на GitHub конвертируется в ссылку на raw.githubusercontent.com (то есть на сырое содержимое файла в конкретном коммите), содержимое подгружается через fetch(), а на странице отображается только указанный диапазон строк, с номерами строк, но пока без подсветки синтаксиса. В самом посте автор приводит живой пример работы компонента, встроенный на страницу.
Публикация вышла в подборке недавних заметок Уиллисона о его же инструментах: релиз sqlite-utils 4.0 с миграциями схемы базы данных (7 июля 2026) и sqlite-utils 4.0rc2, который, по его словам, был почти полностью написан моделью Claude Fable, и обошёлся примерно в $149.25 (5 июля 2026).
Ключевые факты
- Саймон Уиллисон сделал экспериментальный Web Component
<github-code>для встраивания фрагментов кода прямо с GitHub. - Компонент написан не вручную, а одним промптом для GPT-5.5: автор описал задачу и попросил показать предпросмотр в браузере.
- Логика: ссылка на GitHub-файл с диапазоном строк (
#L9-L18) конвертируется в ссылку на raw.githubusercontent.com, содержимое подгружается через fetch(), отображаются только нужные строки с номерами. - Подсветки синтаксиса в компоненте пока нет.
- Заметка вышла рядом с другими постами автора о его инструментах: релиз sqlite-utils 4.0 (миграции схемы БД) и sqlite-utils 4.0rc2, почти полностью написанный моделью Claude Fable примерно за $149.25.
Почему это важно
Это наглядный пример быстрого прототипирования: рабочий веб-компонент собран не строчка за строчкой, а одним разговорным промптом модели GPT-5.5, включая просьбу сразу показать результат в браузере. Автор, известный разработчик и блогер, много пишущий о практическом применении LLM в повседневной разработке, так что подобные заметки задают ориентир, что уже реально сделать «в одно касание».
Кому это важно
Разработчикам и техническим авторам, которым нужно встраивать фрагменты кода с GitHub в свои страницы и блоги; тем, кто интересуется практикой быстрого создания небольших UI-компонентов с помощью LLM вместо ручного кодирования.
Как это применить
Компонент <github-code href="..."> принимает обычную ссылку на файл на GitHub с диапазоном строк, сам конвертирует её в ссылку на raw.githubusercontent.com, подгружает содержимое через fetch() и рисует указанные строки с номерами. Похожий приём, одна разговорная просьба модели плюс требование сразу показать предпросмотр, можно использовать для быстрого создания собственных небольших вспомогательных виджетов для блога или документации.
Можно ли доверять
Это личная экспериментальная заметка самого автора идеи и кода, Саймона Уиллисона, а не анонс готового продукта с гарантиями. В тексте прямо сказано, что компонент «экспериментальный» и подсветки синтаксиса в нём пока нет.
Риски и подводные камни
Компонент без подсветки синтаксиса и, судя по описанию, без обработки ошибок, это черновой прототип, а не готовый к продакшену виджет. Ссылки жёстко привязаны к конкретному коммиту в URL, поэтому при использовании ссылок на ветку вместо коммита показанный код может со временем разойтись с актуальным файлом. Код, сгенерированный моделью по одному промпту, как и любой ИИ-сгенерированный код, стоит перепроверять перед использованием в реальных проектах.
«Давай сделаем веб-компонент для встраивания кода с GitHub»
— промпт Саймона Уиллисона, отправленный GPT-5.5