12. Desafios (Introdução ao Vue.js)

Renan Gabriel
rgblog
Published in
3 min readMay 18, 2020

Nesse post vai conter os desafios para adicionar algumas funcionalidades no nosso Gerador de Memes.

Se você caiu de paraquedas aqui, saiba que esse post faz parte de uma série de tópicos sobre como aprender os conceitos básicos do Vue.js criando um Gerador de Memes.

Desafio — nível VERY EASY

  • Criar memes com o gerador de memes, e postar nos comentários abaixo!
  • Salvar imagem com print (linux: Fn + Shift + Prt Sc)

Desafio — nível EASY

  • Adicionar um input que recebe a url da imagem, e atualiza a imagem na hora;

Desafio — nível EASY

  • Adicionar um input para alterar o tamanho da fonte dos textos, que recebe o valor da fonte. Ex: 30px, 50px, etc.
olokinho meu

Desafio — nível EASY

  • Criar uma opção parecida com a TEXT COLOR para alterar a sombra da descrição do texto do meme, chamado TEXT SHADOW COLOR.

Desafio — nível MEDIUM

  • Criar um checkbox com o texto UPPERCASE que quando for marcado alterar o :style do texto para letras maiúsculas e quando desmarcado alterar para letras minúsculas;
https://vuejs.org/v2/guide/forms.html

Desafio — nível MEDIUM

  • Criar um select para alterar o tipo de fonte utilizada no gerador de meme.
https://vuejs.org/v2/guide/forms.html

Desafio — nível HARD

  • Criar um componente chamado MEME GALLERY, que contém uma galeria de memes, que quando clicado na imagem atualiza o meme atual.
meme-gallery

Desafio — nível HARD

  • Adicionar um botão de DOWNLOAD que realiza o download da imagem do MEME.

Boa sorte!

--

--