Смотреть урок

Дополнительные файлы из урока

В первом уроке четвёртого модуля я разбираю рендеринг. Пользователь может видеть на странице и медиа, и текст, а поисковый робот Яндекса или Google получает белый лист, потому что не ждёт загрузки JavaScript и хочет сразу видеть готовый HTML. Я перечисляю четыре метода рендеринга: CSR, SSR, SSG и ISR. Затем на сайте из предыдущих уроков отключаю JavaScript в DevTools и показываю, что контент и мета-теги остаются на месте. После этого создаю в Cursor простой проект на чистом React, проверяю тот же тест, получаю пустую страницу и прошу Cursor перевести компонент на серверный или статический рендеринг на Next.js. Урок подойдёт тем, кто делает сайт с помощью Cursor и хочет проверять, что именно получает поисковик.

Оглавление с таймкодами:

0:00–0:30 Вступление. Для пользователя сайт может выглядеть нормально, а для роботов Яндекса и Google быть пустым, потому что они не ждут загрузки JavaScript. Выдача готового HTML и называется рендерингом.

0:30–1:08 Четыре метода рендеринга. CSR: почти пустой index.html и много JS, контент рисуется на клиенте, для SEO это плохо. SSR: сервер генерирует HTML при каждом запросе, подходит для динамики. SSG: HTML генерируется один раз при…