Thunkable — Criando Aplicativos sem código

Published in

Code Prestige

5 min readDec 15, 2018

Quem nos acompanha já sabe somos grandes defensores da educação e temos um enorme prazer em ajudar as pessoas a ingressar na área de tecnologia.

Afinal, há casamento melhor do que educação e tecnologia para transformar o nosso país e o mundo?

Entretanto, programar não é uma tarefa fácil, e pode desanimar quem está começando (eu mesmo já quebrei a cara várias vezes, e continuo quebrando). É para afastar esse sentimento de impotência que eu gostaria de apresentar neste artigo, o Thunkable, uma plataforma online e gratuita que nos permite desenvolver aplicativos mobile (Android e iOS) através de blocos lógicos.

Vamos dar uma olhada em como tudo isso funciona.

Versão em Vídeo

Além das instruções que serão dadas aqui no artigo, você também pode conferir a nossa versão em vídeo!

Não se esqueça de se inscrever no nosso canal!

Blocos o quê?

Se você já trabalha na área de tecnologia (seja no front-end, back-end, devops), sabe que o aspecto mais importante para conseguir trabalhar com programação — para qualquer linguagem — é a lógica de programação. Em termos simples, a lógica é a maneira como desenvolvemos o passo a passo do nosso algoritmo que resolverá um problema específico.

Os blocos lógicos basicamente são uma abstração dessa lógica. Ao invés de ter que escrever o código correspondente, o bloco lógico faz isso por debaixo dos panos. Cada bloco representa uma ação específica e o usuário vai ligando estes blocos para montar um algoritmo completo. Ainda parece complicado? Não se preocupe; não é.

Hello World — Primeiro aplicativo

O primeiro passo é entrar no site do Thunkable e se cadastrar. Feito isso, clique no botão “Create New App” para criamos um projeto do zero. Ao clicar, um modal abrirá. No campo disponível, insira qual é o nome do seu projeto. Ao fazer isso, você cairá nesta tela:

Página principal da área de trabalho do Thunkable

Antes que você se assuste com a quantidade de informações na tela, vamos avaliar cada um dos quadros. Do lado esquerdo, temos a aba de tutoriais. Ela é excelente para entendermos o funcionamento básico da plataforma e criar nossos primeiros aplicativos. Recomendo que você os acesse depois de ler este artigo.

No quadro seguinte, temos duas abas: Design e Blocks. Na primeira aba é onde encontraremos todos os elementos visuais que podemos colocar dentro da tela do nosso aplicativo (representado no quadro seguinte). Por exemplo, vamos adicionar um botão (o primeiro elemento). Para isso, basta arrastar e soltar.

Repare que agora o último quadro (extrema direita) foi alterado. Este é o quadro de propriedades. Ele altera de acordo com o elemento selecionado na tela. Veja que no botão temos uma série de propriedades que podemos mexer: nome, fonte, tamanho, posição, etc.

Agora, vamos inserir uma interação a este botão com os blocos lógicos. Para isso, entre na aba Blocks. Ao abrir, você irá se deparar com uma boa quantidade de menus. Procure pela opção Button1.

Estas são todos os blocos de ações correspondentes ao nosso botão. Veja que o primeiro bloco diz: “Quando Button1 for clicado, faça…” e então há um espaço em vazio. Selecione este bloco e coloque na área de trabalho.

Entre novamente no menu e procure pelo bloco “From Button1 set Text to”. Encaixe-o no bloco anterior e altere as aspas vazias para algum texto. Eu por exemplo, coloquei o texto “Fui clicado!”. Deve ficar desta maneira:

Inserindo uma lógica simples no botão do aplicativo

Agora, para testar nosso aplicativo, vamos conectar o nosso celular à plataforma.

Testando no aparelho

Aqui há duas maneiras de testar o aplicativo. A primeira é clicando no botão “Download” e baixando o aplicativo compilado para a sua máquina. Então, você o transfere para o celular e consegue testá-lo.

A outra maneira é através do que eles chamam de Thunkable Live. Este modo permite fazer o live preview diretamente no celular. É bem fácil e prático.

Baixe o aplicativo do Thunkable Live no seu celular. Agora, basta acessar o aplicativo e logar com a mesma conta que você utilizou na versão web. Ao fazer isso, o aplicativo irá fazer o vínculo e puxará os aplicativos vinculados para o seu celular. Feito isso, é só testar.

Se tudo der certo, você conseguirá testar seus aplicativos diretamente!

Testando o botão diretamente no aparelho através do Thunkable Live

Conclusão

Para quem está começando na área de programação mas quer criar seus aplicativos mobile (ou ao menos para fazer um protótipo rápido), o Thunkable é uma ótima alternativa. Os blocos lógicos são uma abstração fácil de entender e a interface do programa torna tudo muito intuitivo. Claro que não recomendo a solução para aplicativos corporativos. Para isso há tecnologias mais adequadas, como as soluções nativas ou o React Native, Google Flutter e Xamarin.

Referências

Gostou? Recomende 👏 este artigo e acompanhe nossa publicação para não perder os próximos artigos!

Siga nossa publicação e não perca os próximos artigos! http://www.codeprestige.com.br • Facebook, Twitter, Youtube
Siga o autor deste artigo e troque uma ideia com ele! http://www.diegopinho.com.br • Twitter, LinkedIn

Aprenda mais com nossos cursos de programação online!

ECMAScript 6 • ECMAScript 7 e 8 • React 16 • VS Code • + Mais