Como Construir um Backend Usando Claude?
18 min
o desenvolvimento tradicional de backend frequentemente requer uma extensa codificação, gerenciamento de infraestrutura e recursos significativos de desenvolvimento no entanto, aproveitar plataformas modernas de backend como serviço pode simplificar drasticamente esse processo o back4app simplifica esse processo ao fornecer um conjunto abrangente de ferramentas projetadas para acelerar seu fluxo de trabalho uma dessas ferramentas é o protocolo de contexto de modelo (mcp) do back4app , que permite que você construa um backend inteiro a partir de um llm como claude usando apenas linguagem natural neste tutorial, você aprenderá como construir o backend e a interface do usuário (ui) para um rastreador de despesas pessoais usando o servidor mcp do back4app através do claude e implantá lo em contêineres do back4app principais conclusões você pode visualizar o rastreador de despesas pessoais ao vivo construído neste tutorial usando este link descubra como estruturar um backend no back4app em minutos usando prompts do claude e o servidor mcp veja os hooks de cloud code em ação enquanto eles garantem gravações apenas para o proprietário e mantêm os resumos mensais precisos sem infraestrutura extra aprenda a criar um frontend responsivo que se conecta às suas apis parse através do sdk javascript, tudo gerado pelo claude explore a implantação com um clique com os contêineres do back4app, enviando seu repositório do github para produção com zero sobrecarga operacional pré requisitos para seguir este tutorial, você precisa ter o seguinte uma conta back4app você pode se inscrever gratuitamente se você não tiver uma claude desktop instalado em seu sistema familiaridade básica com conceitos de desenvolvimento backend visão geral do projeto rastreador de despesas pessoais você construirá um backend para rastreamento de despesas que claude pode consultar e atualizar em tempo real seu rastreador de despesas pode registrar suas despesas organizadas por categorias e fornece resumos mensais e anuais de seus hábitos de consumo o projeto tem 4 modelos de dados usuários esta tabela armazena credenciais de conta e o limite de gastos mensal total para cada pessoa os campos incluem email, senha, orçamento mensal e timestamps despesa esta tabela armazena cada compra aqui data, valor, categoria e uma descrição categoria esta tabela armazena rótulos definidos pelo usuário para agrupar despesas os campos incluem id, user id, nome e timestamps resumos mensais esta tabela armazena totais pré agregados para verificações rápidas de painel e orçamento os campos incluem user id , mês , total gasto , e timestamps cada vez que você registra uma despesa, um beforesave acionador de cloud code encontra (ou cria) o resumomensal daquele mês e incrementa seus totais e deduz o valor do seu orçamento mensal aqui está um diagrama de relacionamento de entidades para ajudá lo a visualizar o esquema agora que você tem uma ideia geral do que estará construindo, na próxima seção você configurará o servidor back4app mcp com o claude desktop e começará a escrever prompts que criarão o aplicativo descrito nesta seção conectando back4app e claude desktop para conectar o servidor back4app mcp ao claude desktop, primeiro você precisa de uma chave de conta back4app para recuperá la, faça login na sua conta back4app e no seu painel de usuário, clique no menu suspenso na barra de navegação e selecione chaves de conta na página account keys , dê um nome à sua chave de conta, copie a chave gerada e armazene a com segurança em seguida, você precisa modificar o arquivo de configuração do claude desktop para incluir o servidor mcp do back4app por padrão, o arquivo de configuração do claude desktop não existe no seu sistema você pode criar o arquivo de configuração navegando até as configurações do desktop do claude no seu sistema, selecionando a developer option, e clicando no botão edit config ou você pode seguir este guia isso criará um arquivo de configuração em (se você ainda não tiver um) macos /library/application support/claude/claude desktop config json windows %appdata%\\\claude\\\claude desktop config json …e exibirá o arquivo no seu sistema de arquivos abra o arquivo de configuração com qualquer editor de texto de sua escolha e adicione a configuração abaixo { "mcpservers" { "back4app" { "command" "npx", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } substitua \<account key> pela sua chave de conta, salve o arquivo e reinicie o desktop do claude se você estiver seguindo este tutorial em uma máquina windows, altere o valor da chave de comando para npx cmd com essas configurações em vigor, você está pronto para começar a construir seu backend do back4app com o servidor mcp do back4app e o desktop do claude criando o backend com claude desktop para criar o backend do projeto descrito anteriormente, você deve criar um novo aplicativo no back4app e, no aplicativo, criar as tabelas de banco de dados apropriadas você pode conseguir isso usando o claude desktop e um prompt seu prompt deve instruir o claude a criar um novo aplicativo chamado “rastreador de despesas pessoais”, definir quatro classes mongodb ( user, category, expense e monthlysummary) com os campos necessários, relacionamentos de ponteiro, valores padrão e controles de acesso, e embutir ganchos de cloud code que atualizam os resumos mensais sempre que uma despesa muda, bloqueiam gravações não autorizadas e evitam nomes de categorias duplicados para um usuário um exemplo de prompt que alcança isso é fornecido abaixo create a new back4app app named “personal expense tracker” class \\\\ user email string, required, unique passwordhash string, required monthlybudget number, required, default 0 (smallest currency unit) add a unique index on email class category user pointer<\\\\ user>, required (owner) name string, required acl public read, owner write add a compound unique index on {user, name} class expense user pointer<\\\\ user>, required category pointer\<category>, optional amount number, required currency string (length 3), required, default “usd” spentat date, required note string, optional isdeleted boolean, required, default false acl public read, owner write add indexes on {user, spentat} and {user, isdeleted} class monthlysummary user pointer<\\\\ user>, required month date, required (store the first day of the month) totalspent number, required acl public read, owner write add a unique index on {user, month} cloud code 1\ aftersave on expense if isdeleted is false, upsert the matching monthlysummary row (month = first day of spentat) and increment totalspent by amount if an expense is soft deleted (isdeleted toggled to true), decrement totalspent accordingly 2\ beforesave on expense reject writes when the authenticated user is not equal to user 3\ beforesave on category enforce the per user unique {user, name} combination create all classes, fields, indexes, clps, and cloud code hooks exactly as specified quando você enviar o prompt, receberá uma série de pop ups do claude solicitando permissão para realizar tarefas específicas, como criar o aplicativo os pop ups oferecem uma oportunidade para revisar e autorizar cada ação potencialmente irreversível, como criar um novo aplicativo ou adicionar classes, garantindo que nada seja implantado, cobrado ou exposto sem seu consentimento explícito eles atuam como uma salvaguarda contra mudanças acidentais, garantindo que você permaneça no controle de seus recursos do back4app em seguida, implemente a autenticação de usuário em seu aplicativo, dando a claude uma série de comandos que instruem a adicionar funções de cloud para cadastro e login baseadas em token, remover o acesso público à classe user, manter a leitura pública, mas escrita apenas para o proprietário em categoria, despesa e resumomensal, e criar guardas beforesave que rejeitam qualquer escrita quando a solicitação não estiver autenticada uma lista de exemplos de comandos para cada funcionalidade está listada abaixo cadastrar update the back4app application “personal expense tracker” to include a cloud code function called signupuser inputs email, password, monthlybudget (optional, default 0) if a user with the same email already exists, throw an error otherwise create the user record with those values and return the session token este comando cria o código de nuvem para cadastro fazer login update the back4app application “personal expense tracker” to include a cloud code function called loginuser inputs email, password call parse user login with those credentials and return the session token on success este comando cria um login correspondente para o código de nuvem permissões de nível de classe update class level permissions for the personal expense tracker \ keep public read but owner only write on category, expense, and monthlysummary este comando garante que apenas os proprietários da categoria, despesa e resumo mensal possam modificá los executar esses comandos conclui toda a sua lógica de backend na próxima seção, você gerará um frontend para o seu backend gerando o frontend como claude criou seu backend back4app, ele se lembra de como é o esquema e as respostas aproveitando esse contexto, você pode pedir para criar uma interface de usuário que corresponda ao esquema do aplicativo criado um exemplo de prompt é fornecido abaixo generate a minimal frontend that matches the schema and implements all the functionality of the personal expense tracker on my back4app account and connect the frontend to the backend using the javascript parse sdk você deve obter uma interface de usuário completa copie o código fornecido em um ide como o vs code e envie o código para o github na próxima seção, você implantará seu frontend em contêineres back4app implantando seu app em contêineres back4app os contêineres back4app permitem que você implante seus aplicativos facilmente usando um dockerfile e um repositório do github para implantar seu aplicativo nos contêineres back4app, você precisa primeiro incluir um dockerfile em seu repositório você pode pedir ao claude para gerar um usando o prompt abaixo generate a docker file for the ui of my personal expense tracker ou você pode usar o dockerfile fornecido abaixo \# start from the official lightweight nginx alpine image from nginx\ alpine \# remove default content run rm rf /usr/share/nginx/html/ \# copy your static site (html, css, assets) into the container copy /src /usr/share/nginx/html/ \# expose port 80 expose 80 \# start nginx in the foreground cmd \["nginx", " g", "daemon off;"] após adicionar o dockerfile e enviá lo para o github, navegue até o painel de aplicativos do back4app, clique no painel dropdown e selecione a opção plataforma de implantação web na página de implantação, clique no botão “implantar um aplicativo web” e dê ao back4app acesso ao repositório que você deseja implantar selecione o aplicativo que deseja implantar, preencha os detalhes da implantação e clique no botão implantar clicar no botão inicia o processo de implantação e, após a conclusão, você receberá uma url ao vivo para o aplicativo você pode visualizar o rastreador de despesas pessoais ao vivo construído neste tutorial usando este link conclusão neste artigo, você construiu um aplicativo que rastreia suas despesas usando o servidor mcp do back4app e claude, e então você o implantou usando contêineres do back4app isso demonstra a suíte completa de ferramentas do back4app que permite que você construa aplicativos desde a ideação até o lançamento com um overhead mínimo como próximo passo, você pode estender o projeto com recursos como modelos de despesas recorrentes, importações de csv ou notificações push para estouros de orçamento todas essas melhorias se encaixam naturalmente no mesmo fluxo de trabalho do back4app defina novas classes ou funções em nuvem com claude, proteja as com hooks beforesave e implemente atualizações através de contêineres do back4app essa abordagem permite que você melhore seu aplicativo sem interromper os usuários ou mudar de provedores de hospedagem