DGmike

Amanhã a humilde empresa onde trabalho irá realizar um evento… não “um evento”, mas “o evento”. O CodeShow é o evento mais esperado por amantes de desenvolvimento de websites – designers ou programadores. Eles verão as cobras do desenvolvimento criando uma aplicação web ao vivo. O evento acontecerá aqui no espaço Apas, R. Pio XI, 1200 São Paulo, SP BRA. Facinho de chegar.

Sim, python é um tipo de cobra e também o nome de uma linguagem de programação muito poderosa.

Para quem não sabe, o CodeShow teve sua primeira versão em 2007, quando eu ainda não era funcionário da #visie. Lá, o Diego Eis e o Elcio Ferreira mostraram como fazer um aplicativo web2.0, uma biblioteca online.

Este ano, faremos o novo campus online (diga-se de passagem que o campus online foi o meu segundo projeto em python) com recursos de programação e desenvolvimento ágil. Falaremos como é a parceria entre designer e programador, como é trabalhar em equipe, o que fazer para não ter dores de cabeça. Tudo mostrando, ao vivo, como uma aplicação deve ser montada e publicada.

Funcionará assim: teremos o inicio do projeto, mostrando como a aplicação deve ficar, exibiremos as ferramentas que serão usadas: Git, HTML5, web2py e MongoDB entre outras. Depois faremos uma pausa e iremos para o coffe break – a melhor parte. Conselho: faça um bom networking. Eu entrei na empresa logo após o primeiro CodeShow. Se quiser, vamos bater um papo sobre PHP, Padrões de codificação, python, html5, pagseguro ou é claro, sobre os episódios clássicos do chaves/chapolin. (“Pepe! Já tirei a vela!”).

Logo após o coffe, os programadores irão para uma sala e os designers para outra. Pergunta: Posso estar nas duas salas ao mesmo tempo? Acho que não, mas tente… talvez a força esteja com você. Lá teremos o desenvolvimento em si. Como teremos programadores em apenas uma sala, poderemos não nos importar com termos técnicos que normalmente designers não entenderiam, como “pedra, papel, tesoura, lagarto, spock“.

No final do dia, iremos juntar as duas “equipes” para finalizar o projeto. E então enviar por ftp para o servidor publicar o novo campus online. O evento é um apoio do PagSeguro e demonstraremos, na prática, como implementar essa ferramenta usando python.

No twitter

Para quem quiser, pode acompanhar a hashtag #codeshow para saber o que está acontecendo no evento. Se quiser, fique à vontade para me seguir.

Vocês já devem ter ouvido falar no google charts. Com ele, é possivel criar ótimos gráficos para suas aplicações. Como por exemplo este aqui:

Bastando para isso, colocar uma imagem eu seu site com uma URL específica que você pode configurar facilmente.

Tá, você tem os dados e os converteu em um gráfico do google. E se você quiser um gráfico mais atraente? Talvez como este:

Talvez você não tenha ouvido falar ainda, mas o Open-Flash-Chart é o mesmo que o WordPress usa em sua tela de administração. O código não é tão complicado de entender e você ainda pode passar os parâmetros por URL. Ele também vem com um aplicador em PHP e em JavaScript para que você não se mate fazendo o código Flash que é uma meleca, sempre.

Aprofundando um pouco mais, ainda é possivel substituir o chart do google (para quem não tem javascript na máquina) para o Open-Flash-Chart facil, facil. Basta apenas um getElementById da vida, um replace e pronto você tem o seu chart turbinado. Este é um POST rápido, apenas uma explosão de idéias, então não vou codificar nada. Vou deixar vocês pensando na solução e quando eu precisar, irei desenvolver a solução e postar aqui mesmo

Você provavelmente conhece o tinyurl.com. Uma das maiores utilidades é você passar uma url complicada para alguém. Ele faz um redirecionamento para onde você quiser. Por exemplo, se você tentar acessar http://tinyurl.com/dginspiracao você vai acessar minha página de feeds de layouts para usar como inspiração.

Encripte suas urls com este novo serviço

Até aí nenhuma novidade, o legal é que agora você conta com o serviço do jumbourl.com que é o completo reverso. Ele pega sua url e converte para uma url grandona quase impossível de decorar. Objetivo… hmmmm… o serviço não diz, mas eu vejo como uma forma de passar uma url para alguém que eu não quero que ele veja depois. =D Segurança mesmo.

O serviço ainda conta com uma api bem simples, basta você enviar um get (mandar pelo browser por exemplo) com o comando apiAdd e o parâmetro url. Ou seja, http://jumbourl.com/apiAdd?url=dgmike.com.br Experimente, veja como fica meu blog jumbado.

Vi no Ajaxian que o Firefox 3.1 irá suportar a tag video do html 5. Isso é um grande avanço para nós, que criamos páginas. Como qualquer desenvolvedor Web não vejo a hora de começar a escrever códigos novos e simples que deveriam ter sido inventados muito antes.

Nume viagem maluca pra São Paulo, há um tempo com meu amigo Zamana, nos deparamos com esse CrossFox Firefox. Fã é assim mesmo!

Hoje, para rodar um video nos navegadores você precisa usar uma embed complicada que muitas vezes não conseguimos decorar e precisamos procurar no google como resolver tal problema. E ainda parece que não roda mpeg direito.

<embed
    src="nomedoarquivo.wmv"
    controller="true"
    autoplay="true"
    width="320" height="240"
>

Já com a tag video podemos inserir videos nativamente ao firefox. Navegando um pouco, encontrei que a última versão do WebKit também suporta as tags video e audio, já o Opera suporta apenas a tag video e não a audio. Vale também lembrar que nenhum deles suporta essas funcionalidades por completo. Mas com o que já é suportado, podemos inserir videos facilmente:

<video src="nomedoarquivo.ogg" />

E obviamente, para alterar suas propriedades, o bom e velho CSS vem à calhar.

<video src="nomedoarquivo.ogg" style="width:130px;height:130px" />

Para que o video seja rodado automaticamente basta colocar o atributo autoplay.

<video src="video.ogg" autoplay="autoplay" />

Ainda podemos manipular os videos por meio de javascript, assim.

<script language="JavaScript"><!--
document.getElementsByTagName('video')[0].play()
--></script>

Ou com a jQuery…

<script language="JavaScript"><!--
$('video')[0].play()
--></script>

E se não bastasse, a tag video também pode receber uma lista de videos com o auxilio da tag source.

<video>
  <source src="foo.ogg" type="video/ogg"></source>
  <source src="foo.mov"></source>
</video>

O fato é que vai ficar muito mais simples implementar videos e audios para nossos clientes (ha-ham…) nosos usuários. Pena que o Internet Explorer não roda direito. É simples fazer uma implementação que faça substituir a tag video por uma tag embed, alguém aí se disponibiliza a fazer? Mas como eu gosto de incentivar o usuário a “atualizar-se a um browser de verdade” prefiro fazer o seguinte.

<video src="video.ogg">
Seu navegador não suporta a tag video, por favor mude para o Firefox... 
</video>

Claro que com uma mensagem mais amigável, mas não pretendo escrever o script que fará a gambiarra para o Internet Explorer simplesmente porque penso (lembrando que é minha humilde opinião) que se não dizermos ao usuário Seu internet explorer é um lixo, troque agora! [link para um browser melhor] ele nunca se mecherá para trocar (afinal, pra que trocar se roda tudo que preciso nele?!), mesmo que esse mecher leve-o a chamar alguém que saiba como fazer a troca.

Você ainda pode ver o video demo do pessoal da Mozilla Labs demonstrando que funciona mesmo!

[Nota]

Vale a pena lembrar que a tag source não é suportada por completo ainda e que a tag video e audio apenas suporta o formato ogg. Mas espero que suporte um dia o formato flv para videos e o famoso mp3. Mas, assim que sair a nova versão do Firefox implementarei com certeza essa tag.

Este pos foi escrito ao som de:

• You Should Be Dancing – Bee Gees
• Born To Be Wild – SteppenWolf
• Smoke On The Water – Deep Purple
• Money For Nothing – Dire Straits
• Sheet Child O’ Mine – Guns N’ Roses

Se tem uma pessoa que me ajudou muito nos meus serviços de hoje é o Bruno Torres, um carinha que explicou para o mundo o que eram urls amigáveis e como fazer isso através do .htaccess

Acontece que o Bruno tá muito sumido da web, tem um tempão que ele não posta nada interessante, então o William fez um apelo com base em um vídeo do taligado e cá estou eu ajudando a pedir para que o Bruno volte a blogar, para que a interenet se torna um lugar melhor de se viver!