Baixe o app para aproveitar ainda mais
Prévia do material em texto
BEM VINDOS. PROGRAMAÇÃO WEB II (PHP/MYSQLI). Apresentação Professor: Maykson Mourão Magalhães Camelo; Formação: Graduado em Ciências da Computação e Pós-Graduado em Redes e Segurança de Sistemas, Pós-Graduação Lato Sensu em Docência para a Educação Profissional e Tecnológica (DocentEPT); Curso: Técnico Em Informática; Disciplina: PHP/MySQL; Duração: 60 Horas. EMENTA Desenvolver aplicações web para criação, leitura, atualização e exclusão de dados de um SGBD, utilizando as principais técnicas e padrões de programação. HABILIDADES E COMPETÊNCIAS Utilizar os principais componentes de formulários e funções com o PHP. Manipular arquivos de texto e envio de e-mails. Realizar integração entre o PHP e o SGBD MySQLi. Manipular dados através de comandos SQL em conjunto com o PHP. Trabalhar com sessões e desenvolver aplicações PHP para criação, leitura, atualização e exclusão de dados. Criação de Relatórios. CONTEÚDO PROGRAMÁTICO FASE I: FERRAMENTAS DO PHP UTILIZADAS NA CONSTRUÇÃO DE SISTEMAS; FASE I I: MANIPULAÇÃO DE DADOS e SESSÃO NO PHP. FASE I 1. Formulários: 1.1 Inputs; 1.2 Checkbox; 1.3 Radio; 1.4 Select; 1.5 Tabelas; 1.6 Listas. 2. Funções: 2.1 Date; 2.2 Require e include; 2.3 Autoload. FASE I 3. Manipulação de arquivos e diretórios: 3.1 Criar arquivos e diretórios; 3.2 Abrir e Fechar um Arquivo; 3.3 Ler a partir de um Arquivo; 3.4 Escrevendo dados em um Arquivo; 3.5 Upload e Download; 3.6 Criar arquivos PDF com PHP. 4. Rede de Comunicações: 4.1 Enviar E-mail Usando Script PHP. FASE II 5. Instruções DML – INSERT. 6. Instruções DML – SELECT: 6.1 FROM; 6.2 WHERE; 6.3 GROUP BY; 6.4 HAVING; 6.5 ORDER BY; 6.6 DISTINCT; 6.7 LIKE; 6.8 BETWEEN; 6.9 AND e OR; 6.10 Funções de agregação: COUNT, SUM, MAX, MIN e AVG. FASE II 7. Instruções DML – UPDATE. 8. Instruções DML – DELETE. 9. SESSAO. 10. Desenvolvendo com o padrão MVC em PHP. 11. Criação de um CRUD básico em PHP: 11.1 Inserção; 11.2 Alteração; 11.3 Exclusão; 11.4 Consulta. 12. Relatórios. FASE II DML: Data Manipulation Language, nos permite manipular o banco de dados. MVC: Model-View-Controller (em português: Arquitetura Modelo-Visão-Controle – MVC, modelo utilizado para otimizar a interface de usuário. OBS: Se poderem observar, o conteúdo é um pouco diferente do fornecido na apostila, com isso só iremos usa-la como material de apoio, nosso foco estará nos slides que irei fornecer a vocês. Introdução Essa disciplina será mais direta e focada na programação. De inicio um exemplo do que iremos ver. Introdução <!DOCTYPE html> <html> <body> <form action="script0.php" method="post"> Primeiro Nome:<br> <input type="text" name="primeironome" value="Maykson"> <br> Ultimo Nome:<br> <input type="text" name="ultimonome" value=""> <br><br> <input type="submit" value=“Enviar"> </form> <p>Click no Botão Submit</p> </body> </html> Introdução <form action=“Alturas.html" method=“post”> POST é usado para enviar dados a um servidor para criar / atualizar um recurso. <form action="script.php" method=“get”> GET é usado para solicitar dados de um recurso especificado. Introdução <html> <body> O Primeiro Nome é: <?php echo $_POST["primeironome"];?><br> O Ultimo Nome é: <?php echo $_POST["ultimonome"];?> </body> </html> OBS: Salvar com o nome: script0.php (Pois o mesmo será chamado no código anterior). Introdução Instalar e usar o XAMPP. Link Download: https://www.apachefriends.org/pt_br/index.html Tutorial: https://www.youtube.com/watch?v=L-0prC44hbY https://www.apachefriends.org/pt_br/index.html https://www.youtube.com/watch?v=L-0prC44hbY <form> Define um formulário que é usado para coletar a entrada do usuário. <form> “Elementos form” </form> <form> Um formulário HTML contém elementos de formulário . Os elementos de formulário são tipos diferentes de elementos de entrada, como campos de texto, caixas de seleção, botões de opção, botões de envio e muito mais. Elementos de formulário <input> O elemento de formulário mais importante é o <input> elemento. O <input> elemento pode ser exibido de várias maneiras, dependendo do type atributo. <input name="firstname" type="text"> Se o type atributo for omitido, o campo de entrada receberá o tipo padrão: "text". Elementos de formulário <input> <!DOCTYPE html> <html> <body> <h2>INPUT</h2> <form action=“??.php” method="post"> // O nome do php é definido pelo nome do programa que ele vai chamar. Digite seu endereço: <input type="text" name=“endereço”> <br> <input type=“submit”> </form> </body> </html> Elementos de formulário <input> Com isso temos o script do código anterior. <html> <body> O Endereço é: <?php echo $_POST[“endereço"];?><br> </body> </html> Salvemos como script1.php CORES <!DOCTYPE html> <html> <body> <form action="script0.php" method="post" style="background: #80ff00;"> Primeiro Nome:<br> <input type="text" name="primeironome" value="Maykson" style="background: #e63d48;"> <br> Ultimo Nome:<br> <input type="text" name="ultimonome" value="" style="color: pink;"> <br><br> <input type="submit" value="Submit"> </form> <p>Click no Botão Submit</p> </body> </html> Elementos de formulário <select> O <select> elemento define uma lista suspensa . <select name="carros"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> Elementos de formulário <select> <!DOCTYPE html> <html> <body> <h2>SELECT</h2> <p>Selecione o elemento:</p> <form action="script2.php" method="post"> <select name="carros"> <option value=“willian”>Volvo</option> <option value=“victor">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> <br><br> <input type="submit"> </form> </body> </html> Elementos de formulário <select> <html> <body> Carro Selecionado: <?php echo $_POST["carros"];?><br> </body> </html> Elementos de formulário <select> Elementos de formulário <select> Os <option> elementos definem uma opção que pode ser selecionada. Por padrão, o primeiro item da lista suspensa é selecionado. Para definir uma opção pré-selecionada, adicione o selected atributo à opção. Elementos de formulário <select> <select name="carros"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat" selected>Fiat</option> <option value="audi">Audi</option> </select> Elementos de formulário <select> Use o size atributo para especificar o número de valores visíveis: <select name="carros" size=“2"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> Elementos de formulário <select> Use o multiple atributo para permitir que o usuário selecione mais de um valor: <select name="carros" size="4" multiple> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> Elementos de formulário <textarea> O <textarea> elemento define um campo de entrada de várias linhas ( uma área de texto ). <textarea name=“texto" rows="10" cols="30"> Ó povo bonito! </textarea> O rows atributo especifica o número visível de linhas em uma área de texto. O cols atributo especifica a largura visível de uma área de texto. Elementos de formulário <textarea> Você também pode definir o tamanho da área de texto usando CSS: <textarea name=“texto" style="width:200px; height:600px;"> Outra forma. </textarea> Elementos de formulário <textarea> <!DOCTYPE html> <html> <body> <h2>Textarea</h2> <p>Digite um texto</p> <form action="script3.php" method="post"> <textarea name="texto" rows="10" cols="30"> Ó POVO BUNITO!</textarea> <br> <input type="submit"> </form> </body> </html> Elementos de formulário <textarea> <html> <body> O texto digitado foi: <?php echo $_POST["texto"];?><br> </body> </html> Elementos de formulário <textarea> Elementos de formulário <button> O <button> elemento define um botão clicável. <!DOCTYPE html> <html> <body> <h2>Elemento Botão</h2> <button type="button" onclick="alert(‘E ai informatica Segundo ano!’)”>Clique em mim!</button> </body> </html> Elementos de formulário <button> <!DOCTYPE html> <html> <body> <h2>Elemento Botão</h2> <button type="button" onclick="alert('Compre um doce!')"> Clique em mim!</button> </body> </html> Elementos de formulário <button> Elementos do formulário HTML5 O HTML5 adicionou os seguintes elementos de formulário: <datalist> <output> Elementos do formulário HTML5 O <datalist> elemento especifica uma lista de opções predefinidas para um <input> elemento. Os usuários verão uma lista suspensa das opções predefinidas conforme eles inserem dados. O listatributo do <input> elemento deve referir-se ao idatributo do <datalist>elemento. Elementos do formulário HTML5 <form action="script4.php" method="post"> <input list="browsers" name="browser"> <datalist id="browsers"> <option value="Internet Explorer (Lixo)"> <option value="Firefox"> <option value="Chrome"> <option value="Opera"> <option value="Safari"> </datalist> <input type="submit"> </form> Elementos do formulário HTML5 <!DOCTYPE html> <html> <body> <h2>Elemento datalist</h2> <form action="script4.php" method="post"> <input list="browsers" name="browser"> <datalist id="browsers"> <option value="Internet Explorer (Lixo)"> <option value="Firefox"> <option value="Chrome"> <option value="Opera"> <option value="Safari"> </datalist> <input type="submit"> </form> </body> </html> Elementos do formulário HTML5 <html> <body> O item selecionado foi: <?php echo $_POST["browser"];?><br> </body> </html> Elementos do formulário HTML5 O <output> elemento representa o resultado de um cálculo (como um executado por um script). parseInt : <!--analisa um argumento string e retorna um inteiro na base especificada--> Elementos do formulário HTML5 <form action="script5.php" method="post" oninput="x.value=parseInt(a.value)+parseInt(b.value)"> 0 <input type="range" id="a" name="a" value="50"> 100 + <input type="number" id="b" name="b" value="50"> = <output name="x" for="a b"></output> <br><br> <input type="submit"> </form> Elementos do formulário HTML5 <!DOCTYPE html> <html> <body> <h2>Elemento output</h2> <form action="script5.php" method="post" oninput="x.value=parseInt(a.value)+parseInt(b.value)"> 0 <input type="range" id="a" name="a" value="50"> 100 + <input type="number" id="b" name="b" value="70"> = <output name="x" for="a b"></output> <br><br> <input type="submit"> </form> </body> </html> Elementos do formulário HTML5 <html> <body> A: <?php echo $_POST["a"];?><br> B: <?php echo $_POST["b"];?><br> </body> </html> Input Types <input type="button"> <input type="checkbox"> <input type="color"> <input type="date"> <input type="datetime-local"> <input type="email"> <input type="file"> Input Types <input type="hidden"> <input type="image"> <input type="month"> <input type="number"> <input type="password"> <input type="radio"> <input type="range"> Input TypesXX <input type="reset"> <input type="search"> <input type="submit"> <input type="tel"> <input type="text"> <input type="time"> <input type="url"> <input type="week"> Input Types (text) <input type=“text”> define um campo de entrada de texto de uma linha : <form> Digite seu Email: <br> <input type=“text” name=“email”> Digite seu Numero:<br> <input type=“text” name=“celular”><br> <input type=“submit”> <form> Input Types (password) <input type=“password”> define um campo de senha : <form > Digite o Nick:<br> <input type="text" name=“nick"><br> Digite a senha:<br> <input type="password" name=“senha"> </form> Os caracteres em um campo de senha são mascarados. Input Types (password) <!DOCTYPE html> <html> <body> <h2>Password</h2> <form action="script10.php" method="post"> Digite o Nick:<br> <input type="text" name="nick"><br> Digite a senha:<br> <input type="password" name="senha"><br> <input type="submit"> </form> </body> </html> Input Types (password) <html> <body> Nick: <?php echo $_POST["nick"];?><br> Senha: <?php echo $_POST["senha"];?><br> </body> </html> Para os que se esqueceram salvar com o nome chamado no código anterior (script10.php). Input Types (submit) <input type="submit"> define um botão para enviar dados de formulário para um manipulador de formulários . O manipulador de formulários geralmente é uma página do servidor com um script para processar dados de entrada. Input Types (submit) O manipulador de formulários é especificado no action atributo do formulário : <input type=“submit” value=“Enviar”> Se você omitir o atributo de valor do botão de envio, o botão receberá um texto padrão. Input Types (reset) <input type="reset"> define um botão de redefinição que redefinirá todos os valores de formulário para seus valores padrão (OBS: Funciona com qualquer Input). <form> Nome Aluno:<br> <input type=“text” name=“nomealuno” value=“Em Branco”><br> Turma:<br> <input type=“text” name=“lastname” value=“Em Branco”><br> <input type=“submit” value=“Enviar”> <input type=“reset”> </form> Input Types (reset)XX <!DOCTYPE html> <html> <body> <h2>Reset</h2> <form action="script11.php" method="post"> Nome Aluno:<br> <input type="text" name="nomealuno" value="Digite Coisado"><br> Turma:<br> <input type="text" name="lastname" value="Digite a coisa"><br> <input type="submit" value="Enviar"> <input type="reset"> </form> </body> </html> Input Types (reset) <html> <body> O coiso: <?php echo $_POST["nomealuno"];?><br> A coisa: <?php echo $_POST["lastname"];?><br> </body> </html> Input Types (radio) <input type="radio"> define um botão de opção . Os botões de opção permitem que um usuário selecione APENAS UM de um número limitado de opções. Input Types (radio) <form action="script6.php" method="post"> <input type="radio" name="genero" value="homem" checked> HOMEM<br> <input type="radio" name="genero" value="mulher"> MULHER<br> <input type="radio" name="genero" value="???"> ???<br> <input type="submit"> </form> Input Types (radio) <!DOCTYPE html> <html> <body> <h2>Radio</h2> <form action="script6.php" method="post"> Selecione o Genero:<br> <input type="radio" name="genero" value="Homem"> HOMEM<br> <input type="radio" name="genero" value="Mulher" checked>MULHER<br> <input type="radio" name="genero" value="Não Binario">Não Binario<br> <input type="submit"> </form> </body> </html> Input Types (radio) <html> <body> O Genero escolhido foi: <?php echo $_POST["genero"];?><br> </body> </html> Input Types (radio) Input Types (checkbox) <input type="checkbox"> define uma caixa de seleção . As caixas de seleção permitem que um usuário selecione opções ZERO ou MORE de um número limitado de opções Input Types (checkbox) <form action="script7.php" method="post"> Pizza com ou sem cebola:<br> OBS: Selecione osdois para vir meio a meio.<br> <input type="checkbox" name="cebola[0]" value="Com cebola">Com cebola<br> <input type="checkbox" name="cebola[1]" value="Sem cebola">Sem cebola<br> <input type="submit"> </form> Input Types (checkbox) <!DOCTYPE html> <html> <body> <h2>Checkbox</h2> <form action="script7.php" method="post"> Pizza com ou sem cebola:<br> OBS: Selecione os dois para vir meio a meio.<br> <input type="checkbox" name="cebola[0]" value="Com cebola">Com cebola<br> <input type="checkbox" name="cebola[1]" value="Sem cebola">Sem cebola<br> <input type="submit"> </form> </body> </html> Input Types (checkbox) <html> <body> <?php // Verifica se algo foi selecionado if($_POST["cebola"]) { // Faz um loop no Array de checkbox foreach($_POST["cebola"] as $key => $value) { echo "Voce selecionou: ". $value."!<br>"; }}?> </body> </html> Input Types (checkbox) Input Types (button) <input type="button">define um botão : <!DOCTYPE html> <html> <body> <h2>Input Button</h2> <input type="button" onclick="alert(‘Ola INF2!')" value="Click Me!"> </body> </html> O HTML5 adicionou vários novos tipos de <input> color date datetime-local email month number range search tel time url Week OBS: Internet Explore 11 não suporta. O HTML5 <input> (color) O <input type="color"> é usado para campos de entrada que devem conter uma cor. Dependendo do suporte ao navegador, um seletor de cores pode aparecer no campo de entrada. O HTML5 <input> (color) <form action="script8.php" method="post"> Selecione uma cor: <input type="color" name="corfa" value="black"> <input type="submit"> </form> O HTML5 <input> (date) O <input type="date"> é usado para campos de entrada que devem conter uma data. Dependendo do suporte ao navegador, um selecionador de data pode aparecer no campo de entrada. O HTML5 <input> (date) <form action="script9.php" method="post"> Qual a data de hoje: <input type="date" name="datah"> <input type="submit"> </form> O HTML5 <input> (date) Você também pode usar os atributos mine max para adicionar restrições às datas. Entre 1991-02-19: <input type=“date” name=“datah” max="1991-02- 01"><br> Até 2020-01-01: <input type=“date” name=“datah” min="2020-01- 02"><br> O HTML5 <input> (datetime-local) O <input type="datetime-local"> especifica um campo de entrada de data e hora, sem fuso horário. Dependendo do suporte ao navegador, um selecionador de data pode aparecer no campo de entrada. <form action=“script10.php” method=“post”> Digite dia e hora: <input type=“datetime-local” name=“datat”> <input type=“submit” value=“Send”> </form> O HTML5 <input> (email) O <input type="email"> é usado para campos de entrada que devem conter um endereço de e-mail. Dependendo do suporte ao navegador, o endereço de e-mail pode ser validado automaticamente quando enviado. Alguns smartphones reconhecem o tipo de e-mail e adicionam ".com" ao teclado para corresponder à entrada de e-mail. O HTML5 <input> (email) <form action=“script11.php” method=“post”> Digite um E-mail: <input type=“email” name=“email”> <input type=“submit”> </form> O HTML5 <input> (file) O <input type="file"> define um campo de seleção de arquivos e um botão "Browse" para uploads de arquivos. <form action=“script12.php” method=“post”> Selecione o Arquivo: <input type=“file” name=“myFile”><br> <input type=“submit”> </form> O HTML5 <input> (month) O <input type="month"> permite ao usuário selecionar um mês e ano. Dependendo do suporte ao navegador, um selecionador de data pode aparecer no campo de entrada. <form action=“script13.php” method=“post”> Selecione um mês e ano: <input type=“month” name=“mesano”> <input type=“submit”> </form> O HTML5 <input> (number) O <input type="number"> define um campo de entrada numérico . Você também pode definir restrições sobre quais números são aceitos. <form action=“script13.php” method=“post”> Selecione um numero de 1 a 5: <input type=“number” name=“numero” min=“1” max=“5”> <input type=“submit”> </form> O HTML5 <input> () disabled: Especifica que um campo de entrada deve ser desativado; max : Especifica o valor máximo para um campo de entrada; maxlength: Especifica o número máximo de caracteres para um campo de entrada; min: Especifica o valor mínimo para um campo de entrada; pattern: Especifica uma expressão regular para verificar o valor de entrada em relação; Lista de algumas restrições comuns de entrada: readonly: Especifica que um campo de entrada é somente leitura (não pode ser alterado); required: Especifica que um campo de entrada é obrigatório (deve ser preenchido); size: Especifica a largura (em caracteres) de um campo de entrada; step: Especifica os intervalos numéricos legais para um campo de entrada; value: Especifica o valor padrão para um campo de entrada. O HTML5 <input> (range) O <input type="range">define um controle para inserir um número cujo valor exato não é importante (como um controle deslizante). Intervalo padrão é de 0 a 100. No entanto, você pode definir restrições sobre o que os números são aceitos com o min, max e step atributos. <form action=“script14.php” method=“post”> Selecione: <input type=“range” name=“sect” min=“0” max=“10”> <input type=“submit”> </form> O HTML5 <input> (search) O <input type="search"> é usado para campos de pesquisa (um campo de pesquisa se comporta como um campo de texto regular). <form action=“script15.php” method=“post”> Pesquisa no Google: <input type=“search” name=“PesquisaGoogle”> <input type=“submit”> </form> O HTML5 <input> (tel) O <input type="tel"> é usado para campos de entrada que devem conter um número de telefone. <form action=“script16.php” method=“post”> Telephone: <input type=“tel” name=“cell” pattern=“[0- 9]{3}-[0-9]{2}-[0-9]{3}” required> <input type=“submit”> <span>EX: 123-45-678</span> </form> O HTML5 <input> (time) O <input type="time"> permite ao usuário selecionar um horário (sem fuso horário). Dependendo do suporte ao navegador, um seletor de tempo pode aparecer no campo de entrada. <form action=“script17.php” method=“post”> Selecione a hora: <input type=“time” name=“hora”> <input type=“submit”> </form> O HTML5 <input> (url) O <input type="url"> é usado para campos de entrada que devem conter um endereço de URL. Dependendo do suporte ao navegador, o campo url pode ser validado automaticamente quando enviado. Alguns smartphones reconhecem o tipo de URL e adicionam ".com" ao teclado para corresponder à entrada do URL. O HTML5 <input> (url) <form action=“script18.php” method=“post”> Digite o Link: <input type=“url” name=“homepage”> <input type=“submit”> </form> O HTML5 <input> (week) O <input type="week"> permite ao usuário selecionar uma semana e ano. Dependendo do suporte ao navegador, um selecionador de data pode aparecer no campo de entrada <form action=“script19.php” method=“post”> Selecione: <input type=“week” name=“semanano”> <input type=“submit”> </form>. Unset PHP - Apagando Variável O comando unset apaga uma variável especifica, limpando assim a informação da memória do servidor. Este comando é muito utilizado quando a variável não será mais usada no sistema, então apagamos a mesma para liberar espaço de memória, O QUE É MUITO IMPORTANTE. Unset PHP - Apagando Variável Este comando também apaga todos os tipos de variáveis, nas quais podemos destacar: GET; POST; Cookie; Session; Array; Entre outros. Unset PHP - Apagando Variável Seu uso e bem simples, veja o exemplo: <?php $variavel = "Tenho Valor<br>"; echo "Neste momento a variavel esta com um Valor:<br>"; echo $variavel; echo "O unset esta apagando a Valor:<br>"; unset($variavel); echo "Resultado depois do valor se apagado:<br>"; echo $variavel; echo "Como a variavel esta vazia ocorre um erro." ?> Exercícios PAG 18. FIM! FIM DA PRIMEIRA PARTE !
Compartilhar