Сайты с ИИ2026-07-227 минНатали Анарбаева

Как сделать личный кабинет на сайте в 2026: конструктор или ИИ

Как сделать личный кабинет на сайте в 2026: конструктор или ИИ

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

Что такое личный кабинет и из чего он состоит

За словами «личный кабинет» всегда стоят три механизма, и без любого из них он не работает.

  • Регистрация и вход (авторизация): человек создаёт учётную запись и подтверждает, что он это он, по паролю или коду из письма.
  • Хранилище пользователей (база данных): где-то лежит список аккаунтов, их email, зашифрованные пароли и данные профиля.
  • Разграничение доступа: сайт понимает, кто вошёл, и показывает ему только его страницы, заказы или оплаченный контент.

Вот что экономит недели: личный кабинет всегда требует, чтобы данные где-то хранились и проверялись. Обычный сайт-визитка это просто набор страниц, а кабинет, это уже мини-приложение с памятью о каждом пользователе. Поэтому чисто на статическом HTML его не сделать, нужен либо конструктор с встроенной базой, либо отдельный бэкенд.

Когда хватит конструктора, а когда нужен бэкенд

Выбор зависит от того, насколько нестандартный кабинет вам нужен. Честное деление такое.

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

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

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

Посмотреть, как собрать

Как сделать личный кабинет на конструкторе Tilda

У Tilda есть штатная функция «Личный кабинет»: регистрация, страница входа, группы доступа и выдача закрытых страниц конкретным пользователям (tilda.cc). Вход настраивается либо по постоянному паролю, либо по одноразовому коду из письма (документация Tilda). Порядок действий такой.

  1. Заведите проект на Tilda и оплатите платный тариф, который открывает нужные функции (актуальную цену смотрите на сайте Tilda).
  2. В настройках сайта включите личный кабинет и создайте страницы регистрации и входа, Tilda генерирует их автоматически, вам остаётся выбрать стиль формы, фон и цвета кнопок.
  3. Создайте группы доступа: например, «Оплатившие курс» и «Бесплатный тариф». Группа, это набор пользователей с одинаковыми правами.
  4. Откройте нужные страницы только выбранным группам, тогда закрытый контент увидит лишь тот, кто вошёл и состоит в группе.
  5. Добавьте пользователей вручную или включите самостоятельную регистрацию, и проверьте вход под тестовым аккаунтом с телефона и компьютера.

Актуальные цены и состав тарифов всегда сверяйте на странице тарифов Tilda, они меняются. Если магазин, у Tilda есть отдельный кабинет покупателя, но он работает только с корзиной ST100. Подробный разбор самой платформы есть в гайде про то, как сделать сайт на Тильде.

Самое долгое в своём сайте это первый запуск: страницы, домен, публикация. На бесплатном вебинаре по вайбкодингу весь путь проходят вживую, от идеи, описанной словами, до работающего адреса. Опыт в программировании не нужен.

Пройти путь до сайта

Как сделать личный кабинет через вайбкодинг с ИИ

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

Популярный вариант для старта, Supabase: он даёт и базу данных, и готовую авторизацию по email, паролю или соцсетям. На бесплатном тарифе доступно до 50 000 активных пользователей в месяц для авторизации и 500 МБ базы, но проект приостанавливается после 7 дней без активности, поэтому для боевого сайта нужен платный план (supabase.com/pricing). Общий маршрут выглядит так.

  1. Выберите ИИ-инструмент для кода: подойдут десктопные приложения Codex от OpenAI или Claude Code от Anthropic, а для полностью визуального пути, конструкторы-вайбкодеры вроде Lovable.
  2. Заведите проект в Supabase и включите в нём авторизацию по email и паролю, сервис сам создаст таблицу пользователей и защищённое хранение паролей.
  3. Опишите ИИ задачу простыми словами: «сделай страницу регистрации и входа, подключи Supabase, после входа показывай профиль с email и кнопкой выхода».
  4. Попросите ИИ добавить закрытую страницу, которую видит только вошедший пользователь, и объясните, что неавторизованных нужно отправлять на страницу входа.
  5. Проверьте всё вживую: зарегистрируйтесь, выйдите, войдите снова, попробуйте открыть закрытую страницу без входа, она не должна показываться.

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

Не пишите систему паролей руками, даже если ИИ бодро предлагает. Берите готовый сервис авторизации: в нём уже решены шифрование, восстановление пароля и защита от подбора, которые самому легко сделать дырявыми.

По теме: Как сделать сайт-визитку в 2026: три способа и готовый промпт

Ошибки безопасности, которых стоит избегать

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

  • Не храните пароли в открытом виде. В нормальных сервисах пароль превращается в необратимый код (хеш), и даже владелец сайта не видит исходный пароль, так и должно быть.
  • Не собирайте лишние данные. Чем меньше личной информации в базе, тем меньше проблем, если что-то утечёт.
  • Включите вход по HTTPS (замок в адресной строке), без него логин и пароль летят по сети открытым текстом.
  • Не встраивайте пароли и секретные ключи прямо в код страниц, их видно любому, кто откроет исходник, для ключей есть отдельные защищённые настройки сервиса.
  • Дайте людям восстановление пароля по email, иначе забытый пароль превратится в поток обращений в поддержку.

Частые вопросы

Можно ли сделать личный кабинет бесплатно?

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

Нужен ли программист?

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

Чем личный кабинет отличается от простой формы регистрации?

Форма только собирает данные и отправляет их вам. Кабинет запоминает пользователя: после входа он видит своё и может возвращаться под тем же аккаунтом. Разница именно в памяти о человеке и разграничении доступа.

Как закрыть контент только для оплативших?

На Tilda это делается через группы доступа: после оплаты человек попадает в нужную группу и видит закрытые страницы. В варианте с кодом вы отмечаете в базе, что у пользователя есть оплаченный доступ, и показываете контент только по этой отметке.

Хотите не просто собрать кабинет, а научиться делать сайты с ИИ под задачи клиентов и зарабатывать на этом? На бесплатном воркшопе «Сайты с ИИ» покажем весь путь на живых примерах.

Занять место
Разборы, кейсы и фишки вайбкодинга каждую неделю в телеграм-канале «Яков вайбкодит».
Первый проект с ИИ: живой разбор, бесплатно Занять место