Seu primeiro resultado com PHP

Neste capítulo você vai executar uma página PHP somente no próprio computador e mudar uma frase.

Seu ponto de partida

Comece aqui. Não é necessário saber programar. O exemplo deste capítulo é 01-primeiro-resultado, no pacote que acompanha o volume. Copie a pasta inicio para um diretório de prática e preserve o original. A raiz do exemplo é a referência concluída desta etapa. Sua cópia permite experimentar sem perder a referência.

Execute o PHP na raiz da sua cópia com php -S 127.0.0.1:8000 -t public. Abra http://127.0.0.1:8000/. Não abra PHP por duplo clique nem use o servidor de Python. Encerre com Ctrl+C antes de trocar de etapa.

Como praticar

Leia a explicação e digite ou confira o código indicado. Mude uma coisa. Antes de conferir, anote sua previsão. Salve, recarregue e compare. Se não acontecer o esperado, investigue o erro antes de avançar. Cada experiência parte dos valores da referência. Depois de conferir, desfaça somente a mudança desse experimento antes de começar a próxima lição. Você pode parar depois de uma lição e retomar mais tarde.

Confira o PHP e abra a pasta certa

PHP é um programa que lê instruções e produz uma resposta. Neste volume, essa resposta será uma página HTML. O navegador recebe o resultado, enquanto o PHP executa as instruções no seu computador.

Abra um terminal, a janela em que você digita comandos, e execute php -v. Se aparecer uma versão, o programa está disponível. Não é necessário instalar um banco de dados, Apache ou Docker para esta prática. Se o comando não existir, abra LEIA-PRIMEIRO.md no exemplo: há um percurso de instalação gratuito para Windows e links oficiais para outros sistemas.

Extraia os arquivos e copie inicio. Dentro da cópia existe public, a pasta com a página que o servidor pode entregar. Abra o terminal na raiz da cópia, onde você vê public. O comando usa -t public para escolher essa pasta. Mantenha o terminal aberto enquanto pratica.

Faça no seu exemplo

No terminal da raiz da sua cópia, confira a versão e inicie o servidor. Os comandos não entram no arquivo PHP.

php -v
php -S 127.0.0.1:8000 -t public

Mude uma coisa e preveja

Abra http://127.0.0.1:8000/. Antes de abrir, escreva se espera ver as instruções ou o resultado delas.

Anote o que você acha que vai acontecer antes de salvar e recarregar.

Recarregue e confira

Você deve ver Livro de visitas e uma frase de confirmação. O endereço começa com http: e aponta para seu computador. O terminal registra o pedido.

Se não acontecer

Se aparecer uma lista de arquivos ou um erro 404, confira a pasta do terminal e a existência de public/index.php. Se a porta estiver ocupada, encerre seu teste anterior ou use 8001 no comando e no navegador.

Mude uma frase dentro do PHP

Abra public/index.php num editor de texto simples. O arquivo já contém uma página completa. Dentro de um parágrafo você encontra uma pequena instrução PHP.

Você não precisa decorar toda a página para começar. Localize a frase indicada, mude somente seu conteúdo e confira o efeito. Os títulos e o estilo de apoio já estão fornecidos.

Faça no seu exemplo

Em public/index.php, localize o parágrafo com esta instrução.

<?php echo "O PHP está funcionando neste computador."; ?>

Mude uma coisa e preveja

Troque somente O PHP está funcionando neste computador. por Consegui mudar minha primeira frase. Preserve aspas e ponto e vírgula.

Anote o que você acha que vai acontecer antes de salvar e recarregar.

Recarregue e confira

Salve e recarregue a página HTTP. O parágrafo deve mostrar a frase nova; o título Livro de visitas deve continuar igual.

Se não acontecer

Se nada mudar, confira se editou a cópia usada no terminal. Se aparecer um erro de sintaxe, veja se faltaram aspas ou ponto e vírgula. Reponha a linha de referência e faça a mudança novamente.

Entenda por que dois cliques não executam PHP

Um arquivo no disco e uma resposta produzida por PHP são coisas diferentes. Abrir index.php por duplo clique pode mostrar o código, baixar o arquivo ou abrir outro programa. Isso não significa que o PHP executou as instruções.

O servidor de Python serve arquivos estáticos, mas não interpreta PHP. Para este volume use o comando php -S. O endereço 127.0.0.1 significa este computador. Ele não cria um site público.

Para encerrar, volte ao terminal e pressione Ctrl+C. Depois o endereço HTTP não terá mais a resposta desse teste. Você vai repetir esse procedimento ao trocar de capítulo, sempre encerrando a etapa anterior primeiro.

Faça no seu exemplo

Mantenha seu arquivo no editor. Confira a barra de endereço do navegador e depois encerre o teste com Ctrl+C.

Mude uma coisa e preveja

Encerre somente o servidor que você iniciou. Preveja se recarregar ainda vai executar o PHP.

Anote o que você acha que vai acontecer antes de salvar e recarregar.

Recarregue e confira

Depois de Ctrl+C, o navegador deve informar que não conseguiu conectar. Inicie o mesmo comando novamente e confirme que a página volta.

Se não acontecer

Se a página continuar disponível, pode haver outro servidor nessa porta. Confira o terminal e a porta usada. Não tente encerrar programas que não reconhece.

A captura mostra um trecho da referência concluída. Abra e percorra o exemplo para conferir o restante. Experimentos temporários podem produzir outra aparência; restaure os valores indicados antes de comparar.

Código completo da primeira página

<?php
declare(strict_types=1);
?>
<!doctype html>
<html lang="pt-BR">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Livro de visitas de prática</title>
<link rel="stylesheet" href="estilos.css">
</head>
<body>
<a class="pular" href="#conteudo">Pular para o conteúdo</a>
<header>
<p>Prática de PHP em pequenos passos</p>
<h1>Livro de visitas</h1>
<p>Conteúdo fictício. Somente neste computador.</p>
</header>
<main id="conteudo" tabindex="-1">
<p>
<?php echo "O PHP está funcionando neste computador."; ?>
</p>
</main>
<footer>
<p>Servidor de estudo em 127.0.0.1. Encerre com Ctrl+C.</p>
</footer>
</body>
</html>

Atividades para fazer antes das respostas

Use uma nova cópia do exemplo. Tente aplicar o que aprendeu antes de consultar os comentários.

1. Mude o texto mostrado pelo echo sem mudar o título.

2. Remova uma aspa, observe o erro e restaure a linha.

3. Explique a diferença entre public/index.php e http://127.0.0.1:8000/.

Respostas comentadas

Compare sua explicação e o que realmente aconteceu. Outra solução pode funcionar se cumprir o objetivo e preservar o acesso ao conteúdo.

1. Edite somente a frase entre aspas no echo. O conteúdo do h1 identifica o título e não foi alterado.

2. O trecho deixa de ser uma instrução válida. Compare com a referência e recoloque a aspa, salve e recarregue.

3. O primeiro é um arquivo no disco. O segundo é um endereço que pede ao servidor local o resultado da execução.

Quando seguir

Você consegue iniciar, mudar uma frase, recarregar e encerrar o servidor local. Se ainda precisa de ajuda, repita a experiência pequena antes de avançar.

Consulta opcional

Não é preciso ler os links externos para executar os arquivos fornecidos. Eles servem para consultar detalhes quando você quiser.

• Servidor embutido
• Echo

O arquivo completo

Referência do exemplo 01-primeiro-resultado, reproduzida aqui para que você possa conferir sem sair da página.

public/index.php

<?php
declare(strict_types=1);
?>
<!doctype html>
<html lang="pt-BR">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">
<title>Livro de visitas de prática</title><link rel="stylesheet" href="estilos.css"></head>
<body><a class="pular" href="#conteudo">Pular para o conteúdo</a>
<header><p>Prática de PHP em pequenos passos</p><h1>Livro de visitas</h1>
<p>Conteúdo fictício. Somente neste computador.</p></header>
<main id="conteudo" tabindex="-1">
<p><?php echo "O PHP está funcionando neste computador."; ?></p>
</main><footer><p>Servidor de estudo em 127.0.0.1. Encerre com Ctrl+C.</p></footer></body></html>

public/estilos.css

* { box-sizing: border-box; }
body { margin: 0; background: #f4f7fb; color: #203246;
  font: 1.05rem/1.65 Arial, sans-serif; }
header, main, footer { max-width: 48rem; margin-inline: auto; padding: 1.5rem; }
header { padding-top: 2.5rem; }
h1 { font-size: clamp(1.8rem, 5vw, 2.7rem); line-height: 1.2; }
main { background: #fff; border-radius: .8rem; }
article { border-top: 1px solid #cad4df; padding-block: 1rem; }
a { color: #124e77; text-underline-offset: .2em; }
nav { display: flex; flex-wrap: wrap; gap: 1rem; }
label { display: block; font-weight: bold; }
input:not([type=hidden]), textarea { width: 100%; max-width: 34rem;
  border: 2px solid #718095; border-radius: .35rem; padding: .7rem;
  font: inherit; color: inherit; background: #fff; }
button { font: inherit; background: #124e77; color: white;
  border: 0; border-radius: .35rem; padding: .75rem 1.2rem; cursor: pointer; }
button:hover { background: #103b59; }
.mensagem { white-space: pre-wrap; overflow-wrap: anywhere; }
.erros { color: #8b142c; }
.ok { color: #175c30; font-weight: bold; }
:focus-visible { outline: 3px solid #b04d00; outline-offset: 3px; }
.pular { position: absolute; left: -10000px; }
.pular:focus { position: static; display: block; padding: 1rem; background: white; }
@media (max-width: 35rem) { header,main,footer { padding: 1rem; } }