Как создать бэкэнд с помощью VS Code?

vs code позволяет интегрировать внешние инструменты, которые имеют активный сервер mcp, через протокол mcp это позволяет выполнять задачи и считывать данные из этих источников, не покидая вашу ide, используя подсказки в этом учебном пособии вы узнаете, как создать бэкенд и пользовательский интерфейс (ui) для платформы блога, используя https //www back4app com/mcp через vs code и развернуть его на контейнерах back4app основные выводы узнайте, как создать бэкенд на back4app, используя vs code и сервер mcp изучите, как моделируются отношения между классами на back4app изучите, как аутентификация и авторизация на основе ролей реализованы back4app с использованием их встроенных классов разверните ваше приложение в несколько кликов, используя контейнеры back4app вы можете просмотреть живой блог, созданный в этом учебном пособии, используя https //blogger 6rhmkal0 b4a run/ предварительные требования чтобы следовать этому учебному пособию, вам необходимо иметь следующее аккаунт back4app вы можете https //www back4app com/signup , если у вас его нет установленный vs code на вашем компьютере базовое знакомство с концепциями разработки бэкенда обзор проекта блог в этом руководстве вы создадите простой блог, который позволит вам создавать, редактировать, просматривать и удалять записи блога он также поддерживает комментарии и отслеживает количество людей, которые просмотрели ваши записи блога в дополнение к таблице user предоставленной по умолчанию на back4app для аутентификации, ваш блог будет иметь еще три таблицы записи, комментарии и просмотры когда пользователь вашего блога создает учетную запись, back4app создает новую запись в таблице user и выдает безопасный токен сессии, который вы можете повторно использовать в последующих запросах только аутентифицированные пользователи могут публиковать записи когда запись блога опубликована, как аутентифицированные, так и неаутентифицированные пользователи могут читать записи; однако только аутентифицированные пользователи могут комментировать каждый раз, когда запись блога извлекается из базы данных back4app, количество просмотров увеличивается; чтобы предотвратить возможное злоупотребление этой функцией для увеличения просмотров, вы реализуете некоторые ограничения вокруг этого теперь, когда у вас есть общее представление о том, что вы будете строить, в следующем разделе вы подключите vscode к серверу back4app mcp подключение vscode к серверу back4app mcp перейдите на сайт back4app и нажмите кнопку new app в верхнем левом углу страницы на экране “создать бэкенд” назовите ваше приложение и нажмите кнопку создать на странице обзора вашего приложения нажмите кнопку mcp setup в модальном окне “выберите вашу ide” нажмите на vs code и следуйте инструкциям на экране, чтобы автоматически подключить vscode к серверу back4app mcp если вы следовали варианту автоматической установки, вам необходимо перезапустить vs code на вашем компьютере перед продолжением в качестве альтернативы вы можете подключить сервер back4app mcp вручную (что даст вам больше контроля над конфигурацией), переключив модальное окно на ручной раздел после выполнения шагов, описанных в модальном окне для подключения сервера back4app mcp к vscode, вы можете подтвердить подключение, нажав на строку поиска в окне vscode и введя “>mcp list servers”, выполните команду, и вы должны увидеть список доступных серверов mcp и их текущее состояние (работает/остановлен) теперь, когда вы подключили сервер back4app mcp к vscode, в следующем разделе вы напишете подсказки, которые создадут ваше приложение создание бэкенда вашего блога чтобы создать свой бэкенд с помощью vscode и github copilot, сначала вам нужно активировать режим агента в github copilot чтобы активировать режим агента, откройте чат github copilot, нажав “ control + command + i” на macos, для windows нажмите “ctrl + i” на странице чата нажмите на выпадающее меню с меткой “спросить” и выберите режим “агент” затем дайте github copilot подсказку ниже или подобную, чтобы создать классы, необходимые для вашего приложения создайте бэкенд под названием “blogger” начните с добавления класса post с следующими полями title и body как обязательные строки, уникальный slug, необязательный файл heroimage, хранящийся в бакете back4app, указатель на автора, указывающий на встроенный класс user, счетчики для commentcount и viewcount (все начинаются с 0), строка статуса, ограниченная значениями draft или published, и дата publishedat, устанавливаемая автоматически, когда черновик впервые становится опубликованным затем создайте класс comment, который хранит строку содержимого, указатель на автора и указатель на пост добавьте класс view, который записывает каждый просмотр страницы с необязательным пользователем и обязательными указателями на пост подсказка выше создает новый бэкенд back4app под названием “blogger” и заполняет его классами post, comment и view вместе с их обязательными свойствами когда вы выполните эту подсказку с copilot, он будет записывать шаги, которые он выполняет, в вашем окне чата и спрашивать у вас разрешение на каждом из шагов, которые изменяют ваши данные для наилучших результатов выполняйте эти подсказки с помощью премиум модели, такой как 03 mini или claude sonnet 4 после того как copilot создаст необходимые классы, у вас теперь есть структурированный способ хранения данных вашего блога в следующем разделе вы реализуете аутентификацию для вашего приложения реализация аутентификации требования к аутентификации для вашего приложения просты пользователи должны зарегистрироваться и войти в систему, чтобы создавать записи в блоге и комментировать записи в блоге однако они могут читать записи в блоге в вашем приложении без аутентификации вы можете реализовать требования к аутентификации для вашего приложения, используя приведенный ниже запрос добавьте аутентификацию пользователей в blogger, расширив встроенный класс user каждая учетная запись должна предоставить `имя пользователя`, `пароль`, который состоит как минимум из восьми символов, и адрес `электронной почты` перед каждым сохранением cloud code преобразует адрес электронной почты в нижний регистр, затем проверяет, что ни одна другая учетная запись уже не использует его; если адрес занят, сохранение отклоняется тот же триггер также обеспечивает соблюдение правила длины пароля экспонируйте четыре облачные функции на фронтенде \ signup принимает имя пользователя, электронную почту и пароль он создает 	пользователя, возвращает новую запись и включает токен сессии, чтобы вызывающий моментально аутентифицировался \ login принимает либо имя пользователя, либо электронную почту плюс пароль и, в случае success, возвращает объект пользователя и токен \ logout аннулирует текущий токен сессии запрос выше добавляет аутентификацию пользователей в ваше приложение логика аутентификации позволяет вашим пользователям создать учетную запись, используя электронную почту, имя пользователя и пароль после регистрации пользователь автоматически входит в систему, а когда пользователь выходит, его текущая сессия аннулируется после того как copilot реализует вашу логику аутентификации, у ваших пользователей будет безопасный способ регистрации и входа в систему в следующем разделе вы реализуете логику, необходимую для создания записей и комментариев создание записей и комментариев чтобы реализовать функцию создания записей и комментариев, вам нужно создать две облачные функции и поддерживающие хуки, которые позволят аутентифицированным пользователям публиковать записи и добавлять комментарии в одном упрощенном потоке начните с создания поддерживающих хуков, предоставив copilot приведенный ниже запрос или аналогичный расширьте приложение blogger, добавив хук post beforesave , который преобразует заголовок каждой новой записи в удобный для url слаг (нижний регистр, пробелы заменяются дефисами, и символы удаляются) затем проверяет класс post, чтобы убедиться, что слаг уникален когда запись создается, хук также устанавливает `status` на `"published"` и записывает текущую дату в `publishedat` прикрепите хук comment aftersave , который сразу после сохранения комментария увеличивает `commentcount` родительской записи, чтобы общее количество оставалось точным без дополнительных запросов вышеуказанный запрос реализует проверки/действия, выполняемые перед созданием поста или комментария для постов создается уникальный слаг, используя его заголовок, затем статус меняется на опубликованный, а текущая дата устанавливается как дата публикации для комментариев пост, к которому он привязан, просто обновляет количество комментариев теперь создайте облачные функции, связанные с хуками beforesave, используя запрос ниже или аналогичный предоставьте две облачные функции для фронтенда первая, createpost, принимает `title`, `body` и необязательный `heroimage`, требует, чтобы звонящий был авторизован, назначает звонящего `author`, прикрепляет изображение, если оно предоставлено, сохраняет пост и возвращает сохраненный объект вторая, addcomment , требует аутентификации, принимает `postid` и `content`, подтверждает существование поста, создает комментарий, связанный как с постом, так и с звонящим, сохраняет его и возвращает новый комментарий чтобы предотвратить злоупотребления, ограничьте каждого аутентифицированного пользователя пятью вызовами to createpost и пятнадцатью вызовами addcomment в минуту вышеуказанный запрос предоставляет две функции облачного кода, которые позволяют вашим пользователям создавать посты и комментарии он также защищает ваше приложение от злоупотреблений, ограничивая создание 5 постов и 15 комментариев в минуту основная логика, связанная с созданием постов и комментариев, уже была реализована в хуках beforesave, созданных в предыдущем запросе; этот просто предоставляет api для фронтенда после того как copilot реализует вышеуказанную логику, ваши пользователи получат возможность создавать и комментировать посты в следующем разделе вы реализуете логику, необходимую для обновления этих комментариев и постов, а также логику, необходимую для подсчета просмотров каждого блога обновление постов, комментариев и просмотров чтобы реализовать функциональность, позволяющую пользователям редактировать свои посты, пересматривать свои комментарии и регистрировать просмотры страниц, вам нужны две облачные функции updatepost, updatecomment и aftertrigger вы можете реализовать облачную функцию updatepost, используя запрос ниже или аналогичный реализуйте облачную функцию, updatepost, которая требует, чтобы звонящий был авторизован и проверил, что автор поста соответствует request user примите objectid поста вместе с любым новым заголовком, текстом или заменой heroimage игнорируйте или отклоняйте любые попытки предоставить поле статуса; как только пост опубликован, его статус не может измениться через этот маршрут после загрузки поста и подтверждения права собственности примените разрешенные обновления и сохраните если заголовок изменяется, полагайтесь на существующий хук post beforesave, чтобы восстановить уникальный слаг верните обновленный пост звонящему вышеуказанный запрос создает функцию, которая обновляет пост он гарантирует, что обновление может быть выполнено только пользователем, который создал пост, и регенерирует слаг, если заголовок изменен вы можете реализовать облачную функцию updatecomment, используя приведенный ниже запрос или аналогичный реализуйте облачную функцию, updatecomment, которая требует аутентификации, принимает objectid комментария и исправленный контент, затем извлекает комментарий и подтверждает, что вызывающий является его автором примените новый контент и сохраните; хука comment aftersave автоматически оставляет commentcount без изменений, потому что комментарий уже существует верните отредактированный комментарий приведенный выше запрос создает функцию, которая обновляет комментарий к посту обновление может быть выполнено только создателем комментария вы можете реализовать облачную функцию recordview, используя приведенный ниже запрос или аналогичный добавьте триггер afterfind в класс post , чтобы каждый раз, когда бэкенд возвращает один пост по `objectid`, он автоматически записывал просмотр страницы если запрос является лентой или поиском, который возвращает несколько постов, триггер выходит без выполнения каких либо действий внутри триггера извлеките пост из `request results\[0]`, создайте новый объект view , установите его указатель `post` на этот пост, и, когда это возможно, установите указатель `viewer` на `request user`, сохраните просмотр, вызовите `post increment("viewcount")`, сохраните пост и верните `request results`, чтобы завершить оригинальный запрос приведенный выше запрос создает триггер afterfind в классе post каждый раз, когда бэкенд возвращает один пост (извлеченный по его objectid), триггер автоматически создает новую запись view, которая указывает на этот пост (и текущего пользователя, если он вошел в систему) и увеличивает viewcount поста если запрос возвращает несколько постов, триггер ничего не делает с этим большинство функций вашего блога завершено далее вы реализуете функциональность, которая позволяет вашим пользователям удалять свои посты удаление постов чтобы удалить пост, пользователь должен быть его создателем после удаления поста все его связанные материалы (просмотры, комментарии) также удаляются вы можете реализовать функциональность для удаления постов, используя приведенный ниже запрос или аналогичный создайте облачную функцию deletepost , чтобы авторы могли удалять свои собственные работы вызывающий должен быть вошедшим в систему и должен передать objectid поста начните с извлечения поста и подтверждения, что его автор равен request user; если нет, отклоните запрос после проверки прав собственности удалите запись поста, затем удалите все связанные комментарии и просмотры, указатель поста которых совпадает с удаленным постом наконец, верните краткое сообщение об успехе вместе с количеством удаленных записей приведенный выше запрос реализует необходимую логику для удаления постов с этими дополнениями ваш бэкенд теперь охватывает полный жизненный цикл контента, позволяя авторам публиковать, редактировать и удалять, позволяя читателям обсуждать и сохраняя точную статистику просмотров для каждого поста в следующем разделе вы создадите пользовательский интерфейс для вашего приложения генерация вашего фронтенда вы можете воспользоваться контекстом, который имеет copilot, создавая ваш backend на back4app, чтобы попросить его создать frontend, который соответствует схеме и требованиям вашего приложения вы можете достичь этого для планировщика встреч, используя приведенный ниже запрос сгенерируйте минимальный frontend, который соответствует схеме и реализует всю функциональность приложения blog на моем аккаунте back4app и подключите frontend к backend, используя javascript parse sdk используя приведенный выше запрос или аналогичный, copilot сгенерирует frontend, который соответствует схеме вашего backend и подключит его к вашему backend запустите приложение, используя инструкции, предоставленные copilot, и внесите любые изменения, которые хотите теперь, когда ваш проект завершен, в следующем разделе вы развернете его на контейнерах back4app развертывание вашего приложения на контейнерах back4app контейнеры back4app позволяют вам легко развертывать ваши приложения, используя dockerfile и репозиторий github чтобы развернуть ваше приложение на контейнерах back4app, вам сначала нужно включить dockerfile в ваш репозиторий вы можете попросить claude сгенерировать его, используя приведенный ниже запрос сгенерируйте docker файл для пользовательского интерфейса моего блога или вы можете использовать предоставленный ниже dockerfile \# начните с официального легковесного образа nginx alpine from nginx\ alpine \# удалите содержимое по умолчанию run rm rf /usr/share/nginx/html/ \# скопируйте ваш статический сайт (html, css, ресурсы) в контейнер copy /usr/share/nginx/html/ \# откройте порт 80 expose 80 \# запустите nginx в фоновом режиме cmd \["nginx", " g", "daemon off;"] после добавления dockerfile и его отправки на github, перейдите на панель управления вашими приложениями back4app, нажмите на панель управления в выпадающем меню и выберите платформу веб развертывания на странице развертывания нажмите кнопку “развернуть веб приложение” и предоставьте back4app доступ к репозиторию, который вы хотите развернуть выберите приложение, которое вы хотите развернуть, заполните детали развертывания и нажмите кнопку развернуть нажатие на кнопку запускает процесс развертывания, и после его завершения вы получите живую ссылку на приложение вы можете просмотреть живой блог, созданный в этом учебном пособии, используя https //blogger 6rhmkal0 b4a run/ заключение в этой статье вы создали полноценную платформу для ведения блогов, используя сервер back4app mcp и github copilot, а затем развернули ее с помощью контейнеров back4app это демонстрирует полный набор инструментов back4app, который позволяет вам перейти от идеи к запуску с минимальными затратами в качестве следующего шага вы можете расширить проект такими функциями, как интеграция с социальными сетями, автоматические уведомления по электронной почте о новых комментариях, расширенный функционал поиска или аналитика вовлеченности постов и поведения читателей все эти улучшения естественно вписываются в тот же рабочий процесс back4app проектируйте и определяйте новые классы или облачные функции с помощью github copilot, защищайте их с помощью хуков beforesave и развертывайте обновления через контейнеры back4app этот подход позволяет вам добавлять новые функции в ваш блог, не нарушая работу пользователей