Qual webdeveloper nunca usou jQuery? Muito difícil… Bom, mas vamos falar de algo que nem todos os developers que usam jQuery se atentam ao programar. Eu mesmo fui pego hoje por um gap que me tomou alguns minutos da tarde…

Algumas funções (na verdade, a maioria nesse framework) recebem outras funções como callback, aquela função que será chamada assim que a instrução/função chamada acabar seu procedimento. Um exemplo muito utilizado em aplicações reais são as

Funções Ajax

load( url, data, callback )
Returns: jQuery. Load HTML from a remote file and inject it into the DOM.

jQuery.get( url, data, callback, type )
Returns: XMLHttpRequest. Load a remote page using an HTTP GET request.

jQuery.getJSON( url, data, callback )
Returns: XMLHttpRequest. Load JSON data using an HTTP GET request.

Ao usar a função load, você carrega um arquivo remoto (seja ele html puro ou um arquivo dinâmico, como PHP ou outra linguagem), mas o tempo que ele leva para ser processado nem sempre é igual. E se você precisa esperar que o conteúdo seja totalmente carregado antes de proceder com o script?Colocar um timeout? No way, uma vez que você não tem controle sobre o tempo de execução em todas as plataformas e clientes… Logo, o Callback está aí para sanar essa questão.

Porém…

Temos que tomar cuidado ao usar o Callback, uma vez que o desempenho dos sistemas ainda podem afetar a funcionalidade de seu código, e fazer você perder várias horas de seu precioso descanso…Veja esse trecho de código que trabalhei recentemente:

jQuery().ready(function() {
   jQuery.getJSON('/php/data.drafts.php?l=10&f=json', function(data){
      jQuery.each(data, function(i, item){
         jQuery('#latestDraftsTable tbody').append('<tr><td>'+item.id+'</td><td>' + item.title + '</td><td>' + item.date+ '</td></tr>');
      });
   });
   jQuery('#latestDraftsTable').tablesorter({widgets: ['zebra']});
);

Alguém consegue perceber o erro, ou melhor, a Zebra? Muito difícil. Mas ao rodar o código, não acontecia o esperado: que minha tabela apresentasse o comportamento de uma tabela ordenável que o jQuery UI tablesorter plugin proporciona (ou seja, deu Zebra e não ocorreu a Zebra). Aí eu descobri o problema: a penúltima linha do código nem estava sendo executada… Seriam Gaps de performance?

Diferentes paradigmas

Fosse uma linguagem das antigas qualquer, onde o paradigma procedural imperava, esse código não teria problema, pois cada instrução só seria disparada ao final da anterior. No Javascript, a coisa não é bem assim, ainda mais quando se trata de AJAX -Assynchronous Jacascript and XML – uma requisição que é disparada e outra estrutura interna fica encarregada de processar os resultados quando eles chegarem. Ao efetuar a função getJSON, a requisição é disparada, e já passamos para a próxima linha (onde eu chamo o tablesorter na tabela), porém, não deu tempo da requisição JSON retornar e popular a tabela. Resultado: minha tabela fica populada mas não fica ordenável.

Graças a um amigo developer fera em JS, eu consegui perceber isso e reordenaro código de maneira que ele funcionasse como o esperado:

Código corrigido

jQuery().ready(function() {
   jQuery.getJSON('/php/data.drafts.php?l=10&f=json', function(data){
      jQuery.each(data, function(i, item){
         jQuery('#latestDraftsTable tbody').append('<tr><td>'+item.id+'</td><td>' + item.title + '</td><td>' + item.date+ '</td></tr>');
      });
      jQuery('#latestDraftsTable').tablesorter({widgets: ['zebra']});
   });
);

Assim, o tablesorter vai ocorrer dentro do callback, logo após ter terminado de ser populada a tabela. Na realidade, os callbacks foram feitos exatamente para situações como essa: quando a coisa vai demorar um pouco e você não tem certeza do quanto…

Primeiro trailer completo de A Rede Social (The Social Network), filme sobre a história do Facebook dirigido por David Fincher. O filme estréia em Outubro nos EUA. O que esperar depois do lançamento? Sinto cheiro de muitas requisições de empresas querendo melhor exposição social na mídia, através de campanhas e aplicativos sociais. Principalmente agora que o cenário da Internet Brasileira parece ter enxergado o Facebook de verdade.

Mas eu já percebi (e provavelmente você também) porque muitos usuários estão finalmente migrando do Orkut para o Facebook (e a equipe do Orkut também, visto as mudanças corridas que andam fazendo ultimamente): O Facebook é muito mais rápido que o seu rival.

Lembro até de campanhas internas para lembrar alguns desenvolvedores que o IE deveria estar instalado em suas máquinas para entrar no esquema de testes. Espero que o IE6 não esteja mais na maioria das máquinas, como acontecia também (afinal, ter um IE6 em sua máquina é um risco considerável…).

Como disse a editoria de Tecnologia do IG, a IBM adotou o browser por sua veia OpenSource (uma quebra de rotina dessas só poderia partir mesmo do braço livre da empresa), por ter melhor suporte para extensões (aqui com certeza os desenvolvedores quem bateram o pé) e a meu ver, principalmente por ser mais customizável (e assim, a gigante poder ter um melhor controle das ferramentas utilizadas por seus colaboradores, como recursos). Claro, podemos esperar outros motivos ainda, afinal, empresas desse porte nunca fazem mudanças globais sem antes calcular minuciosamente o quanto poderão economizar/ganhar com uma ação dessas. Talvez vejamos em alguns meses alguma nova ferramenta interna sendo vendida globalmente, baseada na tecnologia do browser.

Mas claro, quem conhece, sabe que os benefícios de adotar um browser mais robusto são muito bem vindos, seja sua empresa pequena ou gigante.

Confira mais no iG – Tecnologia

Análise de Investimentos

Minerando opiniões sobre as Eleições

A maior novidade é que já criei também um conjunto para analisar as Eleições 2010, ou melhor, analisar as opiniões sobre os presidenciáveis num conjunto de blogs, portais e no Twitter. Serra e Dilma já estão sendo minerados pelo sistema, que vai medir o feeling das postagens relacionadas em diversos sites nacionais, blogs diversos e também citações no Twitter. Claro, essa nova investida vai demandar uma série de atualizações no sistema, muitas delas já planejadas desde o ano passado, mas também algumas que vão surgir nesse novo período. Certamente, mudanças esperadas no ciclo de evolução de um sistema dinâmico na Webesfera.

E nesse ponto, as críticas e dicas dos usuários serão muito importantes! Como nunca, aguardo comentários, críticas e sugestões de todos que utilizarem e avaliarem o opSys, para deixá-lo sempre melhor. Confira agora mesmo: http://www.opsys.com.br

Novidades chegando

Nesse momento, já temos algumas pessoas com habilidades distintas colocando seus skills para funcionar, arquitetando mudanças para o opSys, que o tornaram mais fácil de navegar e “consumir”. Designers, Arquitetos da informação, marketeiros… Logo logo, poderão conferir mais novidades! Aguardem!

Meu amigo Marcelo Honório traduziu um artigo muito interessnte, que expressa bem o que nós, profissionais do código, sentimos muitas vezes ao longo de nossas carreiras: Dez coisas que mais irritam os desenvolvedores (Claro, muitos podem listar ainda mais… mas essas 10 já resumem bem boa parte delas).

Confira o artigo e comente qual você acha o pior, e caso discorde, por favor, explique porque uma coisa dessas pode não te irritar…

Quem acompanha o blog sabe que esporadicamente posto links para podcasts de assuntos relacionados a THLopes. E aqui está mais: o Nerdcast de hoje, cujo tema é Profissão: Programador. Como este que vos escreve atua nessa profissão, recomendo ouvir esse excelente podcast para fechar sua sexta-feira. Boas risadas e descobertas!

Em Abril, participei de um projeto onde precisamos montar um ambiente de trabalho bem bacana, envolvendo tecnologia de Cloud Computing, como o Google App Engine (GAE). Não é uma tarefa difícil, na verdade, relativamente fácil de fazer, mas resolvi documentar aqui para diminuir o trabalho ainda mais de pessoas que procuram uma solução para iniciar seus projetos, ou de quem acabou de pegar uma máquina zerada e quer montar um cockpit de desenvolvimento.

A seguir, a breve lista do que vamos precisar:

• Python
• Google App Engine SDK
• Eclipse IDE (Recomendo a versão “For PHP Developers, que já vem com Web Tools Platform, que será útil em outros projetos)
• PyDev
• Subclipse
• Aptana Studio

Claro, você pode alternar versões ou usar apenas o Aptana Studio invés do Eclipse, mas eu optei pelo Eclipse para poder usar em outras situações.

Python e GAE

Vamos lançar as bases de nosso ambiente. Começando pela linguagem de nossa escolha, o Python, que dependendo da distruição de seu sistema operacional, já estará instalado (O Ubuntu, por exemplo, já vem com python pronto pra uso). Se quiser testar se já está pronto, abra uma linha de comando (shell) e execute o comando:

thomas@thlopes:~$ python

Você deverá ter uma resposta como esta, ou bem parecida, no caso do windows:

Python 2.5.2 (r252:60911, Jan 20 2010, 23:16:55)
[GCC 4.3.2] on linux2
Type "help", "copyright", "credits" or "license" for more information.
>>>

Significa que a linguagem já está pronta para uso no seu sistema. Caso não tenha o programa instalado, basta baixar em http://www.python.org/download/, e instalar em sua máquina. No Windows, será necessário configurar a variável de Ambiente Path para que o executável do Python possa ser executado de qualquer localização no sistema.

Nosso próximo passo é instalar o Google App Engine SDK. Primeiramente, baixe os pacotes de acordo com sua distribuição em http://code.google.com/appengine/downloads.html. No Linux, basta você descompactar numa pasta onde você recorde futuramente (geralmente, crio uma pasta geral para arquivos de libraries diversas que utilizo em diversos projetos: /home/thomas/workspaces/libraries). Depois de extraído, você terá uma estrutura como esta:

Para assegurar que o GAE está pronto para funcionar em sua máquina, vamos rodar um exemplo que vem no próprio pacote. Ao ser indagado se o Server deve procurar por updates, responda com Y/N:

thomas@thlopes:~$ cd workspace/libraries/google_appengine/
thomas@thlopes:~/workspace/libraries/google_appengine$ ./dev_appserver.py demos/guestbook/.

INFO     2010-05-03 14:23:59,698 appengine_rpc.py:159] Server: appengine.google.com
Allow dev_appserver to check for updates on startup? (Y/n): Y

Depois de checar pelos updates ele vai mostrar o seguinte:

INFO     2010-05-03 14:25:13,339 dev_appserver_main.py:407] Running application guestbook on port 8080: http://localhost:8080

Isso quer dizer que o servidor de testes está pronto para rodar em http://localhost:8080. Não feche esse terminal, pois isso fará com que o servidor de testes seja fechado também. Copie e cole no seu browser:

Você verá um formulário, poste alguma coisa para testar o funcionamento. Se verificar na janela de terminal, verá que ele mostra um output do log do mesmo, para debug. Pronto, segu GAE está pronto para ser usado. Há uma pasta chamada new_project_template que mostra os arquivos básicos que todo app no GAE deve conter. Você também pode seguir os tutoriais da própria documentação para se situar melhor com ese SDK.

Eclipse IDE/SDK

Agora vamos para o próximo passo, instalar nosso Eclipse. Aqui praticamente não há segredos: Tanto No Linux quanto no Windows, você pode baixar um pacote que já vem com o Eclipse pronto para uso, bastando descompactar em alguma pasta. No Linux você ainda tem a opção de instalar via gerenciador de pacotes, caso prefira. Mas eu recomendo baixar o último pacote no site de downloads (/http://www.eclipse.org/downloads/), pois geralmente as versões nos repositórios padrão são um tanto quanto defasadas. Descompacte tudo numa pasta de sua preferência, por exemplo, /home/thomas/eclipse. Após descompactado, você pode criar atalhos para a área de trabalho ou onde quiser (inclusive, um ícone já vem no pacote para Linux, para  você customizar o link). Pronto, você tem uma suíte robusta e pronta para desenvolver diversos tipos de projetos, em uma infinidade de linguagens. Eclipse é uma suíte modular, com muitos plugins desenvolvidos, de execelente qualidade, inclusive, um deles é o nosso próximo passo. Execute o Eclipse. Ao executá-lo, ele vai perguntar onde você quer definir seu workspace padrão. O meu, gosto de manter assim: /home/thomas/workspace, mas você pode escolher qualquer lugar de preferência. Só pra situar os que nunca usaram o Eclipse: Workspace é o lugar onde você vai criar as pastas dos seus projetos. Como eu trabalho com diversos níveis de projetos (trabalho, pessoal, estudos, etc), eu crio subníveis, por exemplo: /home/thomas/wokspaces/work  e /home/thomas/workspaces/personal, etc… Escolha a vontade!

PyDev

Estamos quase terminando, agora vamos instalar um plugin que vai facilitar nosso trabalho com tudo isso que instalamos e vamos utilizar ao longo de nosso dia-a-dia de trabalho. PyDev é o plugin que você precisa para desenvolver projetos em Python, sejam eles web ou não. Ele já vem com facilitadores para trabalhar com projetos em Django também. Para obter  mesmo, basta visitar http://www.pydev.org/download.html, onde você pode fazer o download do mesmo, ou optar pela instalação mais fácil e rápida. Procure por Quick Install na página, e encontrarás as instruções para instalar como plugin pelo próprio Eclipse:

Vá para o  update manager (Menu Help > Install New Software), e adicione a seguinte  fonte: http://pydev.org/updates

Depois é só seguir os passos na tela, instalando apenas a primeira opção (PyDev > PyDev for Eclipse). Depois de instalar tudo, reinicie o Eclipse. Se você brincar um pouco nele agora verá que já temos novas opções de novos projetos, perspectivas e uma série de outras coisas interessantes.

SVN com Subclipse

Continuando, vamos instalar um plugin que vai nos ajudar com as tarefas de SVN. Não vamos explicar muito sobre SVN, vamos supor que você leitor, já está familiarizado com essa ferramenta de versionamento. Porém, caso não, há diversos tutoriais na internet onde você pode aprender um pouco mais sobre essa ferramenta. Voltando, basta entrar no site para encontrar referência de como instalar o Subclipse no seu Eclipse: http://subclipse.tigris.org/servlets/ProjectProcess?pageID=p4wYuA . Na página, procure pelo cabeçalho Installation Instructions, e você verá o passo-a-passo básico de como instalar o plugin. Para a versão que instalamos de Eclipse, o Subclipse 1.6.x é o correto. Expanda o itens, e marque os sub-itens listados abaixo (apenas os required):

• Subclipse (Required)
• Subversion Client Adapter (Required)
• Subversion JavaHL Native Library Adapter (Required)

Depois de instalar tudo, reinicie o Eclipse novamente. Se você estiver no Linux/Gnome, e ver uma mensagem alertando sobre um bug relacionado ao Keyring, apenas dê Ok e prossiga. Vamos verificar se está tudo ok, Indo no menu File > New… > Project , depois expanda o item SVN, e cheque se há o item Checkout Projects from SVN.

Se você já tiver algum projeto no SVN, agora é a hora de tentar puxá-lo para sua máquina. Caso ocorra um erro informando que a biblioteca JavaHL não está instalada corretamente, instale o seguinte pacote via gerenciador do sistema (Linix/Gnome).

thomas@thlopes:~$ sudo apt-get install libsvn-java

Caso tenha esse mesmo problema em outros sistemas, verifique nesse Link:  http://subclipse.tigris.org/wiki/JavaHL e nese outro aqui: http://islandlinux.org/howto/installing-javahl-subclipseeclipse-ubuntu. Particularmente, só notei esse problema na versão 8.10 do Ubuntu. Depois de garantir que o Subclipse está instalado corretamente, podemos prosseguir com a parte final de nosso tutorial.

Aptana Studio

Instalar o Apta Studio para Eclipse agora vai ser fácil, mesmo processo de instalar os plugins acima, porém um pouco mais demorado pelo tamanho desse plugin que vai lhe permitir usar alguns facilitadores para desenvolvimento Web. Acesse http://www.aptana.org/studio/plugin e obtenha o endereço para configurar uma nova fonte de plugins para o Eclipse: http://download.aptana.org/tools/studio/plugin/install/studio. Basta seguir as instruções do próprio site, mas resumindo, adicione como fonte e selecione o único item que vai surgir para instalar: Aptana Studio. Prossiga os passos como nas instalações anteriores. Talvez demore um pouco, dependendo de sua conexão. Agora é a hora de levantar da cadeira, dar aquela espreguiçada, tomar um cafezinho, e se preparar para já começar a desenvolver!

Após esse passo, você já terá um Eclipse bem diferente do padrão, com diversas opções, pronto para trabalhar com o Google App Engine, e com muitos recursos para facilitar o desenvolvimento Web. Agora, é só fazer bom proveito desse canhão!!!

Criando um projeto

Para começar, é muito fácil. Basta criar um novo projeto em File > New > Project… > PyDev > PyDev Google App Engine Project, informar os parâmetros que ele mesmo vai pedir, para linkar a biblioteca do Google App Egine, e pronto, seu projeto estará pronto para ser trabalhado.

Para rodar sua versão local e fazer os testes/debug, basta configurar o projeto para rodar como uma aplicação GAE pelo próprio PyDev. Clique com o botão direito sobre o Projeto no Package explorer, selecione Run As > PyDev: Google App Run (Se não aparecer sobre o projeto, tente sobre a pasta src do mesmo). Pronto, seu projeto vai estar rodando no http://localhost:8080/, igual quando rodamos com a linha de comando mais acima.

Mãos a obra!

É isso pessoal, já temos nosso ambiente pronto para arregaçar as mangas e começar a codificar! Em breve mando mais dicas de como personalizar o ambiente e turbiná-lo para outros tipos de projetos! Agradecimentos ao Maurício Lima e todo o pessoal da Crowds and Clouds!

Discordo da definição do Firefox, mas concordo com todas as demais! Via UOL Tecnologia

Com esse título (e com esse logo), poderiamos começar uma novela. Mas estamos falando de outra novela: a da migração de banco de dados MySQL para Cassandra. Depois do Twitter, agora é o Digg quem decidiu migrar suas bases de dados para esse banco com um nome bem interessante.

Cassandra é um banco de dados pós-relacional. Mas como esse termo não é muito conhecido, utilizaremos o termo NoSQL. Um repositório de dados leve, feito em Java, similar aos famosos CouchDB (outro projeto que, assim como o Cassandra, é incubado na Apache Incubator) e BigTable, utilizando ferramentas similares ao Hadoop (coincidência? Mais um projeto incubado na Apache) e conceitos como MapReduce (para bancos distribuídos). Agora vem o fato mais curioso: Esse projeto foi inicialmente desenvolvido pelo Facebook, e foi aberto (open source) em 2008. Mais uma rede social, crescendo e migrando para bases não-relacionais. Que ironia: justamente as redes sociais, onde as relações são muito valiosas.

Apesar do ganho no desempenho, sei que esse tipo de transição é muito “dolorosa”. Esses tipos de banco de dados não-relacionais realmente podem dar um nó no cérebro dos desenvolvedores. É muito complicado viver sem os joins depois de algum tempo trabalhando com eles.

Segundo os engenheiros do Twitter, precisavam de um banco de dados escalável que “crescesse sozinho”. Realmente, imaginar monstros como Twitter – que cresceu mais de 20 vezes em menos de um ano, alcançado a marca de 50 milhões de Tweets diários – e do Digg (onde muitos usuários compartilham notícias e comentários o tempo todo) e seus dba’s brigando todos os dias para conter a bomba do MySQL, enxertando cada vez mais hardware para que não exploda na cara dos usuários. Nessa hora, é questão de escolha: onde vamos quebrar a cabeça para resolver o problema? Os desenvolvedores decidem.

“O Comitê Técnico de Implementação Software Livre – CISL promoverá a palestra técnica sobre FrameWARks PHP – Cake, Zend, Code Igniter, Symfony, que será realizada segunda-feira, 15/03/2010, das 15h às 17h (horário de Brasília), no auditório da regional Salvador e transmitido por videoconferência no auditório da Sede do Serpro.

Programa: Com fundo de pano “militar”, “bélico”, quatro desenvolvedores PHP tentam defender seu framework. Numa das maiores batalhas já vistas nas comunidades de desenvolvimento PHP, eles apontam vantagens de seu framework e desvantagens dos outros. Com final surpreendente! A atividade será transmitida pela Internet, através do serviço Assiste – Vídeo Streaming Livre do Serpro. Para acompanhar, acesse: http://streaming.serpro.gov.br/cisl/ ou clique no webbanner da palestra. Palestrantes: Marcio Lima Albuquerque, Leonardo Thomas Torres Santos, Marcelo Curi da Silva e Sandro de Carvalho Franco Mais informações: cisl@serpro.gov.br”

Eu, particularmente, prefiro o CakePHP,  pela similaridade com o Django, em Python. Mas já dei uma olhada no Code Igniter, e me pareceu muito bom, principalmente por ser ainda mais fácil de iniciar seu uso. Bom, vamos assistir e ver se conseguem me convencer de algo diferente!

Encontrei no site da BBC, esse incrível TreeMap (pra quem não sabe, é um gráfico que permite visualizar grandes quantidades de dados em um espaço pequeno, de uma forma bem condensada) mostrando uma ‘fotografia’ que representaria nossa internet, através de uma pesquisa com os Top 100 Sites. Realizada pelo grupo Nielsen, como parte do projeto SuperPower, uma temporada de programas explorando o poder da Internet.

Cada conjunto de quadrados da mesma família de cores representa um dos sites daquela categoria. Por exemplo, em Busca e Portais, o maior grupo, temos 5 grandes sites disputando terreno na lista. Já em Vídeo, temos apenas, ou seja, apenas um grande site dessa categoria entrou no Top 100.

Visitando o site da BBC, você pode interagir melhor com o gráfico, e visualizar detalhes de cada categoria.