Desenvolvimento de Aplicações para Web

Fabio Soares Sant ana Paiva e Rachel Barbosa Maia

Ciência da Computação – Universidade Veiga de Almeida (UVA)

Rio de Janeiro – RJ – Brazil

Histórico Desenvolvimento Web

Universidade Veiga de Almeida (Uva) – Rio de Janeiro, RJ – Brazil
fabio.19sant@gmail.com, rchlbrbs@gmail.com

Abstract. Neste trabalho será explicado como surgiu, o que é e para que serve o
desenvolvimento web.
Resumo. No início o desenvolvimento web baseava-se em páginas estáticas
com o intuito de fornecer informações e a sua navegação era difícil e
rudimentar, sendo necessário conhecimentos técnicos para isso, porém com o
avanço da ideia de web colaborativa, os usuários possuíam mais autonomia
para poder criar e injetar informações na Web e com isso foram criados
mecanismos para que a navegação do internauta ficasse mais agradável,
fluida e interessante.

1. Início da Web – Web 1.0

A internet teve início com o propósito de compartilhar informações entre uma rede de
nós, sem que haja prejuízo ou perca de dados caso um desses nós fôssemos destruídos.
Com isso foi criado a ARPANET. No início da navegação Web, como a mesma era
restrita a um grupo de pessoas, sua navegação não era nada prática, difícil e rudimentar,
foi então que em 1990 o cientista da computação Tim Berners-Lee enquanto trabalhava
no CERN (Organização Europeia de
Pesquisa Nuclear da Suíça), pensou no
primeiro servidor web e o primeiro
navegador web gráfico. Tim idealizava
uma forma de ter acesso mais rápido a
um arquivo, que por meio de uma
aplicação instalada no computador,
possibilitasse a visualização de
informações e textos que estivessem

Figura 1. Tim Berners-Lee

armazenados em um computador. Com essa ideia em mente, surge a World Wide Web.
Tim pensou em um protocolo onde era possível que, fazendo o uso de um aplicativo
instalado no computador (Browser), fosse possível acessar dentro de um servidor de
aplicação arquivos de mídia, hipermídia e textos. Com isso, seria enviado por meio
desse aplicativo instalado no computador o endereço IP para a máquina que possui um
servidor web rodando, e essa máquina faria a comunicação com o servidor e esse
servidor retornaria esse arquivo solicitado para ser renderizada na aplicação do usuário.
Além disso, ele pensou em uma forma de não apenas visualizar textos, ele buscava ver
um texto hipermídia, com imagens, títulos, parágrafos e links e que essas informações
retornassem ao usuário de uma forma estruturada, foi assim então que nasceu o HTML
que foi muito baseada na SGML que era utilizado para estruturar documentos
governamentais.

Figura 2. Estrutura idealizada por Tim Berners-Lee

Nesta época, o conteúdo era renderizado de forma estática como se fossem ser
impressas em uma folha de papel e basicamente apresentava textos, a ideia era
disponibilizar e linkar conteúdo (hipermídias entre elas), e o HTML estava atendendo
essa premissa. Além de ser um conteúdo estático, essa versão da Web era uma mão de
via única, ou seja, o usuário não podia criar conteúdo, podia apenas consumir o que lá já
existia. Não havendo nenhuma interatividade do internauta com a página. Também não
havia um interesse no visual de como o conteúdo iria ser apresentado, o HTML foi
criado para organizar e estruturar documentos, e não para dar estilo ou formatação então
ficava a cargo do browser de como os dados iriam ser impressos na tela do usuário
(cliente).

Figura 3: Primeira página Web criada no navegador WorldWideWeb

https://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html

Figura 4. Explicação HTML no navegador WorldWideWeb

https://www.w3.org/History/19921103-hypertext/hypertext/WWW/MarkUp/MarkUp.html
2. Navegador Mosaic – Web 2.0

Um grande avanço na história da Web aconteceu a partir de 1992 com a criação do

navegador Mozaic. Apensar do navegador Mozaic não ter sido o primeiro navegador
criado, pois antes dele o próprio Tim Berners-Lee havia criado o navegador
WorldWideWeb, ele foi o propulsor do boom da internet, pois antes da sua criação os
navegadores eram rudimentares, de difícil manejo e desinteressante. Foi então que o
próprio Tim teve a ideia de chamar um grupo de estudantes do Centro Nacional de
Aplicações para Supercomputador -NSA, para que eles pudessem criar um browser
mais fácil e interessante de ser manuseado, foi então que começaram a trabalhar em
uma aplicação que tivesse ícones para navegar, imagens in-line, ou seja, imagens entre
os textos, algo não era possível no navegador que Tim havia criado, pois antes, para
acessar uma imagem, era necessário clicar em um link e tabelas de favoritos, facilitando
e deixando mais agradável a navegação entre sites. A ideia deu tão certo que segundo o
site CanalTech, em poucos meses após sua liberação, já se registrava mais de 5 mil
downloads por mês. Com a sua versão para Windows o navegador Mosaic foi o
principal responsável por criar o interesse do público na Web.

Figura 5. Navegador Mosaic

O Mosaic revolucionou em sua época, abrindo porta para a interatividade com o

usuário e o conteúdo da página, o usuário não era apenas um espectador e apenas
consumia o conteúdo, ele podia participar, o próprio usuário podia inserir conteúdo na
Web, algo que não era possível na primeira versão. Pouco tempo depois em 1993
visando o seu potencial comercial o principal responsável pelo projeto Marc Andreesen
decide sair da NCSA e decide fundar a Mosaic Communications Corporation que
posteriormente seria chamada de Netscape. E tal potencial daria certo, e acarretaria no
interesse da Microsoft nesse novo mercado que estava se iniciando e que se mostrava
promissor, encadeando assim a guerra dos navegadores. A conhecida até hoje por seus
softwares Microsoft licenciou o antigo código do Mosaic e criou a que foi usada durante
muitos anos Internet Explorer, a sua própria janela web. Seu lançamento desencadeou
uma guerra. A Netscape e a Microsoft trabalhavam aceleradamente para criação de
novas versões de seus programas com a finalidade de superar seus concorrentes com
formas de navegação melhores e mais rápidas. A Netscape criou o JavaScript com isso
deu aos sites capacidades poderosas e dinamismo. A Microsoft por outro lado criou o
Cascading Style Sheets o CSS, que se tornou padrão em desing para páginas na web.
Durante o início dos anos 2000 foram surgindo novos competidores como o Opera,
Safari e o bastante utilizado Google Chrome.

https://hackernoon.com/pt/como-a-guerra-dos-navegadores-mudou-o-cen%C3%A1rio-da-internet

3. Novas tecnologias surgem

Com o advento da guerra dos Browser, afim de manter o monopólio do mercado e com
o nascimento da web interativa, diversas tecnologias foram surgindo ou aprimoradas
conforme os anos, como por exemplo a definição de Layouts e a separação de
semântica, estilo e interatividade.

• HTML: Como já foi dito, o HTML é uma linguagem de marcação utilizada para
estruturar os elementos da página, como parágrafos, links, títulos, tabelas,
imagens e até vídeos. É responsável por estruturar e organizar os elementos da
página por meio das TAGs para sinalizar onde cada tipo de elemento será
implementado.
 • CSS: Antes da criação do CSS (Cascading Style Sheet) o estilo da página era
realizado diretamente no código do HTML, sendo criada a TAG “Style” para
forçar o browser a mudar o estilo de parte do código, entretanto isso deixava o
código confuso. O CSS surgiu em 1995 pela WorldWideWeb com uma forma de
complementar o HTML, tendo a finalidade de ser responsável pela toda parte
visual da página Web, deixando a página WEB mais agradável visualmente.
• JavaScript: Foi criado como consequência da competição entre a Microsoft e
Netscape. Antes as páginas da Web eram estáticas como um livro e essa página
exibiam basicamente informações em um Layout fixo. O JavaScript nasce para
tonar as aplicações Web mais dinâmico. Com ele, os navegadores passaram a ser
capazes de responder a interações do usuário e alterar o layout do conteúdo na
página. Com o JavaScript nasce também o conceito de frameworks. Com o
tempo os desenvolvedores notaram que haviam rotinas que se repetiam entre as
aplicações, deste modo, não haviam a necessidade de ter que rescrever todo um
código toda vez que fosse iniciado um novo projeto, então viram que era mais
prático que fosse usado trechos de códigos que já existiam e aplicar na nova.

https://www.alura.com.br/artigos/html-css-e-js-definicoes

4. O que é Frontend?
De Acordo com a plataforma Alura podemos definir como parte visual de um site,
aquilo de conseguimos interagir, pessoas quem desenvolvem na parte de front end é
responsável por criar por meio de código uma interface gráfica e normalmente com as
tecnologias base da web que são HTML, CSS e JavaScript com códigos para rodar em
navegadores como Chrome, Firefox, Microsoft Edge e Safari.
 Figura 6

5. O que é Backend?
A plataforma Alura diz que como o nome sugere, vem da ideia do que tem por trás do
aplicativo. Pode ser um pouco abstrato a princípio, mas pense que para poder usar o
Facebook no dia a dia, os dados (informações) do seu perfil, amigos e publicações
precisam ser guardados em algum lugar e processados a partir daí, e esse lugar é o
banco de dados. Na maioria dos casos, o back-end funciona fazendo a ponte entre os
dados do navegador e o banco de dados e vice-versa.

6. Futuro da Web

A Web3 será a evolução da internet, a idealização foi citada pelo engenheiro britânico
Gavin Wood, uma remodelagem da internet que tem para si novos pilares como a
blockchain e as criptomoedas conforme a plataforma Remessa Online.
Segundo a Plataforma DEV o conceito Web3 visa criar uma internet descentralizada,
mais segura e ira proporcionar maior autonomia para os usuários trata os conteúdos e a
informações pessoais sem depender das grandes empresas, diferente da Web2 onde os
usuários são o produto visto que as empresas começaram a vender as informações para
anunciantes. Na Web3 os dados serão executados no blockchain, conforme diz a
Remessa Online que é uma das maiores características da nova rede de internet, pois
permite a criação de blocos para o trânsito de dados de um modo seguro, independente e
anônimo. Diferente da Web2, onde você era o produto, se imagina que na web3 você
será o dono do conteúdo.
 Na Web3 será oferecido acesso sem a utilização de criação de contas e identificação,
dando privacidade na proteção de dados pessoais. Ainda sendo uma proposta em
desenvolvimento é um processo em evolução que irá levar tempo para se tornar
realidade conforme pontua a Rogrido Valinor analista de conteúdo senior pela Remessa
Online.

7. Bibliografia
aws.amazon.com. (29 de Março de 2023). Fonte: aws.amazon.com:
https://aws.amazon.com/pt/what-
is/javascript/#:~:text=JavaScript%20%C3%A9%20uma%20linguagem%20de,fa
zer%20p%C3%A1ginas%20interativas%20da%20Internet.
canaltech.com.br. (25 de março de 2023). Fonte: canaltech.com.br:
https://canaltech.com.br/navegadores/mosaic-o-navegador-que-revolucionou-a-
web-completa-25-anos-112428/
computacaounb.50webs.com. (27 de 03 de 2023). Fonte: computacaounb.50webs.com:
http://computacaounb.50webs.com/
Curvelo, R. (27 de 03 de 2023). Fonte: https://br.hubspot.com/blog/marketing/evolucao-
web#:~:text=Conhecidas%20como%20Web%201.0%2C%202.0,chegarmos%20
ao%20que%20temos%20hoje.
G1. (26 de 03 de 2023). Fonte: G1:
https://g1.globo.com/tecnologia/noticia/2012/08/primeiro-site-publicado-na-
internet-completa-21-anos-veja.html
https://www.hostmidia.com.br/blog/navegadores-de-internet/. (27 de 03 de 2023).
Fonte: https://www.hostmidia.com.br/blog/navegadores-de-internet/:
https://www.hostmidia.com.br/blog/navegadores-de-internet/
Insede4u.com.br. (25 de Março de 2023). Fonte: Insede4u:
https://inside4u.com.br/2022/07/27/desenvolvimento-web-o-que-e-e-quem-faz/
mozilla.org. (25 de marcço de 2023). Fonte: mozzila.org: https://www.mozilla.org/pt-
BR/firefox/browsers/browser-
history/#:~:text=O%20cientista%20de%20computa%C3%A7%C3%A3o%20bri
t%C3%A2nico,a%20internet%20de%20%22WorldWideWeb%22.
Pacievitch, Y. (27 de 03 de 2023). infoescola.com. Fonte: infoescola.com:
https://www.infoescola.com/informatica/cascading-style-sheets-css/
Sales, N. (27 de 03 de 2023). warren.com.br. Fonte: warreen.com.br:
https://warren.com.br/magazine/momento-netscape/
Souto, M. (25 de março de 2023). alura.com.br. Fonte: alura.com.br:
https://www.alura.com.br/artigos/o-que-e-front-end-e-back-end
Valinor, R. (03 de 28 de 2023). Remessa Online. Fonte: Remessa Online:
https://www.remessaonline.com.br/blog/web3/#:~:text=O%20que%20%C3%A9
%20a%20web3%3F,intelig%C3%AAncia%20artificial%20e%20tecnologia%20
blockchain.