Este Artigo fala sobre o passado, presente e futuro do desenvolvimento da Web. A partir do, HTML, orientaremos você por todas as tecnologias que você precisa conhecer, a fim de praticar o desenvolvimento web. Antes de fazer isso, queremos montar o cenário, para que todos saibamos de qual Web estamos falando: essa seria a World Wide Web ( www ).
Rede mundial de computadores
Eu amo história! Então vamos começar com um pouco de história sobre a World Wide Web.
A Internet é uma rede global que hoje interconecta bilhões de computadores em todo o mundo. Sua origem remonta as pesquisas feitas pelo governo dos EUA, mas hoje todos podem acessar a Internet usando seu conjunto de protocolos padrão, comumente chamado de TCP / IP (o IP aqui é o Protocolo da Internet).
Todo computador ou dispositivo conectado à Internet terá um endereço exclusivo na Internet, também conhecido como endereço IP. É um conjunto de 4 números separados por pontos, por exemplo, 192.25.13.90. Obviamente, você nunca dirá a seu amigo que comprou algo em 192.25.13.90, mas em, porinstância, www.amazon.com . Isso ocorre porque a Internet também usa um recurso que converte endereços IP em nomes de domínio mais fáceis de lembrar. O exemplo que usei é um site no qual você pode acessar e comprar coisas de uma prática que todos sabemos que fez com que o www se tornasse o que é hoje.
A Internet e o www são, no discurso cotidiano, tratados como se fossem sinônimos, mas na verdade não são. Existem muitos serviços diferentes fornecidos na Internet (por empresas chamadas Internet Service Providers ( ISP )), e esse já era o caso antes da existência do www (por exemplo, fornecendo acesso ao correio eletrônico). O que foi necessário para o www surgir foi (como no JavaScript) uma série de eventos assíncronos. Dois deles são importantes demais para não mencionar.
HTTP e HTML
Você provavelmente já ouviu essa história muitas vezes, mas a World Wide Web não existiria sem ela. É a história de Tim Berners Lee, engenheiro do Centro Europeu de Pesquisa Nuclear ( CERN ). O centro tinha muitos computadores que estavam, é claro, conectados à Internet. Também produziu uma quantidade enorme de dados e documentos, e isso se tornou quase impossível de gerenciar. Tim elaborou uma solução desenvolvendo uma linguagem para escrever esses documentos, um protocolo na Internet para gerenciá-los, bem como um programa de computador para os usuários acessá-los.
HTML
HTML, abreviação de Hypertext Markup Language é o nome desse idioma. Hipertexto é um texto que contém hiperlinks , que por sua vez são as partes de um documento nas quais os leitores podem clicar para levá-los a um documento diferente, usando o link. Todos vocês viram as partes sublinhadas em azul de um texto, em páginas da web não tão bonitas. Estes são os hiperlinks.
Um documento em HTML consiste em tags, com texto entre elas. Existem tags de abertura e fechamento, por exemplo, da seguinte maneira:
<h1>Olá, mundo</h1>
Aqui <h1> está a tag de abertura e </h1> a de fechamento. Vamos aprender sobre uma linguagem de marcação semelhante: XML. HTML e XML não são os mesmos. Uma diferença importante é que, em XML, você pode definir suas próprias tags, desde que feche cada uma que abriu. XML é usado para transferir os dados e as tags são usadas para organizar os dados.
Em HTML, as tags têm um significado específico. <h1> seria usado em um documento para o texto de um cabeçalho de nível um. Uma <a> marca – a marca âncora – é aquela usada para incluir os hiperlinks que acabamos de discutir. Portanto, o objetivo de escrever HTML não é transferir dados, mas apresentá-los a usuários humanos.
Para fazer isso, essas tags são interpretados pelo programa de computador que mencionamos anteriormente. Esse programa é chamado de navegador . Quando o leitor clica em um hiperlink, o navegador também o detecta e envia uma solicitação para outro programa, o servidor da Web, para buscar outro documento.
HTTP
É aqui que o HTTP, o O Hypertext Transfer Protocol se encaixa. Se um usuário clicar em um link, é como dizer: vá buscar outro documento HTML. O nome desse documento faria parte de uma cadeia mais longa que começa com http:// e também contém o nome de domínio do servidor. É chamadoum localizador de recursos uniforme, mas todos nos referimos a ele como URL. A seguir, é apresentado um exemplo: https://comodesenvolver.com.br/.
O que você pode fazer com o HTTP evoluiu com o tempo e aprenderemos sobre isso mais adiante neste artigo, mas, por enquanto, precisamos seguir em frente com a lição de história. Mais um pequeno detalhe da história para você: adivinhe como nosso amigo Tim chamou seu navegador, o primeiro navegador de todos os tempos: WorldWideWeb. Mais tarde, ele o renomeou para evitar confusão.
O consórcio da World Wide Web (W3C)
Depois que ele deixou o CERN em 1994, Tim Berners Lee fundou o World Wide Web Consortium ( W3C ). O consórcio tenta reforçar a compatibilidade e o acordo entre os fornecedores que fornecem componentes para a web. Versões incompatíveis do HTML fazem com que os navegadores processem as páginas da Web de maneira diferente; e os recursos incompatíveis adicionados aos navegadores têm o mesmo resultado inesperado.
Se você visitar www.w3.org , você notará que o W3C evoluiu para um corpo de padrões para muitas tecnologias, mas mesmo naqueles dias, era extremamente necessário ter uma organização dessas.
Mosaic
O primeiro navegador
Mosaico era desenvolvido no National Center for Supercomputer Applications ( NCSA ) da Universidade de Illinois em Champaign-Urbana por uma equipe liderada por Marc Andreesen. Foi o primeiro navegador a oferecer suporte a vários protocolos (daí o nome), além de exibir uma imagem e texto na mesma página (surpreendentemente, isso não é uma questão trivial em uma página da web!) Logo chamou a atenção em todo o mundo e o navegador foi portado para muitas plataformas, para que mais e mais pessoas pudessem desenvolver ou ter acesso a sites.
Em novembro de 1992, havia 26 sites. No navegador Mosaic, havia uma seção O que há de novo que mostrava um novo site todos os dias. Três anos depois, havia 10.000 e outros três anos depois, milhões. Hoje, não acho mais possível contá-los. Então, como chegamos de milhares a milhões?
Netscape
Marc Andreesen fundou uma empresa, em homenagem a Mosaic, e depois renomeou-a Netscape Communications Corporation . Eles basicamente reescreveram o navegador Mosaic e o otimizaram para ambientes com menor largura de banda de rede, comoindivíduos que acessam a Internet em casa através de seu ISP. O navegador foi chamado Netscape Navigator . Esse foi claramente o primeiro navegador comercial, chegando às prateleiras das lojas de computadores como parte de um pacote, o Netscape Communicator.
Netscape também foi creditado como o primeiro navegador a incluir suporte para JavaScript. Com essa linguagem de script, a interatividade pode ser adicionada às páginas da web. A World Wide Web pode estar ao alcance de qualquer pessoa, comodesde que você tenha o Netscape. De 1994 a cerca de 1999, a Netscape teve claramente a maior participação de mercado para navegadores.
Com o tempo, o Netscape foi transferido para a Mozilla Corporation, uma organização de código aberto, e o desenvolvimento do Netscape terminou. Hoje, os usuários podem baixar o navegador Firefoxde www.mozilla.org .
Internet Explorer
Outro derivado do Mosaic, o Spyglass Mosaic, entrou na base de código da Microsoft e foi finalmente incluído no Microsoft Windows. Hoje o conhecemos como Internet Explorer . É assim que chegamos ao tópico das chamadas guerras de navegadores. Como mencionei, o Netscape estava tentando conquistarpossível, entrando no mercado de varejo e cobrando pelo seu navegador. A Microsoft, por outro lado, decidiu agrupar o Internet Explorer gratuitamente em seu sistema operacional Windows (é claro que você tinha que pagar pelo Windows).
Isso levou a muitas situações de processo, já que a Microsoft foi acusada de concorrência desleal pelos outros fornecedores de navegadores. Esta situação mudou agora, pois todos os navegadores são gratuitos. Hoje, os usuários de computadores podem escolher qual navegador desejam usar. Nos tablets, as opções são limitadas, mas, por outro lado, os navegadores nos tablets geralmente possuem todos os recursos mais recentes.
Uma guerra diferente e potencialmente mais sangrenta estava acontecendo no nível técnico. Apesar de ter um corpo de padrões, o W3C, que controlava e introduzia novos recursos (HTML e CSS), nem todos os navegadores estavam adaptando esses recursos da mesma maneira com a mesma rapidez. Portanto, as mesmas páginas da Web continuaram diferentes quando foram renderizadas por navegadores diferentes. Triste, mas é verdade, o navegador que era o mais incompatível e imprevisível, o Internet Explorer, era, na virada do século, também o usado pela maioria das pessoas que navegavam na web.
Os desenvolvedores, portanto, não tiveram escolha, a não ser adiar o uso de novos recursos interessantes, à custa de gastar uma quantidade considerável de tempo extra, fazendo com que suas páginas parecessem as mesmas em um PC usado pela maioria dos visitantes, assim como no sistema em que foram criados.
As coisas pioraram muito antes de começarem a melhorar, à medida que mais desenvolvedores começaram a usar JavaScript para adicionar interação e animação às páginas, enquanto muitos administradores de sistema recomendaram uma configuração com o JavaScript desativado. Às vezes, isso fazia com que o visitante não visse nada na página.
Mas não se desespere, estamos em 2015 agora! Neste livro, adotaremos uma abordagem diferente e sempre permitiremos que você use o novo recursos quando o navegador suporta.
A explosão da Web
Na virada do século, toda empresa queria ter uma página da web. As páginas da Web foram criadas vinculando mais páginas da Web, com informações sobre a empresa ou apenas o proprietário do site. Este último foi possível por ISPs inteligentes que também ofereciam hospedagem na web. As pessoas precisam acessar seu site mesmo enquanto você ou seu computador estão dormindo; então esses serviçosoferecer tempo de atividade 24/7 para colocar seus arquivos HTML. Hospedagem na Webas empresas também se encarregam de obter um nome de domínio, como www.thecoolestphotographer.com .
Em algum momento, a obtenção do nome de domínio desejado estava próximo de outra guerra de navegadores, pois só poderia haver um xyz.com,e, se algumas pessoas de negócios pensassem que ter o xyz.comprimeiro valeria a pena, elas o pegariam.
Quando eu queria um para mim, paulwellens.comjá fui escolhido por um jogador britânico de rugby, então fui para www.paulpwellens.com (P é minha inicial do meio). Eu não sou britânico nem jogador de rugby, então tudo bem comigo.
Então, muitas páginas foram criadas em todo o mundo, mas tudo o que tinham inicialmente era informações para você olhar, nada mais. Em alguns casos, eles foram criados uma vez e nunca atualizados. Felizmente, foi a exceção para confirmar a regra. Muitas empresas decidiram que tinham que estar presentes na Web e, assim, foram criados sites corporativos. O advento do CSS facilitou muito isso, pois permitiu a separação da apresentação e do conteúdo. Dessa forma, o departamento de marketing forneceria o logotipo da empresa, a aparência e a aparência, e todos os outros departamentos forneceriam o conteúdo.
Amazon.com e comércio eletrônico
Algumas mentes criativas perceberamque a Web apresentou uma oportunidade de fazer mais do que apenas fornecer informações. É apenas um pequeno passo (relativamente) do fornecimento deinformações dos produtos que você possui em seu site, para realmente vendê-los. O comércio eletrônico eraassim nascido. Amazon vem à mente como um bom exemplo de site com o qual todos podem se relacionar comouma loja virtual . É claro que desenvolver uma loja virtual envolve muito mais do que alguém na empresa digitar algum conteúdo.
Esses produtos são produtos reais; eles ficam em um armazém, têm um número de peça, um preço, um nome e uma descrição, tamanhos e cores diferentes e assim por diante. Essas informações, mais do que provável, já estão presentes em alguns bancos de dados que são atualizados toda vez que um produto é vendido em uma loja de varejo. Para vender algo online, sua página da web precisa interagir com o visitante, apresentar a ele algum tipo de carrinho de compras na tela, calcular subtotais, verificar o inventário do armazém e assim por diante.
Para fazer isso, mais e estava envolvida em mais programação, e não apenas mais na entrada de dados em um arquivo HTML. Então, o trabalho do desenvolvedor Web nasceu. Tradicionalprogramadores são especializados em uma única linguagem de programação (Java ou C ++) e geralmente em uma única plataforma ( Solarisou .NET ). Os desenvolvedores da Web precisam ser fluentes em pelo menos quatro idiomas diferentes, comobem como saber uma coisa ou duas sobre bancos de dados. Eu gostaria de adicione um aspecto que, para mim, faz esse trabalho muito emocionante – envolve-se nos aspectos do design. A diferença entre um Web Designer e um Desenvolvedor Web está diminuindo. Hoje, fala-se de desenvolvedores Front-End e Back-End.
Então é isso que ensinaremos neste livro; como ser um desenvolvedor da Web , mas não antes de concluir nossa lição de história. Existem mais algumas coisas que tornaram a web o que é hoje.
Google e Yahoo!
Então você tem um site com informações ou uma loja virtual porque está vendendo algo na web, como www.mycoolproduct.com. Como você espera alcançar seus clientes em potencial, ligue para cada um deles? É aqui que o Google ou o Yahoo se encaixam. Essas empresas populares desenvolveram os chamados mecanismos de pesquisa. Você quer descobrir tudo o que há para saber sobre um filme que acabou de assistir, uma música da qual não se lembra o nome ou simplesmente o telefonenúmero do seu restaurante favorito? Você visita google.com , yahoo.com ou sites equivalentes e digite o que você éprocurando por. Provavelmente, você o encontrará.
Fizemos um estudo de usabilidade no trabalho, onde demos a um grupo um conjunto de CDs, uma pilha de manuais e um computador parainstalar; o outro grupo não recebeu os manuais, mas o acesso à Internet. O segundo grupo se saiu muito melhor porque eles achavam que não precisavam dos manuais, pois supunham que provavelmente estavam desatualizados e imediatamente procuraram as coisas on-line. E isso aconteceu há mais de 10 anos.
Hoje, o uso de mecanismos de pesquisa é tão comum que termos como o Yahoo! e o Google são usados como verbos. Em algumas línguas, eles realmente se tornaram verbos e entraram no dicionário oficial.
Rede social
Conheço pessoas que não usam o Facebook hoje, mas não conheço ninguém que não conheça o Facebook. Durante anos, passei pelo prédio onde o Facebook tinha seu escritório. Eu realmente não estava interessado. Então, quando voltei para a Bélgica, decidi me juntar a eles para manter contato commeus amigos na Califórnia, que moram em um fuso horário diferente e a vários milhares de quilômetros de distância. De um deles, descobri que o pessoal do Facebook se mudou para o prédio onde eu costumava ter meu escritório. Engraçado como isso acontece às vezes!
Facebook, Twitter, YouTube e LinkedIn são exemplos de sites populares de redes sociais. Nada é vendido aqui, mas compartilhado. As pessoas compartilham fotos, histórias, eventos, pensamentos, idéias, opiniões e assim por diante.
Desenvolvimento Web
Muitos anos atrás, participei de uma aula de 6 meses sobre o que, basicamente, faz parte deste livro. Meses depois, ficou claro que a falta de uma parte introdutória que explica como todos os componentes do curso estavam relacionados, era a maior falha do curso.
Após seis meses, houve ainda havia pessoas que não entendiam a diferença entre Java e JavaScript. Então, prometi a mim mesmo duas coisas: que um dia escreveria um livro e que esse capítulo faria parte dele. Então vamos!
HTML
Os arquivos gravados em HTML formam obase de todos os sites. Tocamos brevemente em sua história na seção anterior; aqui vamos nos aprofundar um pouco maisestrutura. Veja o seguinte exemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World example<\title>
<\head>
<body>
<h1>Hello, world<\h1>
<\body>
<\html>
A primeira linha especifica DOCTYPE, referindo-se à versão HTML usada, para que o navegador saiba como interpretar o arquivo. O exemplo é indicativo de HTML5. DOCTYPEdeclarações costumavam ser muito mais longas.
Isso é seguido pela tag principal, a <html>tag. No meio, encontraremos todo o nosso HTML em duas seções, <head>e <body>. A etiqueta do corpo é o que contém o seu conteúdo e a etiqueta da cabeça contém outras informações. No nosso exemplo, há um metatag que especifica qual codificaçãoé usado. A <title>tag contém texto que será exibido pelo navegador na parte superior da janela. É muito importante não esquecer a <title>tag, pois essa é uma das coisas que os mecanismos de pesquisa examinarão.
Neste simplesPor exemplo, o corpo contém uma única <h1>tag. Isso representa um cabeçalho de nível um no documento, semelhante aos cabeçalhos encontrados nos processadores de texto. O navegador decidirá comoexibir esse conteúdo ou, como eles dizem, renderizá-lo. Então, como colocamos o HTML em um arquivo e o colocamos em um navegador?
Editores de HTML e outras ferramentas
Como um arquivo HTML é apenas um arquivo de texto, seu editor de texto favorito faça muito bem. Apenas verifique se ele possui a .htmlextensão no nome, por exemplo hello.html.
No entanto, em algum momento, você provavelmente incluirá CSS, JavaScript e certamente PHP no mesmo arquivo. Nesse caso, ferramentas especializadas o tornarão muito mais produtivo.
Navegadores e servidores da web
Então agora você tem um arquivo chamado hello.htmle deseja visualizá-lo em um navegador. Na vida real, esse arquivo fará parte do seu site e você precisará colocá-lo lá. É aqui que a empresa que hospeda seu site solicita que você coloque seus arquivos. Eles vão te dar todas as informações para transferir corretamente seus arquivos para o servidor deles.
Eles vão acabar em umpasta chamada raiz do documento , a pastaraiz de todos os arquivos que compõem seu site. Se você seguir as instruções do hello.htmlarquivo e transferi-lo para lá, verá o resultado ao digitar o seguinte endereço na barra de URL do seu navegador:
Você também pode consultar seu arquivo localmente, e ensinaremos mais sobre isso no próximo capítulo.
É muito importante perceber que, para as pessoas que visitam seu site, sua página da Web pode não ser a mesma que você criou. Um fator – mas não o único – é o navegador que está sendo usado. Portanto, recomendamos que, desde o estágio inicial de desenvolvimento, você analise seu trabalho usando diferentes navegadores e aumente o número de navegadores, para / e dispositivos diferentes.
Instale sempre o Mozilla Firefox e o Google Chrome no seu Mac ou PC. Escolha uma para fazer seu desenvolvimento (eu gosto do Firefox por causa do Firebug ), mas sempre faça alguns testes com outros navegadores antes de entregar.
Então comece comnosso pequeno exemplo, e você verá que até o Hello World parecerádiferente em diferentes navegadores. Felizmente, podemos controlar quase tudo isso usando CSS.
CSS
CSS ( Cascading Style Sheets ) é uma tecnologia que funciona bem de acordo com o HTML e permite que você, não o usuário navegador, para determinar como será sua página.
Veja este exemplo ligeiramente modificada do nosso Olá, mundo webpage, hello.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World example</title>
<link href="hello.css" rel="stylesheet" ></link>
</head>
<body>
<h1 class="green header" id="hello">Hello, World </h1>
</body>
</html>
Na linha que contém a <h1>tag, adicionamos dois atributos HTML classe idao <h1>elemento Atributos são cadeias dentro de uma tag de abertura HTML do nome do formato = “valor” e os dois atributos mais importantes que você pode usar são classe id. Muitos elementos podem fazer parte de várias classes, mas ids são exclusivos para um único elemento.
Agora crie um arquivo chamado hello.csscom o seguinte conteúdo:
h1 {
font-family:Baskerville, cambria, serif;
font-size:24px;
}
.green {
color:green;
}
#hello {
font-weight:bold;
font-style: italic;
)
Esta é a nossa primeira folha de estilo CSS. A primeira regra no arquivo significa que qualquer <h1>elemento em nosso documento estará na fonte Baskerville (ou cambria, se Baskerville não estiver presente no computador do usuário), em 24 pixels e na cor escolhida pelo navegador (geralmente preta) .
No entanto, quando ele, ou qualquer outro elemento, e não apenas h1, tiver uma classe = ” green” (em CSS, o .nome in significa nome da classe), ele será exibido na cor verde.
Finalmente, nossa um cabeçalho específico do Hello World será exibido em negrito e itálico devido às últimas linhas do arquivo CSS. O #caractere é usado no CSS para indicar um identificador; portanto, a regra #hello significa uma regra para o elemento definido como id = ” hello“.
Como resultado disso, qualquer navegador deve renderizar nosso arquivo HTML como uma linha que contém o texto Olá, mundo , exibido no tipo de letra Baskerville (uma fonte com serifa frequentemente usada para eBooks, sem relação com Sherlock Holmes que eu conheço), em verde, tamanho 24 pixels, em negrito e itálico. Apenas tente, funciona!
Observe que não repetimos a linha Baskerville na regra #hello, a regra é simplesmente herdada. As <h1>regras entram em cascata em #hello, pois esse é um <h1>nome, portanto, o nome Cascading Style Sheets. Como acabamos de demonstrar, podemos separar claramente o conteúdo e a apresentação da nossa página usando CSS. É por isso que é importante aprender a usar CSS o mais cedo possível.
Portanto, como desenvolvedor da Web, você já sabe que precisa dominar pelo menos HTML e CSS. Passaremos agora para a próxima peça do quebra-cabeça da linguagem – JavaScript.
Javascript
Quando conversamos sobre JavaScript neste livro, salvo indicação em contrário, queremos dizer JavaScript do lado do cliente. Todo o código é interpretado, assim como o HTML e CSS, pelo navegador.
Ao usar JavaScript, podemos adicionar ações às nossas páginas e interagir com os visitantes do nosso site, além de altere o conteúdo e a aparência da nossa página através da programação. Vamos dar uma olhada no seguinte exemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World example</title>
<link href="hello.css" rel="stylesheet" ></link>
</head>
<body>
<h1 class="green header" id="hello"></h1>
<script type="text/javascript">
var answer = confirm("Do you want to say hello?");
if (answer == true)
{
document.getElementById("hello").innerHTML="Hello, world";
}
</script>
</body>
</html>
Se você olhar para issopágina em um navegador, não haverá Hello, World na tela, mas uma caixa pop-up aparecerá com uma pergunta. Se você responder à pergunta Sim , nosso familiar texto verde Hello World estará de volta. A caixa pop-up em si parecerá completamente diferente quando você usar um navegador diferente.
Se você olhar o código, reconhecerá coisas do tipo programação. Existe uma ifcláusula e existe umavariável (resposta). Observe que o nome da variável é uma cadeia de caracteres normal, mas em sua declaração é precedida por var. Todo o código JavaScript está no meio de uma <script>tag HTML com um typeatributo de text/javascript.
Há uma linha que é muito típica do JavaScript e faz todo o trabalho para nós:
document.getElementById("hello").innerHTML="Hello, world";
No capítulo 4 , o JavaScript é onde realmente ensinaremos o que isso significa. Por enquanto, forneceremos a interpretação em inglês dessa linha de código: Em nosso documento, substitua o conteúdo interno da tag HTML por idhello pela string Hello, world .
Nos capítulos seguintes, apresentaremos o JavaScript libraries, que permitirá que você escreva um código JavaScript mais compacto, com ummuito trabalho já feito para você. jQuery é uma dessas bibliotecase será discutido no Capítulo 7 , jQuery .
PHP
O JavaScript é uma linguagem completa e permite que você faça muito mais coisas do que aquelas que mostramos no pequeno exemplo anterior. No entanto, como mencionei, esse é o JavaScript do lado do cliente, interpretado pelo navegador. Então, depois de desligar o computador ou tablet, tudo se foi. Bem, alguns pode ser salvo na sua máquina.
Imagine tentar criar uma loja online usando apenas os idiomas que mencionamos até agora. Isso não funcionaria. As informações do que está disponível na loja, bem como os dados do seu pedido específico, precisam morar em outro lugar. Esse seria o computador da empresa que administra a loja, não o dispositivo que executa o navegador usado para visitar o site.
Então, querido desenvolvedor Web, vocêadivinhem, você precisará aprender pelo menos mais uma linguagem de programação para lidar com tudo isso, antes de criar uma loja online. O idioma em si pode ser um de vários (pode até ser JavaScript), mas onde o código é armazenado e interpretado é a principal diferença aqui: um servidor de aplicativos remoto. Uma das linguagens mais populares é o PHP, abordado em detalhes no Capítulo 5 , PHP . Vejamos o seguinte exemplo:
<?php
$hello = "Hello World Example";
$helloheader = '<h1 class="green" id="hello">Hello, World</
h1>';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title><?php echo $hello; ?></title>
<link href="hello.css" type="text/css" rel="stylesheet" ></link>
</head>
<body>
<?php
echo $helloheader;
?>
</body>
</html>
Até agora, conseguimos testar nossos pequenos exemplos em um navegador, mas isso é diferente. Para experimentar este exemplo, você precisará ter um servidor de aplicativos, local ou não, instalado. Por enquanto, continue lendo.
Observe as seqüências <?phpe ?>no exemplo. Este é o começo e o fim de onde o código PHP reside e terá que ser interpretado por esse servidor de aplicativos. A primeira parte do código define duas variáveis. Observe que, no PHP, os nomes das variáveis começam com um $sinal, enquanto no JavaScript, não. echo, familiar para o pessoal do UNIX, simplesmente ecoa o valor dessas variáveis.
Então, uma vez que o O AppServer acaba de interpretar o código PHP; tudo o que resta é o nosso exemplo HTML da seção CSS. É exatamente assim que funciona: o AppServer interpreta o código PHP e o servidor da Web passa o código HTML resultante para o navegador.
Apache é o nomede um AppServer muito popular que passa a ser um servidor da Web ao mesmo tempo. Este é um software que é executado em um computador que também chamar um servidor e é aí que reside o seu arquivo programa: hello.php.
Assim http://www.mycoolsite.com/hello será, mais uma vez, a maneira como esta página da web pode ser acessada. Pode parecer um pouco de usar um passeio de exagero em um idioma adicional para exibir Olá, Mundo . Mas há algumas situações em que você deseja fazer isso, por exemplo, se os dados necessários em seu HTML estiverem armazenados em outro lugar.
Dados
Um dos principais motivos para usar o servidor remoto e o idioma do lado do servidor será o armazenamento e manipulação de dados. Esses dados podem estar em vários formatos, de um arquivo de texto simples a uma planilha, XML, JSON ou um banco de dados completo, que requer um servidor de banco de dados. Nesse último caso, talvez você precise aprender outro idioma, o padrão Linguagem de Consulta ( SQL ) e lida com outro servidor (software): um servidor de banco de dados. Abordaremos várias opções neste livro.
Conclusão
Neste capítulo, discutimos o advento e a história da Internet. Em seguida, discutimos o desenvolvimento da Web em geral com alguns exemplos. Para se tornar um desenvolvedor de aplicativos da Web, você precisará dominar pelo menos quatro idiomas: HTML, CSS, JavaScript e um idioma do servidor, como PHP.
Dependendo de como você planeja organizar seus dados, pode ser necessário aprender também uma quinta linguagem (SQL). Também haverá mais coisas a aprender, como usar uma biblioteca ou estrutura. A boa notícia é que todos eles têm seu papel na imagem geral do que é um Aplicativo da Web.
Agora que sabemos o que precisamos aprender, vamos lá! Vamos começar com HTML.