Tecnologias

AJAX

Front-end

AJAX

AJAX

O que é o AJAX?

AJAX é um acrônimo que significa Asynchronous JavaScript and XML, e descreve um conjunto de técnicas de desenvolvimento usadas para construir sites e aplicativos da web. De acordo com o desenvolvedor web e instrutor do Skillcrush WordPress, Ann Cascarano, a melhor maneira de entender o AJAX é começar identificando sua finalidade específica no processo de desenvolvimento web. A principal função do AJAX é atualizar o conteúdo da web de forma assíncrona (o A de AJAX), o que significa que o navegador da Web de um usuário não precisa recarregar uma página da web inteira quando apenas uma pequena parte do conteúdo da página precisa ser alterada.

Um dos exemplos mais onipresentes de atualização assíncrona é o recurso Google Suggest do Google. Quando você insere uma consulta de pesquisa na barra de pesquisa do Google, e o site do Google começa a oferecer automaticamente opções de preenchimento automático enquanto você digita, esse é o AJAX em ação. O conteúdo da página muda (nesse caso, as opções de preenchimento automático na barra de pesquisa) sem precisar atualizar manualmente a página (algo que tornaria o Google Suggest impraticável). Recursos como o Google Suggest são uma parte fundamental da navegação na Web contemporânea, o que indica a importância do AJAX no desenvolvimento da web. Além do Google Suggest, Cascarano diz que o AJAX é comumente usado para atualizar recursos como barras de status e notificação, formulários on-line, seções de comentários e pesquisas e enquetes. Mas o que exatamente são os “J” e “X” do AJAX e como eles possibilitam a atualização assíncrona?

JavaScript e XML

Como mencionado acima, o J em AJAX significa JavaScript. O JavaScript é um tipo de linguagem de script - as linguagens de codificação são usadas para automatizar os processos do website, de modo que os desenvolvedores da Web não precisam programar individualmente cada instância do processo que aparece em uma página. No caso do JavaScript, é usado especificamente para criar, adicionar e gerenciar conteúdo dinâmico do website. Em outras palavras, depois que linguagens de marcação como HTML e CSS são usadas para criar e exibir recursos da Web estáticos (cabeçalhos, fontes, parágrafos, etc.), o JavaScript é usado para controlar recursos que exigem atualizações em tempo real enquanto um visitante está visualizando uma página (pense em mapas interativos, gráficos animados, rolagem de vídeo, jukeboxes, etc). Como o JavaScript está no negócio de atualizar o conteúdo da página sem exigir que os espectadores recarreguem manualmente páginas inteiras, ele é um componente essencial para a atualização assíncrona do AJAX.

O X no AJAX é XML (Extensible Markup Language). Como o próprio nome sugere, o XML é uma linguagem de marcação, o que significa que está na mesma família de linguagens como HTML e CSS. As linguagens de marcação são linguagens de codificação usadas para anotar partes de um documento da Web com o objetivo de fornecer instruções aos navegadores da Web sobre como entender, processar e exibir uma página da Web, em comparação com o texto real a ser exibido na página. Enquanto HTML e CSS se concentram em instruir como o conteúdo da página é exibido (parágrafos, cabeçalhos, fontes, cores, etc.), o XML é usado para transferir dados armazenados na página para os navegadores que o visualizam. Sistemas de computadores individuais geralmente são incompatíveis entre si e não conseguem entender ou interagir com dados formatados por um sistema diferente. XML permite que os desenvolvedores contornem esse obstáculo, armazenando dados em formato de texto simples entre tags XML. Ao fazer isso, o XML oferece uma maneira de armazenar, mover e compartilhar dados que não dependem de um determinado software ou sistema de hardware (algo crucial para a Internet, onde os dados precisam estar disponíveis e compreensíveis em todas as plataformas de software e hardware ). Os feeds RSS - feeds da Web de assinatura que permitem que os usuários acessem conteúdo de blogs e fontes de notícias à medida que são atualizados em tempo real - são criados com XML e são um exemplo dos recursos práticos de compartilhamento de dados do idioma. Mas como o XML combina com o JavaScript para formar o AJAX?

Como o AJAX funciona?

De acordo com Cascarano, JavaScript e XML se combinam para fazer a atualização assíncrona acontecer através do uso de algo chamado objeto XMLHttpRequest. Quando um usuário visita uma página da Web projetada para fazer uso do AJAX e um evento prescrito ocorre (o usuário carrega a página, clica em um botão, preenche um formulário, etc.) JavaScript cria um objeto XMLHttpRequest, que transfere dados em um XML formato entre um navegador da Web (o programa que está sendo usado para exibir o site) e um servidor da Web (o software ou hardware em que os dados de um site são armazenados). O objeto XMLHttpRequest envia uma solicitação de dados de página atualizados para o servidor web, o servidor processa a solicitação, uma resposta é criada no servidor e enviada de volta para o navegador, que usa JavaScript para processar a resposta e exibi-la na tela como conteúdo atualizado.

Para recapitular: o JavaScript automatiza o processo de atualização, a solicitação de conteúdo atualizado é formatada em XML para torná-lo universalmente compreensível e o JavaScript é acionado novamente para atualizar o conteúdo relevante para o usuário que está visualizando a página. Cascarano observa que a técnica AJAX ignora dados de páginas estranhas e lida apenas com solicitações de informações atualizadas e com as informações atualizadas em si. Este é realmente o coração da eficácia do AJAX, fazendo sites e aplicativos que usam o AJAX mais rápido e com maior capacidade de resposta para os usuários.

Como você pode aprender AJAX?

Embora os detalhes das linguagens JavaScript e de marcação sejam, provavelmente, melhor aprendidos por meio de aulas on-line ou presenciais, Cascarano diz que colocar essas habilidades juntas e dominar a técnica AJAX pode ser feito facilmente através de tutoriais on-line. Os recursos da Web com o tutorial AJAX gratuito incluem, mas não se limitam a, Udacity, jQuery, Webucator e Code School. Lembre-se, se você já aprendeu JavaScript, HTML e XML, ou mesmo se você está atualmente no processo de aprendizado, o AJAX é simplesmente um método de reunir essas habilidades que podem ser obtidas ao longo de horas, ao contrário para um conjunto de habilidades totalmente novo. E quando se trata de conseguir empregos para desenvolvedores web, Cascarano diz que vale a pena investir nessas horas e se adaptar à técnica AJAX. Apesar de não ser uma habilidade autônoma, o AJAX é uma técnica que é tão universal e fundamental para o desenvolvimento do front-end que, a qualquer momento em que você passar a se familiarizar com ele, o retorno será exponencial. No momento em que escrevo, há quase 5.000 listagens de empregos no Glassdoor que explicitamente citam o conhecimento do AJAX como um requisito, e quase 93.000 trabalhos de desenvolvedor de front end em geral, todos os quais darão boas vindas à fluência do AJAX.