Как создать бэкэнд с помощью VS Code?
23 мин
vs code позволяет интегрировать внешние инструменты, которые имеют активный сервер mcp, через протокол mcp это позволяет выполнять задачи и считывать данные из этих источников, не покидая вашу ide, используя подсказки в этом учебном пособии вы узнаете, как создать бэкенд и пользовательский интерфейс (ui) для платформы блога, используя сервер back4app mcp через vs code и развернуть его на контейнерах back4app основные выводы узнайте, как создать бэкенд на back4app, используя vs code и сервер mcp изучите, как моделируются отношения между классами на back4app изучите, как аутентификация и авторизация на основе ролей реализованы back4app с использованием их встроенных классов разверните ваше приложение в несколько кликов, используя контейнеры back4app вы можете просмотреть живой блог, созданный в этом учебном пособии, используя эту ссылку предварительные требования чтобы следовать этому учебному пособию, вам необходимо иметь следующее аккаунт back4app вы можете зарегистрироваться бесплатно , если у вас его нет установленный 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 подсказку ниже или подобную, чтобы создать классы, необходимые для вашего приложения подсказка выше создает новый бэкенд back4app под названием “blogger” и заполняет его классами post, comment и view вместе с их обязательными свойствами когда вы выполните эту подсказку с copilot, он будет записывать шаги, которые он выполняет, в вашем окне чата и спрашивать у вас разрешение на каждом из шагов, которые изменяют ваши данные для наилучших результатов выполняйте эти подсказки с помощью премиум модели, такой как 03 mini или claude sonnet 4 после того как copilot создаст необходимые классы, у вас теперь есть структурированный способ хранения данных вашего блога в следующем разделе вы реализуете аутентификацию для вашего приложения реализация аутентификации требования к аутентификации для вашего приложения просты пользователи должны зарегистрироваться и войти в систему, чтобы создавать записи в блоге и комментировать записи в блоге однако они могут читать записи в блоге в вашем приложении без аутентификации вы можете реализовать требования к аутентификации для вашего приложения, используя приведенный ниже запрос запрос выше добавляет аутентификацию пользователей в ваше приложение логика аутентификации позволяет вашим пользователям создать учетную запись, используя электронную почту, имя пользователя и пароль после регистрации пользователь автоматически входит в систему, а когда пользователь выходит, его текущая сессия аннулируется после того как copilot реализует вашу логику аутентификации, у ваших пользователей будет безопасный способ регистрации и входа в систему в следующем разделе вы реализуете логику, необходимую для создания записей и комментариев создание записей и комментариев чтобы реализовать функцию создания записей и комментариев, вам нужно создать две облачные функции и поддерживающие хуки, которые позволят аутентифицированным пользователям публиковать записи и добавлять комментарии в одном упрощенном потоке начните с создания поддерживающих хуков, предоставив copilot приведенный ниже запрос или аналогичный вышеуказанный запрос реализует проверки/действия, выполняемые перед созданием поста или комментария для постов создается уникальный слаг, используя его заголовок, затем статус меняется на опубликованный, а текущая дата устанавливается как дата публикации для комментариев пост, к которому он привязан, просто обновляет количество комментариев теперь создайте облачные функции, связанные с хуками beforesave, используя запрос ниже или аналогичный вышеуказанный запрос предоставляет две функции облачного кода, которые позволяют вашим пользователям создавать посты и комментарии он также защищает ваше приложение от злоупотреблений, ограничивая создание 5 постов и 15 комментариев в минуту основная логика, связанная с созданием постов и комментариев, уже была реализована в хуках beforesave, созданных в предыдущем запросе; этот просто предоставляет api для фронтенда после того как copilot реализует вышеуказанную логику, ваши пользователи получат возможность создавать и комментировать посты в следующем разделе вы реализуете логику, необходимую для обновления этих комментариев и постов, а также логику, необходимую для подсчета просмотров каждого блога обновление постов, комментариев и просмотров чтобы реализовать функциональность, позволяющую пользователям редактировать свои посты, пересматривать свои комментарии и регистрировать просмотры страниц, вам нужны две облачные функции updatepost, updatecomment и aftertrigger вы можете реализовать облачную функцию updatepost, используя запрос ниже или аналогичный вышеуказанный запрос создает функцию, которая обновляет пост он гарантирует, что обновление может быть выполнено только пользователем, который создал пост, и регенерирует слаг, если заголовок изменен вы можете реализовать облачную функцию updatecomment, используя приведенный ниже запрос или аналогичный приведенный выше запрос создает функцию, которая обновляет комментарий к посту обновление может быть выполнено только создателем комментария вы можете реализовать облачную функцию recordview, используя приведенный ниже запрос или аналогичный приведенный выше запрос создает триггер afterfind в классе post каждый раз, когда бэкенд возвращает один пост (извлеченный по его objectid), триггер автоматически создает новую запись view, которая указывает на этот пост (и текущего пользователя, если он вошел в систему) и увеличивает viewcount поста если запрос возвращает несколько постов, триггер ничего не делает с этим большинство функций вашего блога завершено далее вы реализуете функциональность, которая позволяет вашим пользователям удалять свои посты удаление постов чтобы удалить пост, пользователь должен быть его создателем после удаления поста все его связанные материалы (просмотры, комментарии) также удаляются вы можете реализовать функциональность для удаления постов, используя приведенный ниже запрос или аналогичный приведенный выше запрос реализует необходимую логику для удаления постов с этими дополнениями ваш бэкенд теперь охватывает полный жизненный цикл контента, позволяя авторам публиковать, редактировать и удалять, позволяя читателям обсуждать и сохраняя точную статистику просмотров для каждого поста в следующем разделе вы создадите пользовательский интерфейс для вашего приложения генерация вашего фронтенда вы можете воспользоваться контекстом, который имеет copilot, создавая ваш backend на back4app, чтобы попросить его создать frontend, который соответствует схеме и требованиям вашего приложения вы можете достичь этого для планировщика встреч, используя приведенный ниже запрос используя приведенный выше запрос или аналогичный, copilot сгенерирует frontend, который соответствует схеме вашего backend и подключит его к вашему backend запустите приложение, используя инструкции, предоставленные copilot, и внесите любые изменения, которые хотите теперь, когда ваш проект завершен, в следующем разделе вы развернете его на контейнерах back4app развертывание вашего приложения на контейнерах back4app контейнеры back4app позволяют вам легко развертывать ваши приложения, используя dockerfile и репозиторий github чтобы развернуть ваше приложение на контейнерах back4app, вам сначала нужно включить dockerfile в ваш репозиторий вы можете попросить claude сгенерировать его, используя приведенный ниже запрос или вы можете использовать предоставленный ниже dockerfile после добавления dockerfile и его отправки на github, перейдите на панель управления вашими приложениями back4app, нажмите на панель управления в выпадающем меню и выберите платформу веб развертывания на странице развертывания нажмите кнопку “развернуть веб приложение” и предоставьте back4app доступ к репозиторию, который вы хотите развернуть выберите приложение, которое вы хотите развернуть, заполните детали развертывания и нажмите кнопку развернуть нажатие на кнопку запускает процесс развертывания, и после его завершения вы получите живую ссылку на приложение вы можете просмотреть живой блог, созданный в этом учебном пособии, используя эту ссылку заключение в этой статье вы создали полноценную платформу для ведения блогов, используя сервер back4app mcp и github copilot, а затем развернули ее с помощью контейнеров back4app это демонстрирует полный набор инструментов back4app, который позволяет вам перейти от идеи к запуску с минимальными затратами в качестве следующего шага вы можете расширить проект такими функциями, как интеграция с социальными сетями, автоматические уведомления по электронной почте о новых комментариях, расширенный функционал поиска или аналитика вовлеченности постов и поведения читателей все эти улучшения естественно вписываются в тот же рабочий процесс back4app проектируйте и определяйте новые классы или облачные функции с помощью github copilot, защищайте их с помощью хуков beforesave и развертывайте обновления через контейнеры back4app этот подход позволяет вам добавлять новые функции в ваш блог, не нарушая работу пользователей