Transcription
Всем привет. Сегодня я покажу вам, как искусственный интеллект практически с нуля сделал Marketпс, а именно копию WBR. Без дизайнеров, без команды разработчиков, только я и непосредственно CHAS GPT, моделька GPT 52.
Мне стало интересно, что если взять реальный маркетплейс и попробовать воссоздать его с помощью искусственного интеллекта, от дизайна до определённой логики корзины и оформления заказа. А спойлер получилось не идеально, но достаточно неплохое рабочее решение.
Первым делом я понял, что для реализации такой штуки нам нужны две основные вещи. Во-первых, это дизайн, а во-вторых - это логика работы маркетплейса. И угадайте, кому я это доверил. Конечно же, GPT.
Я просто закинул в чат GPT фотографии дизайна WBRС и сказал примерно следующее: вот дизайн, проанализируй, помоги мне реализовать этот сайт. Также я закинул полное техническое задание, то есть это достаточно интересная и важная составляющая, которая помогает GPT понять всю суть того, как это всё реализовать.
Я предложил, что у нас будет обычная статическая структура HTML, CSS, JavaScript. И для CSS мы будем использовать Bootstrap для стилизации. Также JavaScript делим на два основных файла. Это Data JS, то есть это данные карточек товаров, и некоторые Script JS, то есть вся логика маркетплейса. Ну, и, в принципе, всё это отправил чат GPT, который дальше уже начал генерировать мне файлы.
Первым делом я задал такой пром, что нужно сгенерировать только HTML и CSS. Если я задам всё сразу сгенерировать, то, скорее всего, он потеряет суть, контекст и, в общем-то, сломается, будет много багов. Поэтому я решил действовать по частям.
После чего я задал генерацию Data GS, то есть таблицу товаров. Я закинул ему таблицу из десяти товаров, где есть название, описание, цена и некоторая картинка. Ну и, кстати, всё это тоже мне ээ наверил чат GPT. И фактически он превратил просто всю эту таблицу, которую он скинул, в JavaScript объекты и выдал код Data JS.
Следующий шаг, самое сложное. Я прошу GPT сделать мне Script JS, в котором будет вывод карточек, поиск, фильтрация, корзина, добавление, удаление товаров, также оформление заказа. И, в принципе, он неплохо справился. Правда, есть определённые байги, которые в следующем прямте мне необходимо было пофиксить. Где-то ломалась корзина, где-то не обновлялась сумма, а где-то вообще просто карточки не отображались. И всё это необходимо было пофиксить.
То есть, грубо говоря, я просто беру ошибки, которые сам вижу, копирую их в чат GPT и говорю: "Вот баги, собственно, чувак, иди чини, почини, пожалуйста, и там что-нибудь сделай". В общем, ээ, соверши какую-нибудь магию, но сделай так, чтобы этих ошибок, багов больше никогда я не видел. Он анализирует код, предлагает правки и шаг за шагом, в принципе, доделывает мой непосредственно проект.
В итоге у меня получился достаточно рабочий маркетплейс, где есть карточки товаров, как вы сейчас видите. В принципе, работает какая-то фильтрация популярности. Есть также поиски. В принципе, мы можем положить товар в корзину. Причём несколько товаров можно положить в корзину. Дальше вы можете перейти в корзину и можете увеличивать товары, уменьшать товары или же вообще их убирать, а также оформлять заказ при необходимости. Ну, также есть кнопочка очистить корзину.
И самое главное, что здесь стоит понять в итоге, что искусственный интеллект - это не совсем про то, что сделает всё за тебя. Это скорее как инструмент, который ускоряет разработку в разы. Если ты понимаешь, что ты хочешь получить, GPT реально может помочь собрать рабочий продукт.
Если вам было интересно, поставьте лайк, подпишитесь и напишите в комментариях, какой проект собрать с помощью и в следующий раз. Спойлер, у меня уже есть определённая заготовка, над которой я уже тружусь примерно неделю. Это будет максимально круто. Ты можешь догадаться. Первая буква М, последняя буква Р. Пиши свои догадки в комментариях. Увидимся в следующем ролике.