jQuery: história, uso prático e como ainda é essencial em 2025
Palavras-chave: jQuery, jQuery UI, AJAX, aplicativo com jQuery, PHP e banco de dados, criar app com jQuery, manutenção de sites jQuery
O que é jQuery
O jQuery é uma biblioteca JavaScript criada em 2006 por John Resig com o objetivo de simplificar a manipulação do DOM, eventos, animações e requisições AJAX. Sua famosa frase de apresentação era “Write less, do more” — escreva menos e faça mais.
Antes do jQuery, trabalhar com JavaScript puro significava lidar com diferenças entre navegadores e muito código repetitivo. O jQuery tornou o desenvolvimento web mais rápido, padronizado e acessível a todos os desenvolvedores.
Como usar o jQuery
Para começar a usar o jQuery, basta adicionar a biblioteca no seu site. A forma mais simples é via CDN:
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("Olá, jQuery!");
});
});
</script>
<button>Clique aqui</button>
Esse código exibe um alerta quando o usuário clica no botão. É a forma clássica de iniciar o uso do jQuery.
Uso assíncrono com AJAX
Uma das grandes forças do jQuery sempre foi o uso de chamadas assíncronas, conhecidas como AJAX (Asynchronous JavaScript and XML). Veja um exemplo simples de como obter dados de um servidor PHP:
<script>
$.ajax({
url: "dados.php",
type: "GET",
dataType: "json",
success: function(resposta){
$("#resultado").html("Nome: " + resposta.nome + " | Idade: " + resposta.idade);
},
error: function(){
alert("Erro ao conectar com o servidor!");
}
});
</script>
<div id="resultado"></div>
O jQuery simplifica muito o uso do AJAX, permitindo lidar com requisições sem precisar escrever muito código.
jQuery UI: interface rica com poucos comandos
O jQuery UI é uma extensão oficial do jQuery que oferece componentes de interface prontos, como calendários, sliders, caixas de diálogo e efeitos visuais. É ideal para quem deseja adicionar interatividade de forma rápida.
Exemplo com jQuery UI:
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<input type="text" id="calendario">
<script>
$(function(){
$("#calendario").datepicker();
});
</script>
O resultado é um campo de data com seletor visual, sem necessidade de código complexo.
Por que o jQuery ainda é importante
Mesmo com a ascensão de frameworks modernos como React, Vue e Angular, ainda existem milhares de sites que utilizam jQuery. Muitos deles precisam de manutenção e atualização para continuar funcionando bem e com segurança.
Manter sites antigos é uma oportunidade de trabalho para desenvolvedores que ainda dominam o jQuery e entendem sua integração com sistemas PHP e bancos de dados legados.
jQuery em aplicativos mobile
O jQuery também pode ser utilizado em aplicativos móveis híbridos — aqueles criados com tecnologias web (HTML, CSS e JavaScript) e empacotados como apps nativos por meio de ferramentas como Apache Cordova ou PhoneGap.
Essas ferramentas permitem usar jQuery para interagir com o banco de dados via PHP e exibir dados em tempo real.
Exemplo de aplicativo com jQuery + PHP + MySQL
Imagine um aplicativo de cadastro de usuários. Ele se conecta a um servidor PHP e utiliza MySQL como banco de dados.
1. Estrutura do aplicativo (HTML + jQuery)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Cadastro de Usuário</title>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
<h2>Cadastrar Usuário</h2>
<input type="text" id="nome" placeholder="Nome">
<input type="text" id="email" placeholder="E-mail">
<button id="enviar">Cadastrar</button>
<div id="resposta"></div>
<script>
$("#enviar").click(function(){
$.ajax({
url: "https://seuservidor.com/cadastrar.php",
type: "POST",
data: { nome: $("#nome").val(), email: $("#email").val() },
success: function(retorno){
$("#resposta").html(retorno);
},
error: function(){
alert("Erro ao conectar ao servidor!");
}
});
});
</script>
</body>
</html>
2. Código do servidor (cadastrar.php)
<?php
$conn = new mysqli("localhost", "usuario", "senha", "banco");
$nome = $_POST['nome'];
$email = $_POST['email'];
$sql = "INSERT INTO usuarios (nome, email) VALUES ('$nome', '$email')";
if($conn->query($sql)){
echo "Usuário cadastrado com sucesso!";
} else {
echo "Erro ao cadastrar.";
}
?>
3. Publicando na Play Store
Para publicar esse app na Play Store:
- Use o Cordova ou Capacitor para empacotar o projeto web como APK.
- Teste o app em um dispositivo Android.
- Crie uma conta de desenvolvedor no Google Play Console.
- Envie o APK e adicione título, descrição e imagens.
- Após a revisão, o app será publicado na loja.
Conclusão
Mesmo com novas tecnologias, o jQuery continua relevante em 2025. Ele é leve, rápido e ainda move uma grande parte da web. Saber usar jQuery — e entender como ele se integra com PHP e bancos de dados — é uma habilidade valiosa tanto para manutenção de sistemas quanto para criação de aplicativos híbridos.
Gostou do artigo? Compartilhe e continue aprendendo sobre desenvolvimento web moderno e compatibilidade entre tecnologias!
Comentários
Postar um comentário