easync PHP – um framework para manipulação de dados MySQL

agosto 19, 2011

O easync PHP é um framework desenvolvido por mim, Marcel, que gera classes em linguagem PHP, para facilitar a manipulação de dados em tabelas MySQL, criando uma camada de abstração, substituindo o código SQL que é preciso ser escrito sempre que se cria um novo banco de dados.

Em outras palavras, o easync PHP é uma abstração da camada de acesso a dados (DAL – Data Access Layer), que transforma tabelas em objetos PHP (Classes e funções), tornando o código mais limpo e organizado.

Exemplo:

A consulta SQL:

UPDATE cliente SET nome = ‘Jorge’ WHERE id = 2;

É escrita da seguinte forma:


<? 

$cliente EASYNC_cliente::getByPk('2');
$cliente->setNome('Jorge');
$cliente->save();

?>

As classes geradas utilizam o PHPdoc, para fazer uso do mecanismo auto-complete, disponível nos ambientes NetBeans IDE e Eclipse.

Veja mais exemplos abaixo:

Inserindo dados

<? 

$cliente = new EASYNC_cliente(); 
$cliente->setNome('Eduardo'); $cliente->setCPF('01234567890'); 
$cliente->setEmail('cliente@gmail.com'); 
$cliente->setEndereco('rua B casa 10'); 
$cliente->save();

?>

Consulta Executada:

INSERT INTO cliente
(id, nome, cpf, email, endereco)
VALUES
(NULL, ‘Eduardo’, ‘0234567890’, ‘cliente@gmail.com’, ‘rua B casa 10’);

Buscando dados

<?

$busca = new EASYNC__FIND__cliente();
$busca->filterByNome('Eduardo');
$busca->filterByEmail('cliente@gmail.com');
$busca->orderBy(ENTITY_cliente::$COLUMN_nome);
$busca->limit(100); // limitar 100 registros
$colecao $busca->get(); // coleção de objetos encontrados, do tipo 'EASYNC__COLLECTION__cliente'.
// imprime o nome de todos clientes encontrados:
for ($i 0$i $colecao->getAmount(); $i++) {
    
$nome $colecao->getByIndex($i)->getNome();
    echo 
"Cliente encontrado: " $nome;
}
?>

Consulta Executada:

SELECT id
FROM cliente
WHERE nome = ‘Eduardo’
AND email = ‘cliente@gmail.com’
ORDER BY nome
LIMIT 100;

Atualizando dados

<?
$cliente 
EASYNC_cliente::getByPk('2');
$cliente->setNome('Jorge');
$cliente->save();
?>

Consulta Executada:

UPDATE cliente SET nome = ‘Jorge’ WHERE id = 2;

Apagando dados

<?
$cliente 
EASYNC_cliente::getByPk('2');
$cliente->remove();
?>

Consulta Executada:

DELETE FROM cliente WHERE id = 2;

Download do easync PHP v1.0
formato RAR: http://code.google.com/p/easync-php/downloads/list
Subversion: https://easync-php.googlecode.com/svn/branches/

AJAX com SEO

setembro 15, 2010

AJAX não é uma técnica nova. Existe desde quando o Javascript foi inventado, porém nenhum programador web se interessou em implementá-la, talvez pela falta de necessidade na época.

Atualmente o uso da técnica AJAX é bastante utilizado para agilizar as respostas do servidor, por exemplo no serviço de e-mail do Google (Gmail), a maioria das requisições são feitas via AJAX, visando velocidade de carregamento das informações na página.

Recentemente (há 2 ou 3 semanas) percebi que o Youtube também começou a implementação de requisições AJAX em algumas páginas, utilizando o hash da URL (#) para exibir o vídeo solicitado.

Um problema que já está se tornando clássico é: como irei montar uma estrutura de links e diretórios para os motores de busca encontrarem o conteúdo do meu site feito em AJAX?

Estive pesquisando a respeito em artigos que falam da problemática, e não encontrei nenhuma implementação que contorne o problema de forma elegante. O Frank Marcel propõe no artigo Ajax e SEO criar 2 estruturas para um mesmo site, sendo uma em puro AJAX e outra em HTML acessível a buscadores. Esta solução não agrada a nenhum tipo de desenvolvedor web, visto que estamos sempre buscando alternativas para facilitar o desenvolvimento de aplicativos web.

Iniciei então o desenvolvimento de algumas técnicas que contornam este problema. Está em fase protótipo, porém já implementei em alguns sites simples de minha autoria, e estão rodando muito bem em qualquer navegador. A técnica leva em consideração o problema do Javascript não obstrutivo, que consiste em não impedir a navegação do usuário caso ocorra alguma falha de javascript ou o navegador desabilitar o javascript.

A idéia é a seguinte: os links da página que referenciam outros links do próprio site serão links híbridos, que ao ser clicado efetua uma requisição AJAX. Se por algum motivo esta requisição AJAX não puder ser executada, o link abre normalmente sem AJAX, recarregando a página inteira sem problemas. É aí que está a idéia de permitir aos buscadores e web crawlers caminharem pela estrutura de links do site, pois já que estes não executam Javascript, vão seguir os links definidos no atributo href da tag .

Detalhes técnicos:

<!-- URL original da pagina HTML -->
<a href="artigo/meu-artigo.html" target="dajax">abrir</a>

<!-- URL processada pelo PHP -->
<a href="artigo/meu-artigo-sobre-ajax.html" onclick="hashchange('artigo/meu-artigo.html');">abrir</a>

Perceba o atributo target com valor “dajax”. Isto é usado pelo PHP para reescrever este trecho de código que altera o hash da URL (pela função hashchange do javascript).

Terminarei o post amanhã, mas aí vai um exemplo de site que utilizei esta técnica, ainda em fase de testes, o site da Escola Regional de Informática de Mato Grosso

Preloader de imagens em Flash com ActionScript 3.0

outubro 27, 2009
setaLegal Marcel, com contagem regressiva e tudo?

Não, mas vale de tarefa. Estas funcionalidades extras vou deixar para um próximo tutorial. Hoje irei ensinar a criar apenas as funções para capturar o progresso do download da imagem do servidor para o PC do internauta.

setaÉ necessário algum conhecimento prévio?

Conhecimento básico de programação orientada a objetos, e um pouco de Flash CS3 também.

setaBeleza Marcel! então começa aí!

Abra o Flash CS3 (ou o Flash CS4, porém alguns passos do tutorial podem ser diferentes), vá em File -> New… -> Flash File (ActionScript 3.0)

2

Criando novo arquivo Flash

Salve o arquivo com o nome preloader.fla. Selecione o primeiro frame da camada para inserir o código ActionScript:

1

Selecionando o frame

Pressione F9 para abrir a janela de Actions.

Bateu o sono… vou durmir, mas amanha termino o post!

Cantos arredondados com tableless

outubro 25, 2009

setaEae Marcel, blz? o que manda de bom hoje?

Bom galera, vou ensinar passo-a-passo como criar o famoso efeito de cantos arredondados. É necessário conhecimento básico de HTML e CSS.

setaLegal Marcel, então começa aí!

  1. Abra o Fireworks
  2. Crie um novo arquivo com dimensões de 300 x 200 resolução de 72 pixels/inch, fundo branco.
  3. Desenhe um retângulo de aproximadamente 200 x 150 com a ferramenta Recangle Tool;
  4. Selecione o retângulo e coloque em Propriedades -> Rectangle roundness = 20
  5. Deverá ficar parecido com o seguinte:
    img1
  6. Dê um zoom no canto superior esquerdo;
  7. Desenhe com a ferramenta Slice Tool um retângulo sobre este canto, como mostra a imagem abaixo:
    img2
  8. Vá até a aba Layers (caso não esteja vendo, ative-a em Window -> Layers);
  9. setaUm pouco cansativo este tutorial né Marcel ?!
    É sim, mas o resultado é satisfatório 😉
  10. Dentro da aba layers existe uma pasta Web Layer, com um objeto nomeado Slice dentro. este objeto é o recorte que será exportado com formato GIF. Renomeie este objeto para “tl” sem aspas.
  11. tl é abreviatura para top-left em inglês, ou topo-esquerdo. Adotei esta forma de nomenclatura pois sinto mais facilidade em entender abreviaturas em inglês. O mesmo será aplicado para:
    • tr (top-right, ou topo-direito),
    • bl (bottom-left, ou inferior-esquerdo) e
    • br (bottom-right, ou inferior-direito).

  12. Selecione novamente a ferramenta Slice Tool e repita do passo 6 ao 9.
    1. Para o recorte do canto superior direito, nomeie tr;
    2. Para o recorte do canto inferior esquerdo, nomeie bl;
    3. Para o recorte do canto inferior direito, nomeie br;
  13. Precisamos definir o formato dos slices. Para isto, selecione a Web layer como mostra a figura:
    img4
  14. Em properties, selecione Type = Image e abaixo a opção GIF Adaptative 256;
  15. Agora devemos exportar os recortes. Selecione o recorte tl com o botão direito -> Export Selected Slice;

    img3
  16. Crie uma pasta img dentro da pasta que ficará localizado seu arquivo HTML, e salve este recorte dentro desta pasta com o nome tl.gif. Repita estes passos para os outros 3 cantos.
  17. Os recortes estão prontos.

setaNossa, que cansativo Marcel… e o HTML?

Abra seu editor de texto HTML (eu utilizo o Dreamweaver), e insira o seguinte código:

 

<html>
<head>
<title>Cantos arredondados</title>
<style> 
.ca {
	 background-color:#07438C;
	 color:#FFFFFF;
	 width:200px;
}
 .ca .tl {
	 background:url(img/tl.gif) no-repeat;
}
 .ca .tr {
	 background:url(img/tr.gif) no-repeat 100% 0px;
}
 .ca .bl {
	 background:url(img/bl.gif) no-repeat 0px 100%;
}
 .ca .br {
	 background:url(img/br.gif) no-repeat 100% 100%;
	 padding:30px;
}
</style>
</head>
<body>
<div class="ca">
  <div class="tl">
    <div class="tr">
      <div class="bl">
        <div class="br">Lorem ipsum dolor sit amet, consectetur</div>
      </div>
    </div>
  </div>
</div>
</body>
</html>

Salve como ca.html

setaDá pra explicar o que você fez com esse monte de DIVs??

Claro!

O conteúdo dentro de uma tag DIV ocupa 100% da largura disponibilizada para a mesma por padrão, por esse motivo não precisei declarar qual será a largura de cada div.

Criei uma regra chamada ca para indicar o escopo que as regras CSS valem.

setaCerto, e quanto ao controle das imagens do background?

Podemos também declarar qual será a posição da imagem de fundo (background) dentro de uma DIV, além de poder controlar se a imagem irá repetir ou não. Exemplo, na declaração

.ca .tl {
	background:url(img/tl.gif) no-repeat;
}

Eu defino que a imagem não deverá repetir horizontalmente ou verticalmente. Portanto a imagem ficará no canto superior direito por padrão.

Na declaração:

.ca .tr {
	background:url(img/tr.gif) no-repeat 100% 0px;
}

Eu defino que a imagem não deverá repetir, e além disso ela deverá ficar na posição 100% horizontal, ou seja, à direita, e outra regra importante é que se declaramos a posição horizontal do background, devemos declarar também a posição vertical, pois caso contrário a posição vertical ficará como 50% (no meio da DIV), portanto declaro como 0px na vertical, ou seja, no topo da DIV.

Resultado final:
img6

setaLegal Marcel, mas qual a vantagem de usar tableless?

Um código mais limpo e fácil de entender, com regras CSS bem claras e definidas, o layout do seu site pode ser melhor administrado.