Como Criar um Sistema de cadastro com MySQL, PHP e Bootstrap
Neste tutorial, você aprenderá a criar um sistema utilizando PHP, MySQL e Bootstrap. O sistema permitirá cadastrar usuários (alunos, trainers e administradores) como por exemplo usuários de uma academia. Vamos começar!
1. Estruturando o Banco de Dados
Crie um banco de dados chamado academia com as seguintes tabelas:
CREATE TABLE usuarios (
id INT AUTO_INCREMENT PRIMARY KEY,
nome VARCHAR(100) NOT NULL,
email VARCHAR(100),
telefone VARCHAR(15),
tipo ENUM('Aluno', 'Trainer', 'Administrador') NOT NULL,
senha VARCHAR(255) NOT NULL
);
CREATE TABLE treinos (
id INT AUTO_INCREMENT PRIMARY KEY,
nome VARCHAR(100) NOT NULL
);
CREATE TABLE fichas (
id INT AUTO_INCREMENT PRIMARY KEY,
usuario_id INT NOT NULL,
treino_id INT NOT NULL,
data_criacao DATE NOT NULL,
FOREIGN KEY (usuario_id) REFERENCES usuarios(id),
FOREIGN KEY (treino_id) REFERENCES treinos(id)
);
2. Configurando o Ambiente PHP
Crie um arquivo config.php para conectar ao banco de dados:
<?php
$host = 'localhost';
$user = 'root';
$password = ''; // Altere conforme necessário
$dbname = 'academia';
$conn = new mysqli($host, $user, $password, $dbname);
if ($conn->connect_error) {
die("Conexão falhou: " . $conn->connect_error);
}
?>
3. Criando o Formulário de Cadastro
Crie o arquivo form_usuario.php para incluir o formulário de cadastro:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<title>Cadastro de Usuários</title>
</head>
<body>
<div class="container mt-5">
<h1>Cadastro de Usuários</h1>
<form action="processa_usuario.php" method="POST" class="mt-4">
<div class="mb-3">
<label for="nome" class="form-label">Nome</label>
<input type="text" name="nome" id="nome" class="form-control" required>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" name="email" id="email" class="form-control" required>
</div>
<div class="mb-3">
<label for="telefone" class="form-label">Telefone</label>
<input type="text" name="telefone" id="telefone" class="form-control" required>
</div>
<div class="mb-3">
<label for="tipo" class="form-label">Tipo de Cadastro</label>
<select name="tipo" id="tipo" class="form-control" required>
<option value="Aluno">Aluno</option>
<option value="Trainer">Trainer</option>
<option value="Administrador">Administrador</option>
</select>
</div>
<div class="mb-3">
<label for="senha" class="form-label">Senha</label>
<input type="password" name="senha" id="senha" class="form-control" required>
</div>
<button type="submit" class="btn btn-primary">Cadastrar Usuário</button>
</form>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
4. Processando o Cadastro
Crie o arquivo processa_usuario.php para processar os dados enviados pelo formulário:
<?php
include 'config.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
// Capturando os dados do formulário
$nome = $_POST['nome'];
$email = $_POST['email'];
$telefone = $_POST['telefone'];
$tipo = $_POST['tipo'];
$senha = password_hash($_POST['senha'], PASSWORD_DEFAULT); // Criptografando a senha
// SQL para inserir os dados no banco
$sql = "INSERT INTO usuarios (nome, email, telefone, tipo, senha) VALUES (?, ?, ?, ?, ?)";
// Preparando a consulta para evitar injeção SQL
$stmt = $conn->prepare($sql);
if ($stmt) {
$stmt->bind_param("sssss", $nome, $email, $telefone, $tipo, $senha);
if ($stmt->execute()) {
echo "<div class='alert alert-success'>Usuário cadastrado com sucesso!</div>";
echo "<a href='index.php' class='btn btn-primary'>Voltar para a Página Inicial</a>";
} else {
echo "<div class='alert alert-danger'>Erro ao cadastrar usuário: " . $stmt->error . "</div>";
}
$stmt->close();
} else {
echo "<div class='alert alert-danger'>Erro na preparação da consulta: " . $conn->error . "</div>";
}
$conn->close();
} else {
echo "<div class='alert alert-danger'>Método de requisição inválido.</div>";
}
?>
5. Criando a Página Inicial
Adicione um arquivo index.php para listar os cadastros e permitir ações:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<title>Gestão de Academia</title>
</head>
<body>
<div class="container mt-5">
<h1>Gestão de Academia</h1>
<a href="form_usuario.php" class="btn btn-success mb-3">Cadastrar Novo Usuário</a>
<table class="table table-striped">
<thead>
<tr>
<th>ID</th>
<th>Nome</th>
<th>Email</th>
<th>Telefone</th>
<th>Tipo</th>
<th>Ações</th>
</tr>
</thead>
<tbody>
<?php
include 'config.php';
$sql = "SELECT * FROM usuarios";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['nome'] . "</td>";
echo "<td>" . $row['email'] . "</td>";
echo "<td>" . $row['telefone'] . "</td>";
echo "<td>" . $row['tipo'] . "</td>";
echo "<td>
<a href='editar_usuario.php?id=" . $row['id'] . "' class='btn btn-warning btn-sm'>Editar</a>
<a href='excluir_usuario.php?id=" . $row['id'] . "' class='btn btn-danger btn-sm'>Excluir</a>
</td>";
echo "</tr>";
}
} else {
echo "<tr><td colspan='6' class='text-center'>Nenhum usuário encontrado.</td></tr>";
}
$conn->close();
?>
</tbody>
</table>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Conclusão
Com os passos acima, você terá um sistema funcional para gerenciar cadastro. Não está cmpleto, porém acredito que seja de grande ajuda para que está iniciando. Adicione melhorias conforme necessário!
Veja o sistema funcioando aqui: https://har-ti.com/projetos/academia/
