Sou programador e filmei (sem ensaio, sem cortes) minha rotina de trabalho. Este vídeo mostra como se faz para modificar um programa.
O programa em questão é o MoneyLog (aurelio.net/moneylog), um sistema de acompanhamento financeiro simples, que funciona direto no navegador.
Eu levei cerca de 25 minutos para alterar seu código (Javascript e HTML), a tarefa foi adicionar uma língua nova (catalão) ao programa. O vídeo mostra todo o processo: a edição dos códigos, o teste no navegador, o uso de opções bacanas do editor TextMate e no final o envio das alterações para o servidor SVN no Google Code (code.google.com/p/moneylog-dev/source/detail?r=126).
No meio aconteceu o inevitável: erros, bugs. Tive que resolvê-los na hora, e foi legal ser registrado no vídeo, pois isso também faz parte da rotina de programação.
Este vídeo é uma experiência, o início de algo que eu ainda não sei o que é.
Deixe um comentário e me diga o que achou!
Se preferir, use o twitter: twitter.com/oreio
Nota: A continuação deste vídeo está em vimeo.com/11716694
Roteiro (espere o vídeo carregar):
0:55 - O eterno problema das aspas. Elas SEMPRE incomodam!
1:40 - O terminal nunca morre.
2:18 - TextMate: Command-{ para mover o bloco para a esquerda.
2:53 - Mudando o idioma no config.js.
3:28 - BUG: Em catalão, não mostrou os dados nem as tags.
4:10 - Pescando menus nos Opera…
4:41 - Procurei a linha 1596 no arquivo errado, era pra ser no moneylog.js.
5:00 - Olha a linha 1596 ali! E eu nem vi… Acabei acertando sem querer.
5:34 - Chutando: coloquei o DIV novo no HTML pra ver se funciona.
5:55 - Não funcionou.
6:19 - Linha 510 - Dessa vez achei rápido o erro (msgLoading).
6:42 - TextMate: Command-F2 (ou clique) marca a linha. F2 pula até ela.
7:16 - Testando mais uma vez. Agora apareceu as tags no rodapé pelo menos.
7:36 - Linha 353 - Tava na cara o dateFormat e eu não vi…
8:06 - Fui mexer na data padrão, mas quando vi o showLocaleDate deu o clique.
9:05 - Testando de novo e agora funcionou! Viva!
9:36 - Comparando lista de nomes com expressões regulares e diff.
9:55 - "tudo o que vem depois do DOIS-PONTOS" (errei a fala).
10:18 - TextMate: ordena linhas com F5.
10:44 - Textmate: Control-Shift-Comand-D para comparar dois arquivos (diff).
11:33 - TextMate: Command-E para usar o texto na pesquisa, Command-G para buscar.
11:56 - Avisando no twitter sobre a gravação do vídeo.
12:35 - Agora vou colocar o texto de ajuda (help).
12:59 - SILÊNCIO. Enquanto isso, no pensamento: Droga! Não era pra apertar essa tecla, eu não queria mostrar meu Desktop no vídeo. E agora? Paro o vídeo? Depois corto e emendo? Mas tem o relógio ali em cima, vai aparecer. Droga, droga. Dane-se, agora já foi, depois eu vejo o que eu faço… Vamo lá.
13:20 - Trecho muuuuuuito chato editando HTML, colocando tags, um saco.
14:29 - TextMate: Control-Shift-W para colocar um {tag}…{/tag} em volta do texto.
14:40 - TextMate: Control-Shift-Command-W para colocar um {tag}…{/tag} em cada linha do texto.
16:55 - "Vamos ver como ficou", mas mudei de ideia sem perceber e continuei editando :)
17:40 - TextMate: Option-Command-. para fechar uma tag HTML aberta.
18:52 - Help em catalão agora está OK.
19:36 - TextMate: Shift-Command-↓ move a linha para baixo e Command-Enter para quebrar a linha (sem precisar ir ao fim dela).
20:03 - SVN na linha de comando. Deu branco, pensa, pensa… Não lembrei do bendito -m.
20:13 - TextMate: Abre pasta, clica arquivo, Control-Shift-A para comandos SVN.
20:32 - Conferindo todas as mudanças no código (diff colorido).
21:18 - Outro trecho chato e demorado só porque esqueci do comando svn log… Patetando no Google pra tentar achar o endereço do SVN.
21:52 - CEGO! Tá ali já no 1º resultado, moneylog-dev!
22:47 - Galera do twitter, digam oi!
23:20 - Ufa! Gelei quando vi a mensagem de "read-only". Só faltava essa no meio do vídeo :)
23:39 - Finalmente escrevendo a mensagem que resume as mudanças (changelog).
25:00 - Commit.
25:12 - SVN no Google Code, última atualização foi em agosto de 2009.
25:30 - Conferência final e resumo das mudanças (diff colorido).