Transcription
Привет, ребята, добро пожаловать обратно на канал. Сегодня мы погружаемся в безумный новый ИИ-инструмент, Z.AI chat, работающий на моделях GLM 4.6 и GLM 4.5. Эта платформа абсолютно насыщена функциями. Вы можете создавать слайды с ИИ для мгновенной генерации профессиональных PPT, и она даже поставляется с готовыми шаблонами и выводом HTML-кода. Далее, опция "magic design" позволяет создавать потрясающие баннеры для социальных сетей и дизайны постов за секунды. Также есть режим глубокого исследования и функция написания кода для разработчиков. А главное, вы можете создавать полнофункциональные приложения, используя опцию "full stack", как lovable или bolt. Лучшая часть, это полностью бесплатно и с открытым исходным кодом. Я выберу опцию "full stack" и вставлю свой запрос сюда. Я создаю веб-сайт для конвертации Excel в JSON с интеграцией базы данных и аутентификацией. Просто нажмите кнопку "submit". Модель GLM 4.6 анализирует наш запрос и настраивает проект. Вы можете видеть, что она использует Nex.js, Tailwind CSS, shed CN UI и Prisma с настройкой SQL light. Теперь она создала список дел и выполняет каждый шаг по очереди. Первое дело - установка библиотеки Excel SX, которая используется для чтения файлов Excel. Смотрите, она начала установку, а теперь перешла к следующей задаче, обновлению схемы Prisma. Это тоже завершено. Далее, она переходит к делу по созданию дизайна основного пользовательского интерфейса. Это супер быстро. Теперь остались только задачи номер пять и шесть. Нам нужно подождать всего несколько секунд, пока они завершатся. Вы можете видеть предварительный просмотр веб-сайта, появляющийся сейчас. И посмотрите на это. Все дела завершены. Теперь она проверяет наличие проблем ESLint. Итак, подождем еще несколько секунд. И готово. Веб-сайт теперь полностью завершен. Он создал интерфейс загрузки файлов, функциональность конвертации файлов и несколько других полезных функций. Вы можете видеть, что он работает на NextJS15 с TypeScript. Пока что по умолчанию используется SQLite, но при необходимости мы можем переключиться на Superbase позже. Это структура папок, которую он сгенерировал. Прежде чем посмотреть веб-сайт, давайте заглянем в код. Нажмите кнопку переключения предварительного просмотра кода. Здесь настройка базы данных SQL. Prisma с примером схемы и код маршрутизатора приложений Nex.js, все аккуратно организовано. Структура папок полностью профессиональная. И наконец, есть файл JSON компонентов shad CN. Лучшая часть, вы можете скачать весь исходный код проекта. Это потрясающе. Вы даже можете модифицировать его по своему усмотрению и развернуть где угодно. Теперь мы можем проверить веб-сайт. Мы можем легко открыть его в новой вкладке и все четко увидеть. Давайте протестируем. Я загружу сюда пример файла Excel и нажму "submit". Он мгновенно генерирует вывод JSON. Вы можете видеть ответ. Он успешно преобразовал мои данные Excel в формат JSON, и все выглядит идеально. Потрясающе. Это именно то, что нам было нужно. Также есть опция скачать JSON-файл. Давайте нажмем и проверим. Отлично. Это работает идеально. Теперь, если мы перейдем на вкладку истории, мы увидим, что история преобразованных файлов сохраняется. В настоящее время для этого используется база данных SQL light. Прежде чем переключиться на Superbase, я хочу улучшить дизайн пользовательского интерфейса, чтобы он выглядел еще лучше. Для этого я открою веб-сайт tweak CN. Используя это, мы можем легко настраивать красивые темы shed CN. Нажмите кнопку "start". Здесь вы можете увидеть все доступные темы. Давайте переключаться между ними по одной, чтобы проверить, какая из них лучше всего подходит для нашего дизайна. Есть много отличных вариантов, но я выберу последний. Мне очень нравится этот. Он называется Violet Bloom. Теперь нажмите опцию "code". Вы увидите два способа применения темы. Либо установите ее с помощью PNPM, либо просто скопируйте и вставьте CSS-код. Я просто скопирую CSS-код сюда. Теперь я перейду в GLM chat, вставлю туда CSS-код и нажму "submit". Агент автоматически обновит нашу тему. Обычно это занимает около 30-40 секунд. И готово. Тема изменена. Все выглядит намного лучше по сравнению с предыдущей версией. Он даже включает темный режим, точно такой же, как тот, который мы скопировали. Теперь выглядит чисто и профессионально. Теперь мы интегрируем Superbase в наш проект. Для этого откройте Superbase и создайте новый проект для веб-сайта. После его создания нажмите кнопку "connect", затем перейдите на вкладку "app framework". Поскольку мы используем маршрутизатор приложений NextJS, скопируйте предоставленные там ключи окружения. Далее, вернитесь к агенту, вставьте эти ключи окружения и также поделитесь с ним URL-адресом документации Next.js Superbase. Это поможет агенту понять и правильно настроить Superbase. Затем просто введите "integrate Superbase" и нажмите "submit". Агент начнет работать над этим. Он снова создает новый список дел, и первая задача - установка необходимых пакетов Superbase. Отлично. Мы подождем около минуты, пока это завершится. Теперь агент завершил настройку, но есть еще один шаг, который нам нужно сделать вручную. Агент упоминает, что нам нужно открыть панель управления Superbase, перейти в редактор SQL и вставить предоставленные SQL-запросы. Итак, я скопирую эти SQL-запросы сейчас и открою редактор SQL в Superbase. Здесь я вставлю SQL-запросы и нажму кнопку "run". Это создаст нашу таблицу внутри Superbase. И вот оно. Мы получили сообщение об успехе. Теперь откройте меню таблиц. Вы можете видеть, что наша таблица истории конвертации была создана. Потрясающе. Superbase теперь полностью подключен к нашему приложению. Далее, я загружу сюда пример файла Excel и нажму "submit". Он идеально генерирует вывод JSON. Теперь, если вы перейдете на вкладку истории, вы заметите, что данные сохраняются, но на этот раз они хранятся в таблице Superbase, а не в SQL light. После обновления данные появляются мгновенно. Все работает безупречно. Вы можете даже создавать несколько таблиц таким же образом при необходимости. Теперь мы интегрируем аутентификацию по электронной почте Superbase. Введите запрос "integrate off" и нажмите "submit". Агент автоматически займется интеграцией Superbase. Мы получили новый список дел для этой задачи. Первый шаг - установка пакета аутентификации. Итак, подождем несколько секунд, пока это завершится. Пока он устанавливается, откройте Superbase. Перейдите в "authentication providers" и отключите подтверждение по электронной почте. Это только для целей разработки, чтобы мы не получали никаких писем с подтверждением. Вы можете включить его обратно позже в продакшене. Теперь агент создает страницы входа и регистрации. Как только это будет сделано, нашему приложению теперь потребуется вход для доступа к нему. Но прежде чем войти, нам нужно выполнить несколько SQL-запросов в Superbase. Агент GLM уже предоставил SQL-запрос. Итак, скопируйте его и откройте редактор SQL в Superbase. Здесь я вставлю запросы и нажму кнопку "run". Вы увидите ошибку, потому что таблица истории уже существует. Итак, удалите предыдущую таблицу. Затем снова выполните запрос. На этот раз он работает успешно. Вы заметите кое-что новое. Обновленная таблица истории теперь включает столбец user ID. Это означает, что каждая запись истории конвертации будет связана с вошедшим пользователем. Теперь откройте веб-сайт и попробуйте зарегистрироваться. Введите свое имя пользователя, адрес электронной почты и пароль. Затем нажмите "sign up". Пользователь создается мгновенно. Далее, войдите с тем же адресом электронной почты и паролем. Нажмите "sign in", и это работает идеально. Аутентификация полностью функциональна. Теперь для подтверждения откройте панель управления Superbase. Таблица пользователей. Вы увидите там запись нового пользователя. Наш веб-сайт теперь полностью интегрирован с аутентификацией Superbase. Все связано и работает гладко. Спасибо за просмотр. Если это видео было полезным, не забудьте поставить лайк, подписаться и включить колокольчик для получения большего количества потрясающего контента о технологиях. Увидимся в следующем выпуске.