1724026
/
progredes20261
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Página HTML

This commit is contained in:
Joao 2026-06-01 20:56:57 -03:00
parent aee4a1b7fb
commit 50647dd094
3 changed files with 74 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
apirest/frontend/index.html Normal file
View File

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Produtos</title>
</head>
<body>
<h1>Lista de produtos</h1>
<main>
<table>
<thead>
<tr>
<th>Nome</th>
<th>Preço</th>
<th>Estoque</th>
</tr>
</thead>
<tbody id="conteudo_tabela">
</tbody>
</table>
</main>
<script src="script.js"></script>
</body>
</html>

20
apirest/frontend/script.js Normal file
View File

@ -0,0 +1,20 @@
async function carregarProdutos(){
const resposta = await fetch("http://localhost:5000/produtos");
if (!resposta.ok){
throw new Error("Não foi possível carregar a lista")
}
const produtos = await resposta.json();
let tbody = document.querySelector("tbody");
produtos.forEach(produto => {
let linha = document.createElement("tr");
linha.innerHTML = ` <td>${produto.nome}</td>
<td>${produto.preco}</td>
<td>${produto.estoque}</td>
`
tbody.appendChild(linha);
});
}
window.addEventListener("load", () => {
carregarProdutos();
})

24
apirest/frontend/style.css Normal file
View File

@ -0,0 +1,24 @@
/*
Seletor {
propriedade1 : valor;
propriedade2 : valor;
...
propriedadeN : valor;
}
*/
/* CSS de RESET */
* {
margin : 0;
padding: 0;
}
h1 {
width : 300px;
background-color: brown;
padding: 20px;
border: 10px solid black;
text-align: center;
margin: 0 auto;
}