Tutoriais

Tutorial Banco de Dados

O intuito desse tutorial é apresentar o php e mysql que são softwares baseados em código digitado.
Para seguir esse tutorial são necessárias muitas ações além de escrever código, mas o principal é o ato de codar.

  • C - Create (armazenar no banco de dados)
  • R - Read (acessar registros na base de dados)
  • U - Update (alterar registro)
  • D - Delete (excluir registro)

    • php - Linguagem de programação de servidores

    sql - Linguagem de bancos de dados

    Instalar o Xampp

    O Xampp é um software que emula um webserver.
    Ele instala o php e o mysql.

    Criar um arquivo html

    Crie um arquivo chamado index.htm
    É importante entender que esse tipo de arquivo contém um tipo de código que é ao mesmo tempo entendível por seres humanos e renderizável pelos computadores.

    Escreva "hello world" nesse arquivo.
    Salve e 'execute pelo browser'.

    Perceba que são duas maneiras diferentes de lidar com o mesmo arquivo.

    Xampp emula websever

    Um webserver tradicional é um computador como outro qualquer, só que ele fica conectado a internet 24hs por dia.
    Quando outro computador acessa o webserver ele envia arquivos.
    Basicamente ele fica ligado o tempo todo esperando uma 'requisição'.
    Quando ocorre uma requisição ele envia uma resposta.



    O Xampp emula um webserver.
    No painel de controle do Xampp é possível startar o apache.
    O apache é o php.
    Ele serve para que o programador escreva instruções para o server executar quando ele receber a requisição.

    Exemplo: Quando o user envia uma requisição para o server, ele pode armazenar algo no banco de dados.

    O mysql também fica apenas experando para ser acionado.
    A diferença é que quem acessa o mysql é o proprio php.

    O php recebe a requisição, depois ele busca a informação no banco de dados e depois ele devolve a resposta para o usuário.

    php / htdocs / localhost

    É preciso que os arquivos estejam dentro da pasta xampp/htdocs/

    Quando o apache recebe a requisição ele procura na pasta xampp/htdocs/ qual arquivo php deve ser executado.

    Para começar vamos criar um arquivo chamado 'index.php' na pasta xampp\htdocs\produtos

    O conteúdo desse arquivo: 
    <!doctype html>
<html>
<body>

codigo html<br>

<?php
echo "codigo php<br>";
?>

</body>
</html>
    Para acessar pelo browser basta digitar localhost/produtos
    (é preciso que o php esteja startado no xampp)

    Tela de Cadastro

    Para começar a fazer o cadastro do produto podemos utilizar o seguinte código: 
    <!doctype html>
<html>

<head>
<style>
body{
	margin:0px;
	background-color:#e1e1e1;
	font-family:'Segoe Ui';
}

footer{
	position:fixed;
	display:block;
	width:100vw;
	bottom:0px;
	background-color:#8899bb;
	color:#333333;
	padding:20px;
}

h1{
	background-color:#8899bb;
	color:#333333;
	padding:20px;
	margin-top:0px;
}

table{
	background-color:#ffffff;
	padding:8px;
	margin:0px auto;
}

textarea{
	width:240px;
	height:66px;
}

th{
	background-color:#88bb99;
	color:#333333;
	padding:10px;
}

.aviso{
	background-color:#aa0000;
	color:#ffffff;
	font-weight:bold;
	padding:16px;
	text-align:center;
}

#preco{
	width:60px;
}
</style>
</head>

<body>
<h1>Tutorial CRUD</h1>

<form action=index.php method=post enctype=multipart/form-data>
<table>
	<tr>
		<th colspan=2>Cadastro de Produto</th>
	</tr>

	<tr>
		<td>Nome</td>
		<td><input name=nome></td>
	</tr>
	<tr>
		<td>Descrição</td>
		<td><textarea name=descricao></textarea></td>
	</tr>
	<tr>
		<td>Imagem</td>
		<td><input name=arq type=file></td>
	</tr>
	<tr>
		<td>Preço</td>
		<td><input name=preco id=preco></td>
	</tr>

	<tr>
		<td colspan=2 align=right>
			<button>Salvar</button>
		</td>
	</tr>
</table>
</form>

<footer></footer>

</body>
</html>

    Create table

    Vamos começar a lidar com a base de dados.
    Para isso vamos usar o phpMyAdmin que vem instalado no Xampp.





    É preciso criar uma nova base de dados.
    Podemos dar o nome tutorial.

    É preciso criar uma tabela chamada produtos.
    Com os campos:
  • id (int auto_increment)
  • nome (varchar)
  • descricao (varchar)
  • imagem (varchar)
  • preco (varchar)

    • É importante que o campo id seja auto_increment

    Comando insert

    Vamos fazer com que a tela de cadastro envie os dados para o DB. 
    <body>
<h1>Tutorial CRUD</h1>

<?php
$conn = new PDO('mysql:host=localhost;dbname=tutorial', 'root', ''); //conexão com a base de dados

if(isset($_POST['nome'])) { //quando o user preenche o campo nome da página e clica em salvar, o browser envia nova request para o server. nessa nova request existe uma varável do tipo POST

	$conn -> query("insert into produtos(nome, descricao, preco) values('".$_POST['nome']."', '".$_POST['descricao']."', '".$_POST['preco']."')"); //nessa linha o php envia um comando para inserir na base de dados

	if(isset($_FILES['arq']) && ($_FILES['arq']['tmp_name']) != '') { //se o user fez o upload da imagem do produto
		@mkdir("imagens"); //cria a pasta imagens dentro de xampp\htdocs\produtos

		$inserido = $conn -> lastInsertId(); //esse comando armazena o id do produto que foi inserido na base de dados

		move_uploaded_file($_FILES['arq']['tmp_name'], "imagens/" . $inserido . "_" . $_FILES['arq']['name']); //esse comando move o arquivo uppado (do endereço temporário para a pasta xampp\htdocs\produtos

		$conn -> query("update produtos set imagem='" . $inserido . "_".$_FILES['arq']['name']."' where id=" . $inserido); //esse comando coloca o nome da imagem uppada na base de dados
	}
	echo "<div class=aviso>produto inserido na base de dados</div><br>\n";
}
?>

<form action=index.php method=post enctype=multipart/form-data>
<table>

    Lista de Produtos

    Abaixo do formulário podemos exibir a lista de produtos cadastrados. 
    </table>
</form>

<?php

$stmt = $conn -> query("select id,nome from produtos"); //envia a query para a base de dados

if($stmt -> rowCount()) { //se existe algum produto cadastrado
	echo "<br><br>\n";
	echo "<table>\n";

	while($row = $stmt -> fetch()) { //o db vai armazenando na variável $row o valor de cada registro
		echo "<tr>"; //uma linha da tabela de produtos

		echo "<td>" . $row['id'] . "</td>";
		echo "<td>" . $row['nome'] . "</td>"; //o nome do produto

		echo "<td><button onclick=\"location.href='index.php?id=" . $row['id'] . "';\">Editar</button></td>"; //botão para editar produto
		echo "<td><button onclick=\"if(confirm('Tem Certeza ?'))location.href='index.php?del=" . $row['id'] . "';\">Excluir</button></td>"; //botão para deletar

		echo "</tr>";
	}

	echo "</table>\n";
}

?>

<footer></footer>

    Comando delete

    <h1>Tutorial CRUD</h1>

<?php
$conn = new PDO('mysql:host=localhost;dbname=tutorial', 'root', ''); //conexão com a base de dados

if(isset($_GET['del'])) { //se na url está index.php?del=7 exclui o produto 7

	$conn -> query("delete from produtos where id=" . $_GET['del']); //envia o comando de deletar para a base de dados

	echo "<div class=aviso>produto excluído da base de dados</div><br>\n"; //exibe mensagem de confirmação
}

?>

    Update

    Para implementar a alteração é preciso reescrever o formulário de cadastro para que ele busque os dados. 
    if(isset($_POST['nome'])) { //se a página formulário postou algo para o db

	if(isset($_GET['id'])) { //se na url está definido um id então os dados do produto devem ser ALTERADOS no db

		$conn -> query("update produtos set nome='" . $_POST['nome'] . "', descricao='" . $_POST['descricao'] . "', preco='" . $_POST['preco'] . "' where id=" . $_GET['id']); //essa linha envia para o db o comando de update

		if(isset($_FILES['arq']) && $_FILES['arq']['tmp_name'] != '') { //se um arquivo/imagem foi enviado

			@mkdir("imagens"); //cria a pasta imagens dentro de xampp\htdocs\produtos (caso não existir)

			move_uploaded_file($_FILES['arq']['tmp_name'], "imagens/" . $_GET['id'] . "_" . $_FILES['arq']['name']); //esse comando move o arquivo uppado (do endereço temporário para a pasta xampp\htdocs\produtos

			$conn -> query("update produtos set imagem='" . $_GET['id'] . "_" . $_FILES['arq']['name'] . "' where id=" . $_GET['id']); //esse comando atualiza na base de dados o endereço da imagem do produto
		}

		echo "<div class=aviso>os dados do produto foram alterados</div><br>\n"; //mensagem de confirmação

	}
	else{ //se na url NÃO está definido um id então os dados do produto devem ser INSERIDOS no db

		$conn -> query("insert into produtos(nome, descricao, preco) values('".$_POST['nome']."', '".$_POST['descricao']."', '".$_POST['preco']."')"); //nessa linha o php envia um comando para inserir na base de dados

		if(isset($_FILES['arq']) && ($_FILES['arq']['tmp_name']) != '') { //se o user fez o upload da imagem do produto
			@mkdir("imagens"); //cria a pasta imagens dentro de xampp\htdocs\produtos

			$inserido = $conn -> lastInsertId(); //esse comando armazena o id do produto que foi inserido na base de dados

			move_uploaded_file($_FILES['arq']['tmp_name'], "imagens/" . $inserido . "_" . $_FILES['arq']['name']); //esse comando move o arquivo uppado (do endereço temporário para a pasta xampp\htdocs\produtos

			$conn -> query("update produtos set imagem='" . $inserido . "_".$_FILES['arq']['name']."' where id=" . $inserido); //esse comando coloca o nome da imagem uppada na base de dados
		}
		echo "<div class=aviso>produto inserido na base de dados</div><br>\n";
	}
}
    
if(isset($_GET['id'])) { //se houver um id na url, então a página exibe os dados do produto para que o user possa editar

	$stmt = $conn -> query("select * from produtos where id=" . $_GET['id']); //busca no db os dados do produto

	$row = $stmt->fetch(); //armazena os dados do produto na variável $row

	if(is_file("imagens/" . $row['imagem'])) //se existe a imagem
		echo "<center><img src='imagens/".$row['imagem']."' style='max-width:300px;'></center><br>\n"; //exibe a imagem do produto

	echo "<form action=index.php?id=".$_GET['id']." method=post enctype=multipart/form-data>\n";
	echo "<table>\n";
	echo "<tr><th colspan=2>Alterar dados do Produto</th></tr>\n";
}
else{ //se não há id na url, então a página exibe o formulário para o user inserir dados

	$row['nome']=$row['descricao']=$row['preco']=""; //inicializa as variáveis $row que serão utilizadas no form

	echo "<form action=index.php method=post enctype=multipart/form-data>\n";
	echo "<table>\n";
	echo "<tr><th colspan=2>Cadastro de Produto</th></tr>\n";
}

echo "<tr><td>Nome</td><td><input name=nome value='" . $row['nome'] . "'></td></tr>\n";
echo "<tr><td>Descrição</td><td><textarea style='width:240px; height:66px;' name=descricao>" . $row['descricao'] . "</textarea></td></tr>\n";
echo "<tr><td>Imagem</td><td><input name=arq type=file></td></tr>\n";
echo "<tr><td>Preço</td><td><input name=preco style='width:60px;' value='" . $row['preco'] . "'></td></tr>\n";

echo "<tr><td colspan=2 align=right>";
if(isset($_GET['id'])) //se o form está exibindo dados (para serem editados)
	echo "<input type=button value=Novo onclick=\"location.href='index.php';\"> "; //um botão para ir da pag de edição para a pag de criação
echo "<input type=submit value=Salvar></td></tr>\n";

echo "</table>\n";
echo "</form>\n";