O mercado de tecnologia da informação tem buscado profissionais capazes de analisar criticamente o ambiente de desenvolvimento web, com visão orientada para qualidade e melhoria de processos. Atento a esse cenário, o Centro Universitário Senac lança a pós-graduação Engenharia Web, a primeira dessa categoria no Estado de São Paulo. Duas unidades, Senac Lapa Tito e Senac Santo André, vão oferecer o curso no próximo ano, capacitando em 366 horas interessados em planejar e coordenar projetos nesse segmento.

“Definida como o uso sistemático da engenharia no desenvolvimento, na implantação e manutenção de aplicações web de alta complexidade, trata-se de uma nova área do conhecimento, ainda pouco explorada. No Brasil, percebe-se que esse trabalho representa uma parte significativa da produção de empresas de softwares”, comenta Richard Martelli, técnico da área de tecnologia da informação do Senac São Paulo. Além dessas organizações, o engenheiro web pode atuar em instituições de comércio eletrônico, de design, de publicidade, portais de conteúdo, comunidades virtuais, bem como órgãos governamentais e ONGs.

Apesar de fortemente baseado na engenharia de software, o curso apresenta como diferencial ao aluno o tratamento multidisciplinar, tendo como público-alvo é formado por profissionais de análise de sistemas, ciências da computação, sistemas de informação, engenharia de software, web design e mídias interativas, além de pessoas que já atuam na área e desejam uma compreensão mais abrangente.

Mais informações podem ser obtidas em www.sp.senac.br ou diretamente no Senac Lapa Tito e Senac Santo André.

Outro dia, um grande amigo me perguntou como fazia para automatizar o teste do Javascript desenvolvido em vários browsers. Para ser bem sincero, eu não utilizo nada além de vários browsers diferentes instalados em cada uma das minhas máquinas (virtuais ou não), cada uma com um sistema operacional diferente  (Ubuntu 10.10 e 11.04 , Windows XP, Vista e 7 e carente de um Mac por enquanto…).

Realmente, mesmo usando o Synergy e uma boa configuração de rede local, ainda fica um pouco trabalhoso… Então resolvi pesquisar algumas ferramentas que poderiam ajudar nessa árdua tarefa, e creio que muitos vão agradecer pelas dicas e até colaborar com dezenas de outras nos comentários. Nem todas visam automatizar o teste em escala, mas todas vão facilitar alguma fase dos testes para que seus projetos tenham um excelente resultado

BrowserShots

Essa ferramenta vai mostrar pra você como seu site irá “renderizar” em diversos browsers diferentes, sem que você os tenha instalado, permitindo que você identifique problemas de compatibilidade mais rapidamente (principalmente se você se valeu de javascript para trabalhar estilos/css)

ScriptCover

Recém-lançado pelo Google, essa ferramenta fornece estatísticas de cobertura de código linha-a-linha, permitindo que você analise (em tempo real até) quantas vezes uma determinada instrução foi executada durante o uso da página. Essa extensão do Chrome funciona desde o instante inicial de carregamento da página e continua enquanto o site vai sendo utilizado, sem atrapalhar o usuário. Excelente  também para debugar códigos complexos, que porventura venham a falhar misteriosamente em algum browser específico (para não dizer logo I.E.).

js-test-driver

Esse framework permitirá que você trabalhe na filosofia TDD (Test Driven Development), integrando-o a sua IDE (Eclipse, por exemplo) para automatizar a execução dos testes tão logo você modifique os arquivos do projeto. Exige uma preparação dos cases de teste, mas já que estamos falando de TDD, isso não será o problema. Confira nesse post a apresentação na época de lançamento onde é demonstrada a praticidade do mesmo.

QUnit, a filosofia jQuery também nos testes

QUnit é um poderoso framework de Unit Test que o ajuda a depurar o código. É escrito por membros da equipe de jQuery, e é o conjunto de testes oficial para este famoso framework. Ele é também o suficiente para testar qualquer código JavaScript regular, e é ainda capaz de testar Javascript server-side, através de algum mecanismo de JavaScript como Rhino ou V8.

Jasmine

Não, você não vai contratar uma estagiária chamada Jasmine para fazer o le-rê-le-rê de abrir páginas e págians em todas as máquinas do seu escritório. É um framework BDD, Behaviour Driven Development, ou seja, desenvolvimento orientado a comportamento. Para quem acha o TDD coisa do passado.

W3C Validator

Não menospreze-o. Alguns acham cafona, outros, nem sequer ouviram falar. Mas pense: se o código está de acordo com Standards, a chance de renderizar igual na maior parte dos browsers também é maior! E também, pode ser um excelente atalho para encontrar algum problema misterioso que não consta nos consoles.

Firebug

Apesar de usar o Chrome a maior parte do tempo, ainda acho a versão Firefox da extensão de desenvolvimento web mais prática e rápida para ajudar no debug, teste e inclusive no desenvolvimento (quem nunca desenvolveu uma linha de código javascript direto no console pra depois copiar e colar no código-fonte que atire o primeiro mouse!)

E você, usa alguma outar ferramenta para facilitar o testes Javascript? Por favor, ajude-nos!

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…

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

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!

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

Confiram mais detalhes no Artigo, no iMasters.

Encontrei esse projeto através do LinkedIn. Incrível, o autor consegue gerar um ambiente animado, onde você pode interagir com outros elementos, o cenário tem profundidade, e você pode guiar seu personagem através desse ambiente, usando o teclado, para qualquer direção. Até aí normal, porém, ele fez tudo usando apenas Javascript, sem nenhum Flash sequer. Ver essa audácia me relembrou a época em que desenvolvi um game 2d em Java, na faculdade, o K-Libre99, totalmente do zero.

O mais bacana é que ele demonstra que podemos sim ter coisas complexas feitas na web, com Javascript (que é nativo de qualquer browser hoje em dia), sem depender de plugins externos, como o Flash. Realmente, um trabalho excelente, demonstrando que a web não é dependente de Flash para criar experiências de usuário dinâmicas. Confira mais em http://www.geektestbox.com/devfiles/mdunham/brookside_beta/

Hoje o Twitter lançou um novo recurso:  Hovercards. A idéia é simples, como podemos notar pelo nome (hover, do evento do mouse; card, de cartão): mostrar a informação do usuário quando você colocar o mouse em cima de seu nick (por exemplo, quando alguém dá um tweet @fulano mandando uma resposta direta a ele), como um cartão de visita. É bem prático, pois permite que você saiba um pouco mais das pessoas com quem seus seguidos se relacionam, expandindo suas possibilidades de contatos. Excelente para ajudar a filtrar indivíduos relevantes para você seguir! Ele permite ter uma visão de cartão expandido, mostrando ainda mais informação. Também é possível enviar mensagens direto dele.

Mais legal ainda: ele permite que você siga a pessoa ali mesmo, sem necessidade de trocar de página. Também vai mostrar o status, caso você já o siga. A meu ver, uma ótima ação dos desenvolvedores do Twitter, otimizando não só a experiência do usuário, mas também o desempenho de seus serviços (isso com certeza vai diminuir a carga dos servidores web do Twitter). Não vai demorar muito para ver esse conceito pipocar em outras redes e aplicativos sociais agora…

Porém, é um recurso que não vai aparecer para todos usuários de uma única vez. Será implantando ao poucos (que mania que essas redes sociais tem de fazer suspense com as funcionalidades…) Fique atento, mais cedo ou mais tarde, você verá!

E esta maioria está a poucos passos de galgar um degrau a mais: tornar-se superior à soma de todas as demais opções – ao menos no que diz respeito ao conjunto dos sites indexados pelo Google.

Consta que o Google vai promover uma festa quando a marca de 50% for ultrapassada. E como a tendência está bem clara no gráfico, não deve demorar. (via h-online.com)

Bom, se houver mesmo uma festa, eu gostaria de ir, mas… será que essa festa será uma festa normal?!?!?

De qualquer forma, é um acontecimento que devemos comemorar (profissionais da web), pois é um grande avanço rumo a um trabalho melhor, menos dependente de monopólios, mais colaborativa ainda! Como muitos leitores já sabem, quando se trabalha com dados oriundos da Web, já é uma briga conseguir extrair tudo num formato decente para seu banco de dados. Quando ainda temos que lidar com vários conjuntos de caracteres diferentes, quando é tão simples usar um único conjunto. Recomendo, caso você trabalhe com Python, a biblioteca BeautifulSoup, que fará a maior parte do esforço para você lidar com aquelas páginas que insistem em não usar o Unicode. Aliás, segue aqui um ótimo artigo para quem quer falar a mesma língua com a maioria do mundo: Tudo sobre Python e Unicode

Cheers!