PÁGINA DE EXEMPLOS DE APLICAÇÃO WEB

---

Programa Simples de Cálculo de IMC com HTML e JavaScript

Neste exemplo, o HTML fornecerá a estrutura para os campos de entrada de peso e altura, e um botão para iniciar o cálculo. O JavaScript será responsável por pegar esses valores, calcular o IMC e exibir o resultado na página.

Calculadora de IMC:

Peso (kg):

Altura (m):

Explicação do Código:

HTML (`imc.html` - o código da calculadora):

<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Calculadora de IMC</title>
    <style>
        /* Estilos CSS omitidos para brevidade neste exemplo */
    </style>
</head>
<body>
    <div class="container">
        <h1>Calculadora de IMC</h1>
        <div>
            <label for="peso">Peso (kg):</label>
            <input type="number" id="peso" placeholder="Ex: 70.5">
        </div>
        <div>
            <label for="altura">Altura (m):</label>
            <input type="number" id="altura" placeholder="Ex: 1.75">
        </div>
        <button onclick="calcularIMC()">Calcular IMC</button>
        <div id="resultado"></div>
    </div>
 
    <script>
        function calcularIMC() {
            const peso = parseFloat(document.getElementById('peso').value);
            const altura = parseFloat(document.getElementById('altura').value);
            const resultadoDiv = document.getElementById('resultado');
 
            if (isNaN(peso) || isNaN(altura) || peso <= 0 || altura <= 0) {
                resultadoDiv.textContent = "Por favor, insira peso e altura válidos.";
                return;
            }
 
            const imc = peso / (altura * altura);
            resultadoDiv.textContent = `Seu IMC é: ${imc.toFixed(2)}`;
        }
    </script>
</body>
</html>

JavaScript (`<script>`):

A função calcularIMC() é definida e executada quando o botão é clicado.
Ela obtém os valores de **peso** e **altura** dos campos de entrada, convertendo-os para números.
Realiza uma **validação** para garantir que os valores são numéricos e positivos.
Calcula o **IMC** usando a fórmula `peso / (altura * altura)`.
Exibe o resultado formatado no elemento com `id="resultado"`.

Como Usar a Calculadora:

Digite seu peso (em quilogramas) no campo "Peso (kg)".
Digite sua altura (em metros) no campo "Altura (m)".
Clique no botão "Calcular IMC".
O resultado do seu IMC será exibido abaixo do botão.

Demonstração da Interação:

Este programa demonstra como o HTML cria a interface do usuário (os campos de entrada e o botão), e o JavaScript adiciona a interatividade e a lógica (pegar os valores, calcular o IMC e atualizar a página com o resultado) sem a necessidade de enviar informações para um servidor (backend) neste caso. Tudo acontece no navegador do usuário (frontend).

A diferença entre as duas aplicações é que o JavaScript não precisa de outro componente para rodar junto ao HTML, tornando a programação mais "fácil" devido a não precisar de outra ferramenta.