Como é feito o "meio-de-campo" entre a parte front-end e a do back-end da aplicação?

Front-end
#1

Estou trabalhando em um projeto fictício com um amigo da faculdade. Ele é responsável pela parte do front-end, com HTML, CSS e JavaScript. Já eu, estou na parte do back-end com Java. Porém, gostaria de saber como é feito esse “meio-de-campo” entre ambas as partes, como que meu código Java vai saber como e qual caixa de texto, botão, etc, pegar.

#2

seu código nao vai saber, vai acontecer assim…

O front vai fazer uma solicitação de um pedido de comida (por exemplo), e vai ficar aguardando a resposta

O backend vai receber o pedido e vai ver se no banco de dados possui algo similar com o que foi solicitado, tipo: {produto: "Batata Frita"}. Se houver, o sistema pode retornar algo como:

[
    {
       "nome": "Batata Frita",
       "tamanho": "Médio",
       "valor": 7.50,
       "adicionais": ["bacon", "cheddar"]
    },
    {
       "nome": "Batata Frita",
       "tamanho": "Grande",
       "valor": 10.50,
       "adicionais": ["bacon", "cheddar", "frango", "salada"]
    }
]

Assim que o backend responder, o front vai entender isso e vai aproveitar esses dados que foram retornados, e aí jogar pra o devido componente, exemplo:

<ul>
   {respostaDoBanco.map((produto) => (
     <li>
       <h2>
           {produto.nome}
        </h2>

        <label>
           Preço
        </label>
        <p>
           {produto.valor}
        </p>

        <label>
           Tamanho
        </label>
        <p>
           {produto.tamanho}
        </p>
     </li>
    )
 }
<ul>
#3

ou seja:

o front que vai ser o responsável por pegar os dados recebidos e repassar pra os devidos componentes

#4

Já ouviu falar em UML ?

#5

Sim, já sim.

#6

Com UML você modela os métodos e objetos, e cada pessoa (front / end) vai saber o que trabalhar e como trabalhar com aquilo.

#7

eu sei pow, a pergunta era como é feita essa integração entre as 2 partes