HTML, CSS e JavaScript é o próximo passo na base de conhecimentos necessários para que possa começar a jornada de desenvolvedor Java Web. É mais um tijolo na sustentação do conhecimento que o possibilitará tirar qualquer ideia do papel. Aqui reunimos o essencial para o desenvolvido de interfaces bonitas, mas sobretudo que primam pela usabilidade. No artigo de hoje conversaremos sobre Front-end, e a sua importância no escopo do desenvolvimento web.

HTML

O HTML – HyperText Markup Language, ou como falamos em português, Linguagem de Marcação de Texto é essencialmente utilizado na construção do Front-end de páginas web. Podemos compreendê-lo como um documento que é interpretado por navegadores web. Sendo o bloco de construção mais básico da World Wide Web, sua função primeira é definir a estrutura do conteúdo de um site, sistema ou aplicação web.

Assim, para entendermos melhor a função do HTML em uma página da internet, devemos entender então cada elemento da sigla. Dessa forma temos que HyperText se refere aos links que conectam as páginas webs umas às outras. Ao passo que Markup (marcação) traduz literalmente o que o HTML é, uma linguagem de marcação.

Considere um site qualquer, todo o conteúdo estático deste site, textos, tabelas, vídeos, imagens, é a parte do HTML, ele trata apenas do conteúdo, nada além disso. Por isso falamos em marcação de texto, ele marca ao localização do conteúdo na página, separando-os em cabeçalho (head), corpo (body) e rodapé (footer).

Bom, este documento HTML é construído com o que aqui chamamos de marcadores, do inglês tags, como comumente falamos. Essas tags são palavras entre chevrons, sinais de maior e menor, (<body> </body>).

CSS – CASCADING STYLE SHEETS

Se o HTML é o responsável pela marcação do conteúdo em uma página web, o CSS responde pela estilização desse conteúdo. Transformando o site em algo mais agradável visualmente e mais amigável para o usuário.

Assim, o CSS é um simples mecanismo para adicionar estilo, entre os quais, cores, fontes, espaçamento, entre outros a um documento web. Desse modo, em uma página distinta do documento HTML, embora linkada a esta e a qual chamamos de folha de estilo, é que escrevemos todo o código responsável pela estilização do site. Porém, esta não compreende a única forma de fazê-lo. O estilo de uma página pode ser inserido inline ou na própria tag HTML.

O CSS trabalha em conjunto com o HTML, ou seja, do lado do cliente. Quando falamos em interfaces bonitas, estamos falando de estilização a partir do CSS. E para facilitar este trabalho existem alguns frameworks que foram desenvolvidos baseados nesta folha de estilo.

Entre estes muitos frameworks os mais populares são o BootStrap e o Material Design Lite, que nada mais são do que frameworks de design. Mas para conseguir trabalhar fluentemente com eles é preciso saber CSS. E quanto mais você souber CSS, mais páginas bacanas e visualmente bonitas você conseguirá construir.

JAVASCRIPT NÃO É JAVA

E a cereja do bolo é o JavaScript, com ele poderemos construir sistemas dinâmicos de modo a possibilitar que o usuário interaja com a nossa aplicação. Mas antes temos que esclarecer uma confusão muito comum, principalmente entre quem está começando. “JavaScript não é a mesma coisa que Java”.

O JavaScript é uma das principais tecnologias de desenvolvimento web. Ela foi desenvolvida pela NetScap. Sua principal função é fornecer certos níveis de interatividade para as páginas da World Wide Web, por meio da manipulação do HTML. Isto é, transformando sites estáticos em sites interativos.

Com o JavaScript podemos pegar um elemento dentro de uma caixa de texto, fazer uma validação, fazer requisições em Ajax, esconder e adicionar elementos na página, entre o que mais sua criatividade for capaz de inventar.

PRINCIPAL DIFERENÇA ENTRE JAVASCRIPT E JAVA

Enquanto o Java é uma plataforma e uma linguagem Orientada a objetos, atuando do lado do servidor, o JavaScript por sua vez, atuando do lado do cliente é uma linguagem de Scripts. Entretanto, a partir de 1996 já é possível desenvolver aplicações completas com o JavaScript. Mas hoje, iremos falar do JavaScript do lado do cliente.

Com o Java podemos escrever aplicações que irão rodar do lado do servidor, uma vez que com JSP – JavaServer Pages, é possível gerar páginas web dinamicamente baseadas em HTML, muito semelhante ao PHP – Personal Home Page. O Java precisa de uma Virtual Machine para ser executado/compilado. Essa máquina virtual poderá estar ou do lado do cliente ou do lado do servidor.

E no contexto de ambiente de execução/interpretação o JavaScript é interpretado pelo navegador, não precisa instalar absolutamente nada. O próprio interpretador do lado do cliente é capaz de interpretá-lo. E tal como acontece com o CSS, existem também frameworks baseados em JavaScript.

Entretanto, para conseguir extrair o máximo desses frameworks é preciso antes pelo menos dominar a base do JavaScript. Assim será capaz de fazer qualquer coisa sem precisar recorrer a estes frameworks.

Tranquilize-se que você não precisará aprender todos eles, novamente, antes de escolher qual framework irá aprender, é preciso primeiro lançar um olhar para o mercado. Assim, você descobrirá, qual é o mais pedido, o mais usado, e o que fará mais sentido você empenhar tempo em aprender.

Veja abaixo um exemplo simples de um código que une HTML e JavaScript que pega o nome digitado em um campo de texto e o exibe depois que o botão é clicado.

O texto será exibido como um alerta, apenas para que você possa ainda que de forma simples, vislumbrar um pouco do que pode ser feito com o JavaScript.

EM POUCAS PALAVRAS

O artigo de hoje cumpriu o objetivo de nos apresentar um pouco mais do que é preciso conhecer para que você possa se tornar um desenvolvedor Java web de sucesso. Você aprendeu o que é e para que serve o HTML, o CSS e o JavaScript, dentro deste cenário de desenvolvimento web. Eu fico por aqui, espero que tenham gostado, nos vemos no próximo tutorial.