Platzi
Platzi

Aproveite nosso plano de lançamento!

Antes: R$ 499,00
R$ 349,00
Currency
Antes: R$ 499,00
Economize: R$ 150,00
COMPRAR
Termina em: 11D : 19H : 15M : 43S

Desenvolver programas de computador. Quarto projeto: FizzBuzz

Boas-vindas e Introdução

1

Bem-vindo ao curso e apresentação do professor

2

Criando sua primeira linha de código

3

Adicionando um pouco de teoria

4

Vis√£o geral do curso

5

Preparando o ambiente

Conceitos básicos de programação para web

6

O que é HTML, CSS e JS?

7

Primeiros passos com a função alert no navegador

8

HTML, CSS e JS de verdade

Primeiro projeto: Peso em outro planeta

9

Entendendo o problema

10

Calculando um peso em outro planeta

11

Obtendo os dados do usu√°rio

12

Utilizando fluxos condicionais

Segundo projeto: Trabalhando com Canvas

13

Entendendo o problema

14

Entendendo os principais objetos em um navegador

15

Trabalhando com window e document

16

Trabalhando com DOM

17

Fun√ß√Ķes em Javascript

18

Eventos e Formul√°rios em HTML e JS

19

Detectando eventos do teclado

20

Rabiscando o canvas com as setas do teclado

Terceiro projeto: Fazenda Platzi

21

Entendendo o problema

22

Fun√ß√Ķes matem√°ticas e n√ļmeros aleat√≥rios em JS

23

Trabalhando com ciclos (while e for)

24

Carregando imagens ao canvas

25

Carregando imagens ao canvas de forma aleatória

Quarto projeto: FizzBuzz

26

Entendendo o problema

27

Finalizando o projeto do FizzBuzz

28

Divisão, módulo e resto em Javascript

29

Codificando um FizzBuzz

Quinto projeto: √Ālbum de figurinhas

30

Entendendo o problema

31

Entendendo as cole√ß√Ķes (Arrays)

32

Classes e objetos em Javascript

33

Analisando todas as figurinhas

Sexto projeto: Cliente e Servidor

34

Entendendo o problema

35

Modelo Cliente/Servidor

36

Instalando Node.JS e o framework express.js

37

Detalhes de instalação para o Windows e Mac

38

Criando seu primeiro código de servidor com express.js

39

Criando uma API para descobrir as horas

40

Conclus√£o

Aulas ao vivo

41

Sessão ao vivo: o que você vai aprender no curso

Você ainda não tem acesso a esta aula

Crie uma conta e continue vendo este curso

Analisando todas as figurinhas

33/41
Recursos

Contribui√ß√Ķes 9

Perguntas 1

Ordenar por:

As contribui√ß√Ķes, perguntas e respostas s√£o vitais para aprender em comunidade. Registre-se ou fa√ßa login para participar .

muito legal esse projeto, nunca mais vou precisar comprar figurinha da copa kkk

consegui kkk mds to aprendendo muito!!

top

O meu quando mostra no navegador a imagem e as informa√ß√Ķes das jogadoras as informa√ß√Ķes aparecem como ‚ÄúNaN‚ÄĚ.

class Figura{

    constructor(nome, pais, posicao, urlImagem){
        this.nome = nome;
        this.pais = pais;
        this.posicao = posicao;
        this.imagem =  new Image(320, 400);
        this.imagem.src = urlImagem;

    }

    falar(){
        alert("Meu nome é: " + this.nome);
    }
    exibir(){
        document.body.appendChild(this.imagem);
        document.write("Nome: ", + this.nome + "<br>");
        document.write("País: ", + this.pais + "<br>");
        document.write("Posição: ", + this.posicao + "<br>");
    }
}

var figura = new Figura(‚ÄúPriscila‚ÄĚ, ‚ÄúBrasil‚ÄĚ, ‚ÄúGoleira‚ÄĚ, ‚Äúdebinha.jpg‚ÄĚ);

figura.exibir();


Aprendendo muito com este curso. S2

show

Pra evitar ficar repetindo o document.blablabla (DRY kkk) eu usei uma feature recente do ECMAScript, os template literals

<code>
class Figura {

    constructor(nome, pais, posicao, urlImagem) {
        this.nome = nome;
        this.pais = pais;
        this.posicao = posicao;

        this.imagem = new Image(320, 400);
        this.imagem.src = urlImagem;
    }

    falar() {
        alert("Meu nome é: " + this.nome);
    }

    exibirFigurinha() {
        document.body.appendChild(this.imagem);
        document.write(`<br>
        Nome: ${this.nome} <br> 
        Posição: ${this.posicao} <br>
        País: ${this.pais} <br>
        `);
    }
}

Conte√ļdo sensacional!

Que massa!