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.

Inserindo um botão no aplicativo

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.

Tela de blocos lógicos do Thunkable

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.brFacebook, 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 6ECMAScript 7 e 8React 16VS Code+ Mais

Code Prestige

Artigos, notícias e dicas sobre o melhor da tecnologia

Diego Martins de Pinho

Written by

Desenvolvedor de Software, Fundador da CodePrestige e autor do livro ECMAScript 6 - Entre de cabeça no futuro do JavaScript

Code Prestige

Artigos, notícias e dicas sobre o melhor da tecnologia

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade