Depuração do/Desbugando seu código no Thunkable

Aprenda dicas para depurar/desbugar seu código e corrigir erros no Thunkable

O QUE É DEPURAÇÃO/DESBUGAR?

Depuração é o processo que os programadores usam para descobrir porque seu código não está funcionando e, em seguida, corrigi-lo para que funcione.

O termo depuração veio da almirante Grace Hopper, uma pioneira da computação. Ela estava trabalhando no computador Mark II na Universidade de Harvard na década de 1940 e uma mariposa ficou presa no computador e o impediu de funcionar.

Ao se livrar da mariposa, ela disse que eles estavam "depurando" o sistema. Atualmente, os programadores usam o termo para se referir a "corrigir erros em meu código".

Grace Hopper

DICAS DE PROGRAMAÇÃO

cachorro olhando para o computador

A depuração pode ser, muitas vezes, a parte mais frustrante e demorada do programação, por isso é muito importante reservar bastante tempo para ela!

E também para ser paciente!

PEQUENOS PEDAÇOS

Às vezes, os programadores ficam tentados a programar todo o aplicativo de uma só vez e depois testá-lo.

Não caia nessa tentação!!!

Se algo não funcionar corretamente, o que é provável, é difícil descobrir por onde começar a tentar corrigir o erro. 

pedaços de chocolate

Divida o código do seu aplicativo em pequenas partes. 

Faça uma coisa funcionar antes de começar outra. 

Programe um pouco, teste um pouco, confirme se funciona, então programe um pouco mais, teste um pouco mais etc. 

Por exemplo, se seu aplicativo tiver 5 botões que fazem coisas diferentes,

  1. Programe a ação para o primeiro botão
  2. Em seguida, teste para ter certeza de que está funcionando.
  3. Passe para o segundo botão
  4. Repita.

É melhor corrigir o código em um lugar do que voltar e corrigi-lo em cinco lugares se houver um erro em seu código.

5 botões em um aplicativo

CONTROLE DE VERSÃO

começou como um erro

Digamos que você siga a regra dos "pequenos pedaços" e tenha uma parte do seu aplicativo construída e funcionando.

Você adiciona um novo código e, de repente, tudo para de funcionar. 

OH NÃO!

Você tenta excluir o novo código, mas seu aplicativo ainda não está funcionando. Você não tem certeza do que deu errado e gostaria de ter um botão "desfazer".

Para evitar cenários como esse, você pode salvar versões do seu aplicativo à medida que as partes forem funcionando. 

Dessa forma, se você cometer um erro e não souber como corrigi-lo, poderá voltar à última versão funcional que salvou.

Também é possível usar o controle de versão para experimentar novos recursos sem se preocupar com a quebra do aplicativo em funcionamento.

A versão gratuita do Thunkable tem um limite de 10 projetos, portanto, se você atingir o limite de projetos, poderá excluir as versões mais antigas antes de salvar uma nova. 

Para fazer uma cópia de seu projeto:

  1. clique nos três pontos no canto superior direito da tela
  2. Selecione "Duplicate Project" (Duplicar projeto) no menu suspenso.
  3. Renomeie suas cópias salvas para manter o controle. A numeração v1, v2 funciona bem.
Captura de tela do menu de projetos duplicados do thunkable

COLLAPSE BLOCKS (RECOLHIMENTO DE BLOCOS)

O recolhimento de blocos (Collapsing Blocks) é uma forma de manter seu código organizado, já que o espaço de trabalho do código começa a ficar lotado de blocos.

Se você clicar com o botão direito do mouse em um bloco, verá uma opção para "collapse" (recolher).

Para expandir seus blocos novamente, clique com o botão direito do mouse sobre eles e selecione Expand Block (Expandir Bloco).

a tela abre o bloco que está sendo recolhido
expansão do bloco recolhido

Os blocos recolhidos serão reduzidos a uma barra na tela.

Eles continuam funcionando da mesma forma que os blocos normais, mas ocupam menos espaço. Isso pode ser útil se você tiver blocos que não precisa mais editar e quiser limpar a tela

collapsed block (bloco recolhido)

DESATIVAR BLOCOS

Você também pode desativar os blocos.

Eles permanecem na sua tela, mas não são executados no aplicativo.

Com os blocos desativados, você pode testar seu aplicativo sem determinados blocos de código. Você pode ativá-los mais tarde e eles serão executados.

Você também pode desativar os blocos que usou apenas para testes, como os alertas.

bloco de alerta desativado

O simples fato de arrastar blocos para fora de um bloco manipulador de eventos os desabilitará e impedirá que sejam executados. Como eles não fazem parte de nenhum evento, não há como serem executados. Eles aparecerão em cinza. Você sempre pode colocá-los de volta para ativá-los novamente.

COMENTÁRIOS

Os programadores geralmente deixam comentários em seu código para explicar o que ele faz. 

Os comentários podem ser úteis quando outras pessoas estiverem analisando o seu código, como colegas de equipe, mentores(as) e juízes.

Os comentários também podem ajudar caso você retorne ao seu código mais tarde e tenha esquecido o que partes dele fazem.

Para adicionar um comentário, clique com o botão direito do mouse nos blocos e selecione "Add Comment" (Adicionar comentário).

Depois disso, um ponto de interrogação aparecerá no canto do bloco e você poderá adicionar texto. Você pode visualizar o comentário clicando no ponto de interrogação.

caixa de comentários acima do bloco de código

Melhores práticas: Os comentários são a coisa mais útil na programação.

Já houve muitas ocasiões em que um programador programou algo e depois foi dormir e voltou na manhã seguinte sem ter ideia do que estava fazendo na noite anterior. Sempre escreva comentários!

It’s also a great way to check your knowledge, because if your coding blocks are easy to comment on then you must understand them really well! Another thing to be aware of is that <, >, =, ≤, ≥ are hard for students for the first time (and for programmers who are years into their careers). When we set a math statement to < when it should be ≤ this is called an “off by one” error and this is a problem that happens to developers with 20 years of experience 😛 It is a very popular problem so be on the lookout for that. 

O melhor tipo de depuração é a depuração com patos de borracha! É quando você está realmente presa em seu código e ele não faz sentido. Você quer tirar um tempo para conversar com outra pessoa para ver se ela consegue identificar o problema, mas, infelizmente, não há ninguém por perto! Então, você tem um pato de borracha de confiança na sua mesa e explica o problema em voz alta para o seu amigo pato. Você precisa fazer isso em termos muito simples para que ele entenda e, depois disso, você mesma encontrará o problema! Todos os meus colegas de trabalho têm patos de borracha em suas mesas e fazem isso com frequência!

Perguntas orientadoras para fazer a estudantes: Quanto tempo você acha que os programadores experientes levam para depurar bugs? Seria de se esperar que eles fossem muito rápidos nisso, mas todos os grandes sites têm páginas dedicadas a ver por quanto tempo os bugs existem(Facebook, por exemplo) e também mostram se alguma de suas páginas está fora do ar/quebrada e se eles estão fazendo a depuração no momento(exemplo do Facebook).

Como você encontra bugs? (muitos e muitos testes!) Quantos testes você acha que deve fazer? Quanto teste você deve pedir para outras pessoas fazerem?

Como você sabe quando encontrou um bug? Às vezes, você pode passar uma eternidade clicando em uma imagem e perceber que o botão em que deveria estar clicando está embaixo da imagem. Isso é um bug? É uma escolha de design que o fabricante do aplicativo fez e ele não acha que seja um bug, mas você pode achar que é.

As dicas são fornecidas com o apoio do AmeriCorps.

A estilizado, logotipo da AmeriCorps em azul-marinho

DICAS DE DEPURAÇÃO

ALERTAS E RÓTULOS/IDENTIFICADORES

Você pode usar componentes, como Alertas e Rótulos, para exibir informações durante o teste. Depois de testar completamente o aplicativo, você pode simplesmente removê-los

Você adiciona um Alerta na janela Blocos, clicando no sinal + ao lado de Alerts (Alertas) na Palette (Paleta).

código para alertas

Defina a Mensagem de alerta (Alert Message) para as informações que você deseja rastrear. 

Em seguida, use Alert.Show em seu código para exibir quando um evento ocorrer.

Além das mensagens, você pode exibir informações como o valor de uma variável ou a posição de um sprite.

Você também pode adicionar Labels (Rótulos/Identificadores) para exibir informações atuais em seu aplicativo. 

Por exemplo, você pode querer saber o valor de uma variável à medida que determinados eventos acontecem enquanto o aplicativo está em execução. 

Você pode definir o Label.Text para o que quiser saber e ele será exibido no seu aplicativo. 

Depois de depurar o erro, você pode tornar o rótulo/identificador invisível ou excluí-lo completamente do aplicativo.

USAR DADOS DE TESTE

Se você tiver muitas informações para usar em seu aplicativo, pode ser útil usar dados de teste. Os dados de teste são um conjunto de dados mais simples e menor que você pode usar para garantir que seu aplicativo esteja funcionando corretamente.

Digamos que você esteja criando um aplicativo que exibe restaurantes próximos. Você está usando o Google Tabelas para armazenar as informações do restaurante.

Você pode começar com apenas um ou dois restaurantes de teste e testar seu aplicativo para ter certeza de que ele funciona.

Quando estiver testado e funcionando, você poderá adicionar o conjunto completo de dados do restaurante à sua planilha do Google.

ALTERAR PROPRIEDADES

Se estiver testando o aplicativo em tempo real, você poderá alterar o valor de uma propriedade no Designer enquanto executa o aplicativo e ver seus efeitos.

Às vezes, isso pode ajudar a descobrir um problema.

Por exemplo, você pode estar acessando programação um jogo. A posição de um sprite não parece correta no seu telefone quando ele está em execução.

Durante o teste ao vivo, você pode

  1. Ir para o Designer
  2. alterar os valores X e Y do Sprite
  3. A posição do sprite na tela do aplicativo em execução será alterada. 

Use-o para testar e entender as coordenadas na tela.

jogo com sprites

ATIVIDADE 1: CONSERTE O BUG

Tempo estimado: 20 minutos

Correção de erros no aplicativo de Temporizador

Isso Aplicativo de Temporizador tem alguns bugs.

  1. Copie o projeto.
  2. Visualize o aplicativo para executá-lo.
  3. Try pressing Start without typing anything into the textbox. What happens?
  4. Tente inserir 0 ou um número negativo para o número de segundos. O que acontece?
  5. Corrija os erros usando blocos condicionais!

ATIVIDADE 2: ADICIONE UM COMENTÁRIO

Tempo estimado: 10 minutos

Adicione um comentário ao seu projeto Thunkable

Se você tiver iniciado seu aplicativo final para o Technovation, use-o para esta atividade. Caso contrário, use o aplicativo DE Temporizador da Atividade 1.

Adicione pelo menos um comentário ao seu aplicativo explicando o que um grupo de blocos faz. Escolha um grupo de blocos que considere mais difícil de entender, pois esses blocos provavelmente seriam os mais difíceis de serem entendidos por outra pessoa, como um membro da equipe.

REFLEXÃO

Essas dicas podem ajudá-la quando você começar a programar o aplicativo para o Technovation.

Mas lembre-se...

Foto cedida pela DKJS Franziska Schmitt
programação não é fácil.
É bem provável que seu aplicativo não funcione perfeitamente no início!
Programe em pequenas partes.
Comemore quando você conseguir que uma pequena parte do seu aplicativo funcione.
Faça pausas! Às vezes, o simples fato de se afastar do computador por alguns minutos pode lhe dar a perspectiva nova de que você precisa.

REVISÃO DOS PRINCIPAIS TERMOS

  • Depuração - o processo que os programadores usam para descobrir porque seu código não está funcionando e corrigi-lo
  • Controle de versão - salvar versões de trabalho de seu aplicativo à medida que você avança
  • Dados de teste - um conjunto mais simples de dados que você pode usar para garantir que seu aplicativo esteja funcionando corretamente
  • Comentários -texto que é incluído no código para explicar o que ele faz

RECURSOS ADICIONAIS

Aqui estão mais alguns recursos de depuração do Thunkable.