2 INFO – 23/02/2024 – PROG WEB – Javascript e a evolução dos sites

HTML (HyperText Markup Language) é a base da web, permitindo a criação de páginas da internet. CSS (Cascading Style Sheets) torna essas páginas atraentes, definindo a aparência visual. JavaScript é a linguagem de programação que adiciona interatividade e dinamismo.

Comece com o básico: aprenda a estrutura de uma página HTML e a estilize com CSS. Em seguida, mergulhe no JavaScript para criar funcionalidades interativas, como formulários e animações.

CSS foi desenvolvido pelo W3C (World Wide Web Consortium) em 1996, por uma razão bem simples. O HTML não foi projetado para ter tags que ajudariam a formatar a página.

COMO ERAM OS SITES ANTIGAMENTE?

Antigamente os sites eram criados utilizando somente a linguagem HTML. Vejamos a evolução do famoso site Yahoo.

Os sites eram estáticos, ou seja, as únicas ações possíveis eram acessar um novo link ou baixar arquivos (Musicas, fotos etc).

Em 1995 foi lançada a linguagem de programação Javascript, foi aí que as páginas começaram a ficar mais dinâmicas.

Em 1996 foi lançado a linguagem CSS ( Cascading Style Sheet ). Essa linguagem demorou um pouco para ser adotada e o visual da maioria dos sites continuava simples.

Nos anos 2000, a linguagem javascript já era bastante difundida e possuía muitos recursos. Em contrapartida, a linguagem CSS caminhava devagar, sendo adotada aos poucos, pois sua adoção dependia principalmente do suporte oferecido pelos navegadores de internet.

Em resumo, os sites foram se atualizando e hoje tem uma ótima aparência graças ao CSS, bem como possuem grande interatividade graças ao Javascript.

Como programar em Javascript?

Podemos inserir o código Javascript diretamente no documento HTML utilizando a tag <script>

Essa é a maneira mais rápida e fácil de começar a codificar em Javascript sem necessitar utilizar algum site. Veja o código abaixo.

Ao salvarmos esse código em um arquivo chamado “site1.html”, podemos utilizar um navegador de internet para renderizar HTML e executar o código Javascript.

Outra maneira rápida para executar códigos javascript é através do “console” do navegador de internet. Abrimos o console apertando a tecla F12 ou clicando com o botão direito do mouse e depois em “inspecionar”

O após isso clicamos em “Console”.

Aqui podemos digitar comandos Javascript que serão executados instantaneamente no site que visitamos.

Vamos executar o seguinte código:

O código abaixo utiliza uma estrutura de repetição FOR

O resultado será esse:

Conseguimos criar variáveis com o comando VAR e imprimir valores no console com o comando CONSOLE.LOG:

JavaScript é uma linguagem de tipagem dinâmica, o que significa que você não precisa declarar explicitamente o tipo de uma variável. O tipo é definido automaticamente quando você atribui um valor a ela.

Tipagem Dinâmica

HORA DE PRATICAR!

1. Abra o site do www.gerardao.com.br, execute um código javascript qualquer diretamente no console do navegador.
2. Ainda no console do navegador, crie um código que imprima seu nome e sua idade com o comando console.log ( ).
3. Altere o código da tabuada simples para imprimir a tabuada do número 7.
4. comente uma parte do código com // para que essa parte do código não seja executada.