Publicado em

CRUD com Bootstrap, PHP & MySQL – Parte I

A maior parte dos sistemas em PHP é feito com um banco de dados no back end, e normalmente, esse banco de dados é o MySQL. Por isso, é importante criar essa camada de acesso a dados de uma forma bem genérica e independente, para que depois ela possa ser reaproveitada em todo o sistema.

Neste tutorial, você vai ver como deve ser esse banco de dados para o nosso sistema de CRUD e como criá-lo, executando o SQL pelo phpMyAdmin. Depois disso, vamos criar um arquivo de configurações para usar em todo o sistema. E ,por fim, vamos criar o script de conexão com esse banco de dados, usando PHP.

CRUD com Bootstrap, PHP e MySQL - Parte 1

Ao final, você vai ter uma estrutura inicial do banco de dados para o nosso CRUD, e a tabela de clientes vazia, além dos arquivos iniciais do projeto.


Antes de Começar

Eu vou assumir que você já está com o seu ambiente de desenvolvimento funcionando.

Aqui, nós vamos utilizar o XAMPP, que já traz o PHP, o MySQL (ou MariaDB), e o phpMyAdmin para manipular o banco de dados.

Se você ainda não estiver com o ambiente pronto, é só ver a introdução desta série e instalar os pré-requisitos.


Passo 1: Crie o Banco de Dados e a Tabela de Clientes

Para este tutorial, vamos criar um banco de dados bem simples, com uma tabela de clientes apenas.

Eu vou usar aqueles campos de clientes que são usados em notas fiscais para criar essa tabela, e assim ela vai servir de exemplo para um cadastro de clientes bem genérico.

O mapeamento das colunas da tabela de clientes ficou assim:

Clientes (codigo, nome, cpf/cnpj, data de nascimento, 
          endereço, bairro, cep, cidade, estado, 
          telefone, celular, inscrição estadual, 
          data de cadastro, data de atualização)

Uma boa prática, que eu sempre recomendo, é você traduzir os nomes de tabelas e os campos para o inglês, e a partir daí criar seu banco de dados. Isso facilita muito na hora de escrever as consultas, e na hora de escrever o código do sistema. Você ainda acaba aprendendo um pouco mais do idioma.

Então, nós vamos ter os seguintes campos:

customers
 PK id  int
name  varchar
cpf_cnpj  varchar
birthdate  date
address  varchar
hood  varchar
zip_code  int
city  varchar
state  varchar
phone  int
mobile  int
ie  int
created  datetime
modified  datetime

E, convertendo tudo isso em SQL, fica assim:

Agora, abra o phpMyAdmin do XAMPP e crie um banco de dados. Eu coloquei o nome como wda_crud.

Se preferir, pode fazer via SQL direto (na aba SQL, do phpMyAdmin):

CREATE DATABASE wda_crud;

Depois que criar, use o SQL acima para criar a tabela ‘customers‘ nesse banco de dados.


Passo 2: Crie o Arquivo de Configurações do Sistema

Agora, vamos criar um arquivo de configurações, que vai guardar todos os dados que vão ser usados em todos os outros scritps PHP do sistema.

Crie um arquivo chamado config.php, na pasta principal, e coloque o código a seguir:

Este arquivo de configurações é baseado no wp-config do WordPress.

Os quatro primeiros itens são as constantes que vão guardar as credenciais para acessar o banco de dados:

  • o DB_NAME define o nome do seu banco de dados;
  • o DB_USER é o usuário para acessar o banco de dados;
  • o DB_PASSWORD é a senha deste usuário (no XAMPP, este usuário root não tem senha);
  • e o DB_HOST é endereço do servidor do banco de dados;

Você deve modificar esses valores de acordo com o seu ambiente de desenvolvimento, ou de produção.

Além dessas constantes, temos mais duas outras que são muito importantes:

O  ABSPATH, na linha 17, define o caminho absoluto da pasta deste webapp no sistema de arquivos.

Ela vai ser usada para chamar os outros arquivos  e templates via PHP (usando o include_once), já que ela guarda o caminho físico da pasta.

E o BASEURL, na linha 21, define o caminho deste webapp no servidor web.

Esse valor deve ser igual ao nome da pasta que você criou no começo do projeto. Ela será usada para montar os links da aplicação, já que ela guarda a URL inicial.

Depois, nós vamos adicionar mais itens neste arquivo de configurações. Por enquanto, esses aí são suficientes para conectar com o banco.

Você pode criar outros itens próprios, também, se precisar.


Passo 3: Implemente o script de Conexão com o Banco de Dados

Vamos criar um arquivo que vai ter todas as funções de acesso ao banco de dados. Assim, podemos reaproveitar código nas outras partes do CRUD.

Crie um arquivo chamado database.php, na pasta inc do seu projeto, e coloque o código a seguir:

Este será um arquivo de funções do banco de dados. Tudo que for relativo ao BD estará nele.

Vamos entender esses códigos…

Primeiramente, na linha 3, configuramos o MySQL para avisar sobre erros graves, usando a função mysqli_report(). Depois, temos duas funções.

A primeira função – open_database() – abre a conexão com a base de dados, e retorna a conexão realizada, se der tudo certo. Se houver algum erro, a função dispara uma exceção, que pode ser exibida ao usuário.

Já a segunda função – close_database($conn) – fecha a conexão que for passada. Se houver qualquer erro, a função dispara uma exceção, também.

Observe as constantes sendo usadas (DB_HOST, DB_USER, DB_PASSWORD, DB_NAME). Dessa forma, caso você mude de servidor ou de BD, basta alterar o arquivo de configurações; sem precisar mexer no código principal.


Passo 4: Teste a Conexão

Agora sim, vamos ver se o banco de dados está conectado ao CRUD.

Crie um arquivo chamado index.php, na pasta principal, e coloque o código a seguir:

Para entender, rapidamente:

Primeiro, adicionamos o arquivo de configurações e o arquivo de funções do banco de dados (ou API de Banco de Dados), usando o require_once.

Depois, usamos a função para abrir a conexão. E, então, é feito um teste para saber se a conexão existe: if ($db) …

Vamos ver se funciona… Acesse o CRUD pelo navegador:

http://localhost/crud-bootstrap-php

Se aparecer a mensagem Banco de Dados Conectado!‘, sua conexão está OK.

crud-bootstrap-php-parte1

Senão, verifique se o MySQL está iniciado e verifique se as credenciais estão corretas (DB_HOST, DB_USER, DB_PASSWORD, DB_NAME). Qualquer item errado causa falha na conexão.

Até aqui, seu projeto deve estar assim:

  •  crud-bootstrap-php
    •  css
    •  fonts
    •  inc
      • database.php
    •  js
    • config.php
    • index.php

Próximos Passos…

No próximo tutorial, vamos implementar os arquivos de template do cabeçalho (header) e do rodapé (footer) para usar em todo o projeto.

Também vamos criar uma página inicial com os botões de acesso para as funcionalidades do CRUD.

Até a próxima!

31 comentários sobre “CRUD com Bootstrap, PHP & MySQL – Parte I

  1. bom esta aula eu quero ir até o final deve vai ser uma boa para meus conhecimentos vlw amigo

    1. Beleza, Marcos!
      Qualquer dúvida, é só comentar.

  2. Continue assim. Não desista, precisamos de mais pessoas como você para ensinar. Estou indicando o seu site para mais pessoas, em breve haverá mais acessos.

  3. Muito obrigado, essa série de tutoriais vai ser perfeita. Grande Abraço!

    1. Muito obrigado, Eduardo!
      Qualquer dúvida, é só comentar.

  4. Meus parabéns amigo, sou sempre grato a você. Continue, estou compartilhando suas aulas nas mídias sociais.

    1. Muito obrigado, Wilton!

  5. Muito bom seu tutorial,

    Mas eu estou com uma dificuldade fiz o exemplo do jeito que você passou só que meu navegador esta trazendo a pagina em branco…

    já testei o apache ta OK
    o mysql esta OK

    o que pode ser?

    1. Se está em branco, pode ser um erro na conexão.

      Tenta colocar um ELSE na página index.php

      if ($db) { echo ‘Banco de Dados Conectado!’; } else { echo ‘Não foi possível conectar.’; }

      Depois, revise o passo 2. Pode ter algum erro de credencial no config.php

      1. Revisei o código mas não encontrei o erro, se puder me ajudar eu agradeço olha o código…

        index.php

        ….

        1. Não consigo postar o código

          1. Cria um gist com o códgo (https://gist.github.com) e bota o link aqui.

  6. Se está em branco, pode ser um erro na conexão.

    Tenta colocar um ELSE na página index.php

    if ($db) { echo ‘Banco de Dados Conectado!’; } else { echo ‘Não foi possível conectar.’; }

    Depois, revise o passo 2. Pode ter algum erro de credencial no config.php

  7. Boa tarde professor desculpa mais uma vez não pude receber o livro mais me escrevi no canal

  8. Parabens Ruan pelo trabalho, mas estou com um pequeno problema.

    Está dando o seguinte erro.
    Warning: require_once(DBAPI): failed to open stream: No such file or directory in /var/www/html/controle/index.php on line 11

    Fatal error: require_once(): Failed opening required ‘DBAPI’ (include_path=’.:/usr/share/php:/usr/share/pear’) in /var/www/html/controle/index.php on line 11
    Obs: só não estou usando o mesmo nome da página, mas a estrutura delas está igual ao tutorial.

    Uso o Linux Mint Cinnamon 17.3
    Se puder me ajudar a resolvê-lo eu agradeço muito.

    1. Encontrei o erro…

      tinha colocado aspas simples em . esse era o erro.
      o correto é , como esta no tutorial.

      Falta de atenção minha. rsrs

  9. Eu não estou conseguindo :c

  10. opa nao entendi como entrar na tela para testar a conexão com servidor, ao clicar no botão desta pagina ele nao encontra nada e mesmo mudando para o mesmo nome da pasta do meu projeto ele nao encontra

    1. Você tem que estar com seu servidor local ativado.

      Dá uma revisada na introdução (http://webdevacademy.com.br/tutoriais/crud-bootstrap-php-mysql/) e nas ferramentas necessárias.

  11. Olá,

    Estou acompanhando seu tutorial fazendo uma pagina de cadastro de clientes como tu fez. Só coloquei o arquivo do database em outra pasta. Mas está dando o mesmo erro do Ari Rodrigues.
    Segue o erro:

    Warning: require_once(DBAPI): failed to open stream: No such file or directory in C:\xampp\htdocs\software\classes\teste.php on line 7

    Fatal error: require_once(): Failed opening required ‘DBAPI’ (include_path=’C:\xampp\php\PEAR’) in C:\xampp\htdocs\software\classes\teste.php on line 7

    Não sei onde está errado. Pois fiz e refiz a configuração inteira de acordo seu tutorial. Espero que possa me ajudar 🙁

  12. Como que eu faço para alterar o formato da data?
    valeeeu

  13. Poderia me explicar esse trecho do coder pf, do que se trata mais especificamente esse DBAPI?

    /** caminho do arquivo de banco de dados **/
    if ( !defined(‘DBAPI’) )
    define(‘DBAPI’, ABSPATH . ‘database.php’);

    1. Nesse trecho, o DBAPI é uma constante que está sendo criada.
      Ela vai guardar o caminho completo do arquivo database.php.

      Isso serve para que você não tenha que digitar o caminho sempre que for importar (include) o arquivo.

  14. No código existente junto ao passo ‘2’ está faltando o fechamento da tag do php.

    1. Em scripts que só contenham código PHP, não é necessário fechar a tag no final do arquivo.

  15. sou iniciante, eu to acompanhando os tutoriais, mas me perde quando chegou nessa parte, segue abaixo.
    ———————————————————————————————————————————————————–

    Objeto não encontrado!

    A URL requisitada não foi encontrada neste servidor. O link na página referida parece estar com algum erro ou desatualizado. Por favor informe o autor desta página sobre o erro.

    Se você acredita ter encontrado um problema no servidor, por favor entre em contato com o webmaster.

    Error 404

    localhost
    Apache/2.4.23 (Win32) OpenSSL/1.0.2h PHP/7.0.13

  16. Muito boa a aula

  17. Olá Ruan Carvalho,
    Estou com o mesmo erro que apareceu ao Afonso Silva e o Ari Rodrigues. Agradeço imensamente se você puder ajudar ajuda.

    Parabens pelo material, excelente qualidade.

    Warning: require_once(DBAPI): failed to open stream: No such file or directory in C:\xampp\htdocs\software\classes\teste.php on line 7

    Fatal error: require_once(): Failed opening required ‘DBAPI’ (include_path=’C:\xampp\php\PEAR’) in C:\xampp\htdocs\software\classes\teste.php on line 7

    1. Consegui corrigir meu erro, era uma chave a mais, agora deu certo.

      To na parte IV já, muito foda, show esse material.

      Obrigado mais uma vez.

  18. Onde fica a variavel dizendo o nome da tabela? Em database.php tem a variavel $table, mas eu não consigo achar onde esta o valor definindo ela. Modifiquei function index() {
    global $customers;
    $customers = find_all(‘cli_form’);
    }
    para a minha tabela e pegam os dados dela, mas ainda não consigo fazer modificações.

    1. O nome da tabela é passado como parâmetro na chamada da função:
      find_all( $table )

      No seu caso, você passou como tabela o ‘cli_form’. A função vai procurar essa tabela, se existir. Isso está na parte 3 dessa série.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *