Escolar Documentos
Profissional Documentos
Cultura Documentos
Phpemysql Aplicacaocompletaapartirdozero 130305111414 Phpapp02 PDF
Phpemysql Aplicacaocompletaapartirdozero 130305111414 Phpapp02 PDF
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 2
Sejam Bem-vindos ao curso PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO. Meu nome é Frederico
Ramos, sou webdesign e programador Freelancer. Neste curso, tentarei ensinar, de maneira totalmente prática, como
você pode construir sua própria aplicação PHP começando a partir do nada.
4. Criando o CRUD:
4.0. Criando a página de autenticação do usuário................................................................................ 92
4.1. Página area administrativa..................................................................................................... 97
4.2. Páginação de resultados........................................................................................................ 103
4.3. Campo de Pesquisa............................................................................................................... 109
4.4. CRUD: Inserir......................................................................................................................... 115
4.5. CRUD: Editar.......................................................................................................................... 121
4.6. CRUD: Excluir......................................................................................................................... 124
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 3
PREFÁCIO
Muitas são as dúvidas de quem se propõe a iniciar no mundo da programação web. Uma das grandes dificuldades é
entender, com exemplos ilustrativos, o que as linhas de código farão na aplicação web. Por este motivo, este livro
destina-se a todas as pessoas que desejam publicar uma aplicação própria na internet.
Com exemplos interativos, de fácil compreensão e totalmente práticos, PHP E MYSQL – APLICAÇÃO COMPLETA A
PARTIR DO ZERO! Vem mostrar até você, de maneira descomplicada, como construir seu próprio aplicativo php. São
mais de 300 imagens para você se guiar e saber exatamente o que está fazendo.
Caso apareçam dúvidas, é possível contactar o autor pelo seu blog, que terá o maior prazer em responder todas as
dúvidas dos leitores. Bons estudos!
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 4
Com a pen tool, crie uma forma que você desejar para o cabecalho:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 5
Preencha a forma com a cor que voce quiser, clicando onde indica a seta azul:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 6
Note que apareceu duas abas, para você escolher as cores em que o gradiente variará:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 7
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 8
Selecione a figura, clicando nela, copie (control + c) e cole(control + v). Apertando a seta direcional para a direita, ou
clicando e segurando, arraste-a para a outra extremidade:
Com APENAS a segunda figura selecionada, vá no menu modificar, transformar, e clique em virar horizontalmente:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 9
Com a ferramenta retangulo selecionada, desenhe um retangulo com as dimensoes 980px por 75px:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 10
Selecione a ferramenta ponteiro e digite contrl + shift + seta para baixo. O retangulo ficará abaixo das duas figuras
desenhadas:
Agora vamos inserir sua logomarca. Selecione a ferramenta retangulo com cantos arredondados, e desenhe um
retangulo com as dimensoes 400px por 180px:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 11
Na figura acima, usei a fonte “Stencil Std”, com tamanho 140, e em negrito “bold”.
Para o texto “Desenvolviemento Desktop e Web”, utilize a ferramenta texto novamente, mas com tamanho 18:
Selecione a ferramenta “retangulo com cantos arredondados”, e desenhe um retangulo, conforme figura abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 12
Clique em gradiente, deixe as cores do branco para o branco, e selecione opacidade em 30:
Vamos inserir mais duas imagens para finalizar nosso cabecalho. Vá em menu arquivo, importar, e selecione a imagem:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 13
Caso a imagem que você importou fique muito grande, aperte a tecla shift; com ela pressionada, clique em um dos
cantos da imagem e arraste-a para redimensionar. Note que o ponteiro do mouse fica branco:
OBSERVAÇÃO: A imagem a ser importada deve ter o formato “png”. Se for de outro formato, aparecerá um espaço
branco em volta da imagem, que prejudicará nosso desenho. Veja um exemplo com uma imagem de formato jpeg:
Formato que não seja “png” deixa espaço branco no desenho. Não use formato que não seja png!!!
Caso você deseje, voce pode adicionar texto ou imagens na barra superior do cabecalho. Se for adicionar texto, use a
ferramenta “Texto”, conforme explicado anteriormente. Se for usar imagem, vá em menu, arquivo, importar imagem,
conforme explicado anteriormente:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 14
Agora que o cabecalho de nossa aplicação está pronto, vamos fazer o último ajuste antes de fatiá-lo. Selecione a
primeira imagem que você desenhou. Aperte e deixe apertado “shift”, e selecione a segunda imagem(a que foi invertida
horizontamente) e selecione o retangulo entre elas. Com todas as 3 selecionadas, clique com o botão direito em uma
delas, e selecione “agrupar”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 15
Com todas as 3 imagens selecionadas, aperte seta para cima e vá ajustando-a ao topo da tela até não sobrar nenhum
pixel:
Agora, faremos um corte para finalizar o cabeçalho. Note que está sobrando um espaço no canto direito e inferior da
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 16
Fazendo o rodapé
Desabilite as imagens que não fazem parte do cabecalho, clicando no olho, conforme figura abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 17
Clicando no olho, a
figura deixa de ficar
visível. Se clicar aqui de
novo, ela aparecerá.
Com as 3 figuras selecionadas(elas devem estar agrupadas. Se não estiverem, selecione-as com a tecla shift
apertada, depois clique com o botao direito, e clique em agrupar), vá em menu, transformar, virar verticalmente:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 18
Antes de iniciarmos, devemos decidir qual será a dimensão de nossa aplicação. Digamos que você escolha que ela será
de 1070px de largura (tem que ser a mesma largura do cabecalho)por 800 de altura. Então, vá no fireworks, menu
arquivo, novo:
NOTE QUE O FUNDO AGORA É BRANCO:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 19
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 20
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 21
Criando o menu
Com a ferramenta retangulo , crie um retangulo conforme a figura abaixo, com a cor
branca:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 22
Clique em gradiente, selecione as cores branco para o branco, e opacidade valor 30:
Deixe o valor 30
Selecione a cor branca.
Selecione a cor branca.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 23
Terminamos a parte de confecção gráfica de nosso layout. Agora fatiaremos nosso layout para exportá-lo para o
dreamweaver.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 24
Posicione o cursor do mouse na regua superior, clique e arraste até a divisa do cabecalho com o menu:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 25
Clique no canto superior esquerdo e arraste até o comprimento de 360px. Note que quebramos a imagem bem no
meio. Este procedimento visa dificultar a cópia ilegal de seu conteúdo e faz com que sua aplicação rode mais rápido nos
browsers. Selecione JPEG – qualidade melhor, depois clique em exportar...(veja as setas azuis):
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 26
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 27
Na janela que aparecerá, escolha “somente imagens”, e nomeie como cabecalho1, ou parte1, como voce preferir:
APENAS
IMAGENS!!!
Repita o procedimento com todo o restante do cabeçalho. Divida-o em 4 ou 5 partes. Após criar outra fatia, selecione a
anterior e delete-a.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 28
Fatiando o menu
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 29
Fatiando o rodapé
Fatie o rodapé como parte única e exporte como imagem no formato png:
Terminamos de fatiar nossa aplicação. Agora, vamos criar nossa aplicação no dreamweaver.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 30
O Xampp é uma espécie de “pacotão”, onde você instala tudo isso de uma vez. Para baixá-lo, vá no google e digite
“download xampp”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 31
Aparecerá uma tela perguntando se deseja salvar o arquivo(no meu caso, estou usando o navegador firefox); clique em
save File(salvar arquivo):
Aparecerá uma tela perguntando se você deseja executar o xampp. Clique em “Executar”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 32
Selecione o local a ser instalado; no meu caso, escolhi “C:\”. NÃO pode haver espaços. Depois, clique em “install”.
A instalação iniciar-se-á:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 33
O xampp te perguntará se você deseja adicionar um atalho no desktop. É mais prático que você adicione. Logo, digite
“y” e aperte enter.
Pronto! Agora vamos conhecer as ferramentas que usaremos para nosso banco de dados.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 34
Para criarmos o banco de dados, precisamos iniciar o mysql através do xampp. Vá na área de trabalho e dê um duplo
click no ícone do xampp. Ele abrirá o painel de controle. Clique no botão “start” do Apache e do Mysql. Após você
clicar, eles mudarão o nome de “start” para “stop”.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 35
Vá no seu navegador de internet(firefox, chrome, ou internet explorer) e na barra de endereços, digite “localhost”:
Você deverá visualizar esta tela:
Para criarmos o banco de dados, vá na barra lateral esquerda, na seção “tools”, e clique em “phpmyadmin”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 36
Abrir-se-á a tela do PHPMyadmin. Aqui nós criaremos e gerenciaremos nosso banco de dados.
Na coluna lateral esquerda você visualiza os bancos de dados que você criou. No meu caso, tenho alguns de sites de
meu portfólio, bem como alguns que uso apenas para testes.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 37
Para criar um banco de dados, clique em “banco de dados”, conforme apontado pela seta azul:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 38
Agora, temos que definir como será nossa aplicação. Para fins didáticos, construiremos um sistema que cadastrará
usuários, permitirá edição e exclusão deles.
Clique no banco de dados que você criou, na barra lateral esquerda do phpmyadmin:
Na tela que apareceu, em nome de tabela, digite “usuarios” e em numero de colunas, digite “7”; clique em “executar”,
no canto direito:
Ampliando a figura:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 39
PRIMARY significa que este campo receberá uma numeração única; ele será uma chave primária.
A_I significa que o campo id é do tipo auto- increment, ou seja, a cada registro novo que for inserido no banco de dados,
o número de id aumentará automaticamente.
Clique em salvar para criar a tabela usuarios. Sua tabela deverá aparecer na barra lateral esquerda:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 40
Para finalizar o xampp, selecione o ícone do xampp na barra de tarefas; clique com o botão direito do mouse; clique em
“quit”:
Nosso banco de dados está criado. Estamos prontos para iniciarmos nossa aplicação PHP feita totalmente no braço!
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 41
Antes de abrir o dreamweaver, precisamos criar a pasta de nosso projeto no xampp. Acesse a pasta “htdocs” dentro do
xampp pelo windows explorer. Crie a pasta de nosso projeto. Eu chamei a minha pasta de “aplicacaophpmysql”:
C:\xampp\htdocs
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 42
Abra o dreamweaver, e crie um novo site no menu site, new site e siga as configurações :
- nome do site(site name), local padrão do folder ( local root folder), folder padrão das imagens(Default images folder),
http endereço(http adress); não clique em OK, ao terminar.
Abra seu dreamweaver, clique em menu arquivo, novo, selecione php e clique em criar:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 43
NAO CLIQUE EM OK
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 44
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 45
Na aba “files” do dreamweaver, se estiver desplugado, clique no botão “conectar ao servidor remoto”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 46
Vamos criar nosso primeiro arquivo PHP. No dreamweaver, vá no menu arquivo, novo, selecione “php”, e clique em
“criar”(create):
Já vamos logo conectar a aplicação com nosso banco de dados. No dreamweaver, na aba “databases”(banco de dados),
clique no sinal de “+”, e em “Mysql Connection”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 47
Clique agora em “Test”, para testarmos a conexao. Deverá aparecer a mensagem de conexão bem sucedida
abaixo(“Conexaõ efetuada com sucesso”):
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 48
Se não apareceu esta mensagem, provavelmente o erro é no campo user ou password. Somente isso pode dar errado
aqui...
Nossa aplicação já está conectada ao banco de dados.
Cabeçalho
Conteúdo
rodapé
O cabeçalho e o rodapé serão os mesmos para toda nossa aplicação. Para criarmos o cabeçalho da aplicação, abra o
dreamweaver; vá em menu novo(ou new, se seu dreamweaver estiver em inglês)...
Vamos inserir no cabeçalho as imagens que criamos no fireworks. Localize a pasta onde você as salvou, copie-as e cole-
as dentro da pasta do projeto do xampp. Complicou? Vamos passo a passo, então:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 49
Passo 1) Copie as imagens que você fatiou e exportou pelo fireworks. No meu caso, salvei-as em
D:\Fred\Programacao\ebook php mysql:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 50
Passo 2) Cole as imagens copiadas acima na pasta de imagens do seu projeto, DENTRO DO XAMPP, NA PASTA:
“ xampp/htdocs/aplicacaophpmysql/imagens”
MUITA ATENÇÃO AQUI! Se você não selecionar a pasta certa, não vai funcionar!!!
LEMBRE-SE: Toda vez que você for construir uma aplicação, a pasta do seu projeto SEMPRE deverá estar na pasta htdocs
do xampp.
- A pasta desse nosso projeto chama-se “aplicacaophpmysql”; então, a ordem das pastas dentro do xampp será:
C:\xampp\htdocs\aplicacaophpmysql (supondo que você instalou o xampp em “C:”).
Volte ao dreamweaver. Vamos chamar em nosso arquivo php as imagens que acabamos de copiar. Eis o código:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 51
Clique em menu arquivo, salvar como, e salve na pasta de seu projeto(C:\xampp\htdocs\aplicacaophpmysql) com o
nome “header.php”:
Vamos visualizar nossa aplicação? Vá no seu navegador de internet(firefox, chrome ou internet explorer), e digite:
“localhost/aplicacaophpmysql/header.php” (sem as aspas).
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 52
Nossa aplicação está centralizada à esquerda. Corrigiremos este detalhe com a aplicação de css.
Antes de aplicarmos o estilo em nossa aplicação, vamos encapsular o cabecalho dentro de uma div, para facilitar a
estilização. Criaremos uma div chamada “header”, que conterá todo o cabeçalho. Esta div ficará dentro da div “box”,
que englobará todo o conteúdo de nossa aplicação.
Vamos para o visual que a compreensão ficará mais fácil. No dreamweaver, ainda no arquivo header.php, crie as divs
header e box:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 53
Ampliando:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 54
O asterisco abaixo reseta todo o estilo. Em margin, o 0 (zero) significa margem zero em cima, e o “auto” significa que a
margem horizontal é automática. Quando você definir o valor de 1070px para a div “box”...
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 55
Se você não conseguir visualizar a mudança, experimente clicar no botão “atualizar” do seu navegador de internet, ou
apertando a tecla “F5”:
Vamos inserir uma borda na div box para podermos visualizar seus limites. Insira no arquivo estilo.css a linha em
destaque abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 56
Figura 125. Toda vez que você fizer alguma alteração nos arquivos, salve-o apertando “control + s”. Se você esquecer de
salvar, você não visualizará as mudanças no navegador.
No arquivo “estilo.css”, adicione comprimento da div menu e uma cor de fundo(apenas para visulizarmos onde ela
está):
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 57
Figura 127. O “aaa” na div menu serve apenas para deixá-la visível.
Coloque na pasta de imagens do seu projeto a imagem do menu que criamos no fireworks:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 58
Vá no dreamweaver, na folha de estilos, e chame essa imagem que você acabou de copiar como background da div
menu:
Figura 130. A altura da div menu (height) deve ser a mesma da imagem(que é de 62px).
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 59
Vamos criar a div que abrigará todo o conteúdo de nossa aplicação. Vá no dreamweaver, no arquivo header.php e crie a
div conteúdo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 60
Copie a imagem do rodapé que criamos no dreamweaver e cole na pasta imagens de nosso projeto:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 61
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 62
Antes de iniciarmos a criação das páginas de nossa aplicação, vamos melhorar o visual da aplicação e construir nos links
do menu.
No dreamweaver, vá no arquivo estilo.css e retire a borda da div box, retirando a linha de código selecionada abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 63
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 64
Eu criei apenas 4 itens. Mas você pode criar quantos você quiser, por exemplo: produtos, depoimentos, categorias, etc.
você apenas terá que diminuir o tamanho da <li> no código css:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 65
Antes de criar esta página, precisamos ter em mente o que devemos exibir para nossos visitantes. Para fins didáticos,
escolhi exibir os seguintes itens:
Foto1:
No dreamweaver, no arquvivo header.php, insira o código destacado abaixo, dentro da div conteudo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 66
Foto 2:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 67
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 68
Foto 3:
No dreamweaver, insira o código que mostrará a foto3, bem como o respectivo texto:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 69
Editando o rodapé
No dreamweaver, vá na div rodapé e acrescente o código que mostra copyright, telefone e endereço:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 70
Resultado no navegador:
Terminamos a página principal da aplicação. Note que, até agora, nosso conteúdo é totalmente estático. Passemos
agora para a parte de dinamização do conteúdo.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 71
No dreamweaver, no arquivo header.php, selecione e RECORTE tudo desde o começo do código até logo depois da
abertura da div conteudo:
- Abra um novo documento em menu arquivo novo, selecione php , clique em criar e cole o código nele:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 72
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 73
- Vá no final da página header. php e coloque o código que incluirá nosso rodapé:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 74
Agora o cabecalho e rodapé de nossa aplicação aparecerão da mesma forma em todas as páginas.
DICA: você sabe que sua aplicação aparecerá com a mesma resolução em todas as telas se ao apertar, por repetidas
vezes:
1)control + -(tecla contrl mais sinal de menos), e o layout permanecer intacto:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 75
Ou,
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 76
No dreamweaver, crie novo documento em menu arquivo ,novo , escolha php e clique em criar. Coloque nele somente
o código abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 77
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 78
Vá na pasta raiz de nosso projeito( dentro do xampp) e crie uma pasta chamada “nav”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 79
No dreamweaver, vá no arquivo header.php e exclua a linha da funcao include que chama o cabecalho:
Exclua também a linha do include que chama o rodapé, ainda no arquivo header.php:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 80
Nossa página header.php ficou sem cabecalho e sem rodapé. Se você salvá-la e tentar visualizá-la no navegador,
ela aparecerá toda desconfigurada, assim:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 81
Feche a página header.php. Na pasta de nosso projeto, delete SEM MEDO NEM PRECONCEITO (rsrs) o arquivo
header.php :
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 82
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 83
No dreamweaver, crie novo arquivo do tipo php. Insira o conteúdo que você quiser para formar esta página. No meu
caso aqui, inserirei uma imagem e uma pequena descrição da nossa aplicação.
Após encontrar a imagem que você irá exibir na página, copie-a para a pasta imagens de nosso projeto. Eu colei a
imagem “logo”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 84
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 85
NOTE QUE O CÓDIGO PARA VISUALIZARMOS AS PÁGINAS MUDOU, POIS AGORA ELAS ESTÃO DINÂMICAS!
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 86
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 87
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 88
Note que no campo “action” do formulário, o direcionamento é para a página “enviar_email.php”. Entretanto, nós não
criamos esta página ainda. Vamos criá-la agora.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 89
Até aqui, sua pasta nav deve estar com os seguintes arquivos:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 90
No dreamweaver, crie novo arquivo php(menu arquivo, novo, selecione php e clique em criar) e insira o código abaixo:
Finalizamos a primeira parte de nossa aplicação. Agora só falta fazermos as partes que incluirão e editarão nosso banco
de dados. Viram como foi fácil?
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 91
Vá no arquivo estilo.css e insira a propriedade que não deixará o link ficar sublinhado:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 92
Vamos inserir um efeito para quando o usuário passar o mouse sobre o item de menu. Vá no arquivo estilo.css e insira o
código destacado em azul:
Veja o resultado no navegador, quando o usuário passar o mouse em cima do item de menu:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 93
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 94
Agora vamos criar a tabela de usuarios em nosso banco de dados. Vá em seu navegador de internet e digite
“localhost/phpmyadmin” para entrar no phpmyadmin:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 95
- id, do tipo INT. Em índíce, selecione PRYMARY. Em A_I, marque a caixa de seleção;
- login, do tipo TEXT;
- senha, do tipo TEXT;
- email, do tipo TEXT.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 96
Vamos inserir um usuario para testarmos nossa aplicação php. Ainda no phpmyadmin, Selecione a tabela usuarios e
clique em “inserir”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 97
Vamos ver se está tudo certo. Volte no navegador, e vá na página administração; tente logar com:
Login: admin
Senha: 123
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 98
...significa que está tudo CERTO!!! Este erro aconteceu porque no campo “action” de nosso formulário da pagina
“adm.php”, nós chamamos a página “area_admtiva.php”. Acontece que ela ainda não foi criada. Por isso deu erro.
Vamos criá-la então!
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 99
Vamos criar a página CRUD de usuários. Vá no dreamweaver, e crie novo arquivo php e insira o código abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 100
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 101
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 102
Vá no seu navegador e tente logar-se na página administração. Após o login, você deverá visualizar:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 103
Se você visualizou o erro acima, está tudo CERTO! Este erro aconteceu porque estamos chamando um script que ainda
não existe. Veja:
Quer dizer: “Olha, eu não consegui abrir o arquivo paginacao_noticias_lista.php na pasta scripts. Parece que este
arquivo não está lá.”
Note também que a foto do usuário não apareceu. Isto aconteceu porque ainda não cadastramos nenhum usuário com
foto em nosso banco de dados. Não se preocupe. Faremos isso futuramente.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 104
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 105
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 106
Essa cor ficou horrível! Era para aparecer um número um entre as palavras anterior e próximo. Vamos mudar essa cor
no css.
Vá na página “paginacao_usuarios.php”, na pasta scripts e localize o código css de cor destacado em azul abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 107
Vamos estilizar o elemento “h1” de nossa página “area_admtiva.php”. No dreamweaver, vá no arquivo “estilo.css” e
estilize o h1 inserindo o código css abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 108
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 109
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 110
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 111
Abra a página busca_usuarios.php e insira o código destacado abaixo, logo após o código da paginação:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 112
Para finalizar a estilização, vamos aplicar uma borda para separarmos as funções inserir, buscar e exibir os dados.
Note que, na pagina “lista_usuarios.php”, no código da tabela “inserir usuario” há uma classe para a tabela. Veja:
Vamos estilizar essa classe no código css. Vá no arquivo estilo.css e estilize a classe acima:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 113
Fiz uma pequena alteração no html do campo de busca. Vejam como ficou o código na pagina lista_usuarios.php:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 114
No arquivo lista_usuarios.php, aplique novamente a classe “lista_anuncios” nas tabelas abaixo, apontadas pelas setas:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 115
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 116
No dreamweaver, crie uma nova pagina em branco do tipo php e insira o código abaixo:
Repare que a primeira linha do código faz uma chamada para o arquivo “upload_redimensiona1foto.php”.
Mas nós ainda não temos esse arquivo. Se tentarmos rodar nossa aplicação, acontecerá o erro de arquivo não
encontrado. Vamos criar este arquivo.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 117
No dreamweaver, crie nova pagina em branco, do tipo php, e insira o código abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 118
Repare que na linha 48 do arquivo “upload_redimensiona1foto.php” estamos dizendo para o PHP que é para ele salvar
a imagem do usuário na pasta “imagens/usuarios/”:
Mas, na pasta de nosso projeto, ainda não existe a pasta usuarios. Crie-a:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 119
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 120
Vamos testar se nossa aplicação está cadastrando usuários. No navegador, digite nossa página de listar usuários:
http://localhost/aplicacaophpmysql/index.php?topicos=nav/lista_usuarios
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 121
Note que o PHP salvou a imagem que cadastramos na pasta “imagens/usuarios” de nosso projeto:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 122
Salve na pasta “nav” como “altera_usuarios_codigo.php”. Vamos ver o resultado de nosso sistema:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 123
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 124
Edite os dados e mude a foto se desejar. Ou cancele e volte para a pagina que lista os usuários. Vamos agora fazer a
parte de exclusão.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 125
Crie uma nova pagina em branco do tipo php e insira o código abaixo:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 126
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 127
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 128
Aparecerá uma tela perguntando se você deseja abrir ou salvar o arquivo. Escolha “salvar” e clique em ok:
Escolha a pasta que você deseja salvar o arquivo de banco de dados e clique em “salvar”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 129
Existem várias opções de hospedagem. Eu uso o 000webhost para exibir meu portfólio. Acessem:
http://www.000webhost.com/
Crie uma conta e logue-se. Ao se logar, você será direcionado para esta tela. Para criar um domínio, clique em
“create new”:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 130
Escolha a opção domínio free; insira um nome para seu dominio; insira uma senha; clique em setup new
account:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 131
Guarde bem as informações abaixo. Precisaremos delas para publicar nossa aplicação:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 132
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 133
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 134
Repita a senha
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 135
Seu banco de dados foi criado. Guarde muito bem esses dados pois usaremos eles para publicar nossa aplicação.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 136
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 137
Bem vindo(a) ao Filezilla. Este programa torna possível a publicação de aplicações web. Do lado esquerdo, visualizamos
os arquivos em nosso computador. Do lado direito, visualizamos os arquivos no servidor. Vamos conectar o filezilla ao
nosso servidor?
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 138
Lembram-se de que eu falei para guardarem as informações de registro no servidor? Usaremos elas agora:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 139
Insiram no filezilla: (server32.000webhost.com no campo host), (a5806781 no campo nome de usuario), (e a senha que
voce criou no campo senha) e cliquem em “conexao rapida”. NÃO PRECISA INSERIR NADA NO CAMPO PORTA:
Parabéns!!! Você está conectado ao seu servidor. Do lado esquerdo, selecione a pasta de nosso projeto. Do lado direito,
selecione a pasta “public_html ” (próxima página, pois a imagem ficou grande para caber aqui):
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 140
Para publicar sua aplicação, simplesmente clique, segure e arraste TODAS AS PASTAS E ARQUIVOS da pasta de nosso
projeto para a pasta “public_html”.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 141
Quando o filezilla terminar de publicar os arquivos, sua tela deverá estar parecida com esta:
Parabéns! Você publicou sua aplicação em PHP e MYSQL! Vamos visualizá-la no navegador? Acesse sua aplicação. No
meu caso, é www.meudominio.host56.com
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 142
Ooooooooops! Algo deu errado. Se você visualizar os mesmos erros que eu ao acessar sua aplicação, não se preocupe.
Isso é normal. Nós publicamos no servidor as configurações de conexão locais do banco de dados. Por isso aconteceu
este erro:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 143
No dreamweaver, abra o arquivo config, que está dentro da pasta connections e substitua os dados locais pelos
informados pelo servidor. Em meu caso, ficou assim:
No filezilla, selecione, clique, SEGURE O CLICK e arraste o arquivo “config.php” para dentro da pasta connections no
servidor remoto:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 144
O filezilla vai perguntar se você quer substituir o arquivo config.php. Diga que sim:
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 146
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 147
Lembra-se de quando exportamos nosso banco de dados no phpmyadmin local? Verifique onde voce salvou aquele
arquivo em formato “sql”. Importaremos ele agora.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 148
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 149
Deste modo, concluímos nossa aplicação. Espero que vocês tenham gostado do conteúdo, e que façam bom proveito
deste livro. Claro que existem várias maneiras de se construir aplicações PHP. Entretanto, meu objetivo aqui foi mostrar,
de maneira extremamente prática, como iniciar uma aplicação PHP E MYSQL a partir do zero.
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368
PHP E MYSQL – APLICAÇÃO COMPLETA A PARTIR DO ZERO! 150
www.desktopeweb.blogspot.com.br
Copyright 2013 ©, Todos os direitos Reservados.
Produced By Frederico Ramos. Tel: (62) 9388 – 8475 / 9641 - 2368