Мой сайт не работал пять лет. Пересобираю его в портал — показываю всё
-
1
00:00
Пять копий одной записи — в прямом эфире
1 Что делать
Открываю старый сайт и ищу по странице: одна и та же запись находится пять раз.
-
2
00:48
Дубли не в поиске, а в разметке
1 Что делать
Смотрю код: карусель рендерит каждый блок дублями, и поисковик видит страницу, забитую повторами.
-
3
01:08
Пустой первый экран
1 Что делать
Первый экран без ответа на вопрос, чем я полезен и с чем ко мне приходить.
-
4
01:22
Разбор «до»: девять ролей, Skills, English 55 %
1 Что делать
Прохожу старый сайт блок за блоком: подзаголовок из девяти должностей, проценты навыков, обрыв опыта.
-
5
02:58
Две витрины: сайт и канал
1 Что делать
Ставлю рядом блок навыков сайта и описание канала: две витрины говорят о разном.
-
6
03:29
Кто я и почему это не про красивый сайт
1 Что делать
Коротко о себе и о том, что сайт существует ради доказательства, а не ради вида.
-
7
04:30
Архитектура на доске: четыре задачи
1 Что делать
Рисую на доске четыре задачи сайта, под каждую раздел и куда он ведёт.
-
8
06:54
Стек вслух: почему не генератором сайтов
1 Что делать
FastAPI, страницы на сервере, Tailwind; почему не генератор статики и не одностраничное приложение.
-
9
07:55
Три вещи до первого промпта
1 Что делать
Контент отдельно от вёрстки, правила проекта в CLAUDE.md, задание из архитектуры, а не из головы.
-
10
08:59
Первый промпт: каркас
1 Что делать
Отдаю Claude Code каркас портала: маршруты, чтение markdown, базовый шаблон. Сначала план, потом файлы.
2 Промпт
RU · ПромптСобираем персональный портал на FastAPI. Ни генератора статики, ни SPA: страницы рендерятся на сервере через Jinja2. Структура проекта: app/main.py — приложение FastAPI app/content.py — чтение markdown из content/ и разбор фронтматтера templates/ — Jinja2: base.html и по шаблону на раздел static/css/site.css — собранный Tailwind (кладём в репозиторий собранным) content/ru|uk|en/ — тексты разделов в markdown с YAML-фронтматтером content/works/ — по одному файлу на работу Что сделать сейчас: 1. app/main.py: приложение FastAPI, StaticFiles смонтирован на /static, Jinja2Templates на templates/. 2. Маршруты. Язык — первый сегмент пути, русский без префикса: / /uk/ /en/ /how /uk/how /en/how /works /uk/works /en/works /works/{slug} и то же с префиксами /materials /contact /archive — так же. Один общий обработчик, а не двадцать одинаковых функций. 3. app/content.py: читает content/{lang}/{name}.md, разбирает YAML-фронтматтер (title, description, updated), отдаёт HTML и метаданные. Файла нет — отдаём 404, а не пустую страницу. 4. templates/base.html: атрибут lang подставляется, title и meta description берутся из фронтматтера, один link на /static/css/site.css. 5. Никаких текстов в шаблонах. Любая строка, которую я захочу поправить, живёт в content/. В шаблоне только разметка и подстановки. Оформление сейчас не трогаем — только структура и правильные тексты в правильных местах. Сначала покажи план и список файлов, которые собираешься создать. Файлы не пиши, пока я не подтвержу.EN · Промпт с экранаСобираем персональный портал на FastAPI. Ни генератора статики, ни SPA: страницы рендерятся на сервере через Jinja2. Структура проекта: app/main.py — приложение FastAPI app/content.py — чтение markdown из content/ и разбор фронтматтера templates/ — Jinja2: base.html и по шаблону на раздел static/css/site.css — собранный Tailwind (кладём в репозиторий собранным) content/ru|uk|en/ — тексты разделов в markdown с YAML-фронтматтером content/works/ — по одному файлу на работу Что сделать сейчас: 1. app/main.py: приложение FastAPI, StaticFiles смонтирован на /static, Jinja2Templates на templates/. 2. Маршруты. Язык — первый сегмент пути, русский без префикса: / /uk/ /en/ /how /uk/how /en/how /works /uk/works /en/works /works/{slug} и то же с префиксами /materials /contact /archive — так же. Один общий обработчик, а не двадцать одинаковых функций. 3. app/content.py: читает content/{lang}/{name}.md, разбирает YAML-фронтматтер (title, description, updated), отдаёт HTML и метаданные. Файла нет — отдаём 404, а не пустую страницу. 4. templates/base.html: атрибут lang подставляется, title и meta description берутся из фронтматтера, один link на /static/css/site.css. 5. Никаких текстов в шаблонах. Любая строка, которую я захочу поправить, живёт в content/. В шаблоне только разметка и подстановки. Оформление сейчас не трогаем — только структура и правильные тексты в правильных местах. Сначала покажи план и список файлов, которые собираешься создать. Файлы не пиши, пока я не подтвержу. -
11
10:49
Разделы: работы по единой схеме
1 Что делать
Каждая работа описана по одной схеме из пяти частей, «что не получилось» обязательна.
2 Промпт
RU · ПромптРаздел «Работы». Каждая работа лежит отдельным markdown-файлом в content/works/ и описана по одной и той же схеме — пять частей, всегда в этом порядке: 1. Задача — с чем пришли 2. Что было до — как это работало раньше 3. Как устроено — из чего собрано решение 4. Что получилось — измеримо, если есть чем мерить 5. Что не получилось — обязательная часть, пропускать нельзя Сделай: - фронтматтер работы: slug, title, client_type (без названия компании), period, stack (список), summary — одна строка; - шаблон списка /works: карточки в одну колонку, в карточке только title, summary и period. Ничего больше; - шаблон одной работы /works/{slug}: пять частей в фиксированном порядке с подзаголовками, внизу — ссылка на /contact; - если в файле работы нет части «что не получилось» — сборка страницы должна упасть с понятной ошибкой, а не молча пропустить раздел. Это правило, а не пожелание. Названий компаний, доменов и имён клиентов в текстах нет и не появляется. Клиента описываем типом: «финтех-продукт», «производственная компания».EN · Промпт с экранаРаздел «Работы». Каждая работа лежит отдельным markdown-файлом в content/works/ и описана по одной и той же схеме — пять частей, всегда в этом порядке: 1. Задача — с чем пришли 2. Что было до — как это работало раньше 3. Как устроено — из чего собрано решение 4. Что получилось — измеримо, если есть чем мерить 5. Что не получилось — обязательная часть, пропускать нельзя Сделай: - фронтматтер работы: slug, title, client_type (без названия компании), period, stack (список), summary — одна строка; - шаблон списка /works: карточки в одну колонку, в карточке только title, summary и period. Ничего больше; - шаблон одной работы /works/{slug}: пять частей в фиксированном порядке с подзаголовками, внизу — ссылка на /contact; - если в файле работы нет части «что не получилось» — сборка страницы должна упасть с понятной ошибкой, а не молча пропустить раздел. Это правило, а не пожелание. Названий компаний, доменов и имён клиентов в текстах нет и не появляется. Клиента описываем типом: «финтех-продукт», «производственная компания». -
12
13:09
Где AI сделал не то: выдуманные факты
1 Что делать
Модель при переводе добавила цифры, которых нет в исходниках. Откатываю и дописываю правило про факты в файл проекта.
2 Промпт
RU · ПромптСделай украинскую версию раздела «Работы»: content/uk/works.md и файлы работ в content/works/ с украинскими вариантами текста. Пусть звучит естественно для украиноязычного читателя.
EN · Промпт с экранаСделай украинскую версию раздела «Работы»: content/uk/works.md и файлы работ в content/works/ с украинскими вариантами текста. Пусть звучит естественно для украиноязычного читателя.
$## Факты - Цифры, даты, названия, сроки и любые количественные утверждения берутся только из файлов в content/. Ничего не добавлять, не округлять, не обобщать и не «усиливать». - Нет данных для строки — оставить пропуск вида TODO(факт: ...) и спросить меня. Пустое место лучше правдоподобной выдумки. - При переводе переводится ровно то, что написано. Добавлять регалии, количество проектов, годы опыта и отраслевые формулировки — запрещено.
-
13
15:09
Тихая ошибка: hreflang «ua» вместо «uk»
1 Что делать
Проверяю языковые ссылки руками: в голове страницы их нет, x-default тоже.
-
14
15:38
Языки и структура адресов
1 Что делать
Три языка папками в адресе, hreflang плюс x-default, и что сознательно не переводим.
2 Промпт
RU · ПромптЯзыковые версии. Три языка: русский, украинский, английский. Адреса — папками: русский без префикса, /uk/, /en/. Ни поддоменов, ни параметров в адресе. Сделай: 1. В base.html — блок ссылок на языковые версии текущей страницы (rel="alternate") плюс версия по умолчанию для случая, когда язык посетителя не совпал ни с одним. По умолчанию — русская версия. Коды языков подставь сам; я проверю их отдельно. 2. Переключатель языка в шапке: обычные ссылки, без JavaScript. Ведёт на ту же страницу в другом языке, а не на главную. 3. Переводим не всё. Есть языковые версии у: первого экрана, «Как я работаю», «Работы», «Контакт». Их нет у раздела «Архив» с роликами — они на русском, и украинская карточка русского ролика ничего не добавляет. Если для страницы нет версии на запрошенном языке — не выдумывай пустую страницу: веди на русскую версию и не ставь на неё языковую ссылку. 4. Проверка: пройди по всем маршрутам и выведи таблицу «адрес — язык — есть ли перевод — куда ведёт языковая ссылка».
EN · Промпт с экранаЯзыковые версии. Три языка: русский, украинский, английский. Адреса — папками: русский без префикса, /uk/, /en/. Ни поддоменов, ни параметров в адресе. Сделай: 1. В base.html — блок ссылок на языковые версии текущей страницы (rel="alternate") плюс версия по умолчанию для случая, когда язык посетителя не совпал ни с одним. По умолчанию — русская версия. Коды языков подставь сам; я проверю их отдельно. 2. Переключатель языка в шапке: обычные ссылки, без JavaScript. Ведёт на ту же страницу в другом языке, а не на главную. 3. Переводим не всё. Есть языковые версии у: первого экрана, «Как я работаю», «Работы», «Контакт». Их нет у раздела «Архив» с роликами — они на русском, и украинская карточка русского ролика ничего не добавляет. Если для страницы нет версии на запрошенном языке — не выдумывай пустую страницу: веди на русскую версию и не ставь на неё языковую ссылку. 4. Проверка: пройди по всем маршрутам и выведи таблицу «адрес — язык — есть ли перевод — куда ведёт языковая ссылка».
-
15
16:42
Воронка: форма, почта, канал
1 Что делать
Форма из трёх полей, заявка в базу и в Telegram, почта на своём домене, ссылка в канал.
2 Промпт
RU · ПромптФорма на /contact. Ровно три поля: задача (многострочное), срок (одна строка), контакт (одна строка). Больше полей не добавлять — каждое лишнее поле стоит ответов. Сделай: 1. POST /contact — обычная отправка формы, без JavaScript. После отправки — отдельная страница «спасибо», а не всплывающее сообщение: на неё можно поставить цель в аналитике. 2. Заявка сохраняется в SQLite (файл data/site.db, таблица leads: id, задача, срок, контакт, время, язык страницы, источник перехода) и одновременно уходит сообщением в мой телеграм через бота. Токен и chat_id — из переменных окружения, в коде их нет. Читай их через os.environ, .env в репозиторий не попадает. 3. Если телеграм недоступен — заявка всё равно сохранена в базе, а ошибка записана в лог. Потерять заявку из-за упавшего бота нельзя. 4. Простая защита от роботов без капчи: скрытое поле-приманка и проверка, что форма отправлена не раньше чем через три секунды после загрузки страницы. 5. Почта — на своём домене, ссылка mailto рядом с формой. Ссылка на телеграм ведёт в канал, не в личку.
EN · Промпт с экранаФорма на /contact. Ровно три поля: задача (многострочное), срок (одна строка), контакт (одна строка). Больше полей не добавлять — каждое лишнее поле стоит ответов. Сделай: 1. POST /contact — обычная отправка формы, без JavaScript. После отправки — отдельная страница «спасибо», а не всплывающее сообщение: на неё можно поставить цель в аналитике. 2. Заявка сохраняется в SQLite (файл data/site.db, таблица leads: id, задача, срок, контакт, время, язык страницы, источник перехода) и одновременно уходит сообщением в мой телеграм через бота. Токен и chat_id — из переменных окружения, в коде их нет. Читай их через os.environ, .env в репозиторий не попадает. 3. Если телеграм недоступен — заявка всё равно сохранена в базе, а ошибка записана в лог. Потерять заявку из-за упавшего бота нельзя. 4. Простая защита от роботов без капчи: скрытое поле-приманка и проверка, что форма отправлена не раньше чем через три секунды после загрузки страницы. 5. Почта — на своём домене, ссылка mailto рядом с формой. Ссылка на телеграм ведёт в канал, не в личку.
-
16
17:21
Четыре события в аналитике
1 Что делать
Вместо счётчика посещений четыре события: пришёл с YouTube, дочитал работу, отправил форму, ушёл в Telegram.
-
17
17:51
Деплой на свой VPS
1 Что делать
Портал встаёт новым сайтом на сервер: приложение под службой, сертификат одной командой.
-
18
18:35
До и после
1 Что делать
Старый и новый сайт рядом: те же поиски по странице и разделы новой структуры.
-
19
19:49
Где ломается
-
20
20:58
Домашка и что дальше
1 Что делать
Пройти свой сайт по чек-листу аудита, собрать структуру «после» и строку первого экрана.