├── 00-introducao-ao-curso
├── README.md
└── test-ambiente.js
├── 01-iniciando-com-javascript
├── README.md
└── demo-01-variaveis.js
├── 02-tipos-de-dados-pt-01
├── README.md
├── demo-02-strings-e-numbers.js
└── demo-03-operadores.js
├── 03-tipos-de-dados-pt-02
├── README.md
├── demo-04-comentarios.js
├── demo-05-undefined-e-null.js
├── demo-06-booleanos.js
├── demo-07-listas.js
└── demo-08-objetos.js
├── 04-tipos-de-dados-pt-03
├── README.md
├── demo-09-object-get-set.js
├── demo-10-objetos-globais.js
├── demo-11-date.js
├── demo-12-functions.js
├── demo-13-formas-funcoes.js
└── demo-14-classes.js
├── 05-controlando-o-fluxo-de-dados
├── README.md
├── demo-15-if-else.js
├── demo-16-switch-case.js
├── demo-17-while-do.js
└── demo-18-for-forin-forof.js
├── 06-modulos-em-javascript
├── README.md
├── modulo-browser
│ ├── index.html
│ ├── main.js
│ └── matematica.js
└── modulo-nodejs
│ ├── main.js
│ └── matematica.js
├── 07-ciclo-de-vida-javascript
├── README.md
├── arq1.txt
├── arq2.txt
├── arq3.txt
├── demo-18-callbacks.js
├── demo-19-promises.js
├── demo-20-async-await.js
└── final.txt
├── README.md
└── memory-game
├── README.md
├── arquivos
├── batman.svg
├── frank.svg
├── groot.svg
├── mulhermaravilha.svg
└── padrao.svg
├── assets
└── favicon.ico
├── index.html
├── index.js
└── src
├── jogoDaMemoria.js
├── tela.js
└── util.js
/00-introducao-ao-curso/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Introdução ao curso
2 | Objetivos e desafios...
3 |
4 | ----
5 | ## 🎓 Aprendizados
6 |
7 | ### Javascript
8 |
9 | - Variáveis
10 | - Tipos de dados
11 | - Funções
12 | - Operadores
13 | - Condicionais
14 | - Classes
15 |
16 | ### Manipulação de listas
17 |
18 | - For
19 | - Foreach
20 | - ForIn
21 | - Map
22 | - Find
23 |
24 | ### Modularização
25 |
26 | - Dividindo responsabilidades via Módulos
27 |
28 | ### Sincronia de funções Javascript
29 |
30 | - Callbacks
31 | - Promises
32 |
33 | ### Projeto final
34 |
35 | - Usando todos os conecitos aprendidos no curso
36 |
37 | ### Como executar arquivos JS pelo VSCode?
38 |
39 | - Digite no terminal `node` + o nome do arquivo ex: `node test-ambiente.js`
--------------------------------------------------------------------------------
/00-introducao-ao-curso/test-ambiente.js:
--------------------------------------------------------------------------------
1 | console.log('Olá mundo!!!')
--------------------------------------------------------------------------------
/01-iniciando-com-javascript/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Iniciando com Javascript
2 | O objetivo dessa aula é instalar o Node.js, aprender sobre variáveis e tipos de dados.
3 | ----
4 |
5 | ## 🎓 Aprendizados
6 |
7 | - [x] Introdução ao capítulo
8 | - [x] Instalação e configuração
9 | - [x] Instalando o VSCode e Node.js no Ubuntu
10 | - [x] Instalando o VSCode e Node.js no Windows
11 | - [x] Guardando informações em variáveis
12 | - [x] Demostração: Guardando informações em variáveis
13 | - [x] [Diferença entre var, let e const](#var-let-const)
14 | - [x] Variáveis
15 |
16 | ---
17 |
18 | ### Palavras reservadas que não podem ser usadas como nome de variáveis
19 |
20 | - `class`
21 | - `function`
22 |
23 | ### Como saber o que pode usar e o que não pode?
24 |
25 | Através da lista disponibilizada no [W3Schools](https://www.w3schools.com/js/js_reserved.asp), que você consegue conferir aqui também:
26 |
27 | | abstract | arguments | await* | boolean |
28 | |-----------|:-------------:|--------------:|----------:|
29 | | break | byte | case | catch |
30 | | char | class* | const | continue |
31 | | debugger | default | delete | do |
32 | | double | else | enum* | eval |
33 | | export* | extends* | false | final |
34 | | finally | float | for | function |
35 | | goto | if | implements | import* |
36 | | in | instanceof | int | interface |
37 | | let* | long | native | new |
38 | | null | package | private | protected |
39 | | public | return | short | static |
40 | | super* | switch | synchronized | this |
41 | | throw | throws | transient | true |
42 | | try | typeof | var | void |
43 | | volatile | while | with | yield |
44 |
45 | ---
46 |
47 |
48 | ## Diferença entre var, let e const
49 |
50 | - `var` não se deve usar mais, pelo fato de você não saber o comportamento dele, acabar declarando novamente e etc
51 | - `let` usa para valores que podem ser alterados por exemplo: `let contador = 0; contador = contador + 1`
52 | - `const` são valores que nunca se altera
53 |
54 |
--------------------------------------------------------------------------------
/01-iniciando-com-javascript/demo-01-variaveis.js:
--------------------------------------------------------------------------------
1 | let nome = 'Super man'
2 | let idade = 100
3 | let poder = 'Super força'
4 |
5 | nome = 'Batman'
6 | poder = 'Rico'
7 |
8 | console.log(
9 | `Nome: ${nome}
10 | Idade: ${idade}
11 | Poder: ${poder}`
12 | )
13 |
--------------------------------------------------------------------------------
/02-tipos-de-dados-pt-01/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Tipo de dados em Javascript - parte 1
2 | Tipos numericos, operadores, classes e etc..
3 |
4 | ----
5 |
6 | ## 🎓 Aprendizagem
7 |
8 | - [x] Introdução ao capítulo
9 | - [x] Trabalhando com strings e number
10 | - [x] Demonstração: trabalhando com strings e numbers
11 | - [x] Strings e numbers
12 | - [x] Conhecendo os operadores do Javascript
13 | - [x] Demonstração: conhecendo os operadores do Javascript
14 |
15 |
--------------------------------------------------------------------------------
/02-tipos-de-dados-pt-01/demo-02-strings-e-numbers.js:
--------------------------------------------------------------------------------
1 | let salarioDoAmigo = 1000
2 | let meuSalario = "2999"
3 |
4 | console.log( salarioDoAmigo + meuSalario )
5 |
6 | console.log(
7 | typeof(salarioDoAmigo),
8 | salarioDoAmigo
9 | )
10 |
11 | console.log(
12 | typeof(meuSalario),
13 | meuSalario
14 | )
15 |
16 | console.log(
17 | isNaN(meuSalario)
18 | )
19 |
20 | let minhaString = 'Olá mundo!'
21 | let minhaOutraString = 'Olá mundo2'
22 | let minhaStringComVariaveis = `${minhaString} - ${minhaOutraString}. AE!`
23 |
24 | console.log(minhaStringComVariaveis)
--------------------------------------------------------------------------------
/02-tipos-de-dados-pt-01/demo-03-operadores.js:
--------------------------------------------------------------------------------
1 | console.log('1 + 1 = ', 1 + 1)
2 | console.log('2 - 4 = ', 2 - 4)
3 | console.log('2 * 6 = ', 2 * 6)
4 | console.log('2 / 4 = ', 2 / 4)
5 | console.log('2 % 4 = ', 2 % 4)
6 | console.log('2 ** 4 = ', 2 ** 4)
7 |
8 | console.log('\n--- Operadores ----\n')
9 | console.log('1 > 2 = ', 1 > 2)
10 | console.log('2 < 4 = ', 2 < 4)
11 | console.log('1 === 2 = ', 1 === 2)
12 | console.log('1 !== 2 =', 1 !== 2)
13 | console.log('1 >= 1 =', 1 >= 1)
14 | console.log('1 <= 1 =', 1 <= 1)
15 |
16 |
--------------------------------------------------------------------------------
/03-tipos-de-dados-pt-02/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Tipo de dados em Javascript - parte 2
2 |
3 | ----
4 |
5 | ## 🎓 Aprendizagem
6 |
7 | - [x] Comentando código
8 | - [x] O que são os tipos undefined e null?
9 | - [x] Null e undefined
10 | - [x] Tipos Booleanos
11 | - [x] Demostração: Tipos Booleanos
12 | - [x] Trabalhando com arrays
13 | - [x] Demonstração: Trabalhando com arrays
14 | - [x] Trabalhando com objects
15 | - [x] Demonstração: Trabalhando com objects
16 |
--------------------------------------------------------------------------------
/03-tipos-de-dados-pt-02/demo-04-comentarios.js:
--------------------------------------------------------------------------------
1 | // comentário em uma unica linha
2 |
3 | /**
4 | * Esse código é Hackerzão
5 | * Author: Leticia Campos
6 | * Data: 15/05/2020
7 | */
8 |
9 | // ignorando a linha abaixo
10 | // const variavelConstante = 1+2+4+4
11 | const variavelConstante = 1 + 2 + 4 + 4 // na mesma linha
--------------------------------------------------------------------------------
/03-tipos-de-dados-pt-02/demo-05-undefined-e-null.js:
--------------------------------------------------------------------------------
1 | // undefined = não foi definido, nunca recebeu um valor
2 | // por boa prática inicializamos uma variavel como null quando nao queremos que ela inicialize com valor
3 |
4 | let variavelSemInicializacao
5 |
6 | console.log(
7 | variavelSemInicializacao,
8 | typeof(variavelSemInicializacao)
9 | )
10 |
11 |
12 | variavelSemInicializacao = 'Hello world!!'
13 |
14 | console.log(
15 | variavelSemInicializacao,
16 | typeof (variavelSemInicializacao)
17 | )
18 |
19 | variavelSemInicializacao = null
20 |
21 | console.log(
22 | variavelSemInicializacao,
23 | typeof (variavelSemInicializacao)
24 | )
25 |
26 | let podeViajar = null
27 |
28 | console.log(
29 | podeViajar,
30 | typeof(podeViajar)
31 | )
--------------------------------------------------------------------------------
/03-tipos-de-dados-pt-02/demo-06-booleanos.js:
--------------------------------------------------------------------------------
1 | const podeDirigir = true
2 | if (podeDirigir) {
3 | console.log('Ela pode dirigir')
4 | }
5 |
6 | const saldoEmConta = 1
7 | if (!saldoEmConta) {
8 | console.log('Não tem saldo!')
9 | }
10 |
11 | const boolComString = 'Ae Hackerzão!'
12 |
13 | // !! pega o valor e transforma em true ou false
14 | console.log('!!boolComString', !!boolComString)
15 |
16 | // negação
17 | console.log('!boolComString', !boolComString)
18 |
19 | // negação + forçar com o boolean (executa primeiro no parenteses depois o de fora)
20 | console.log(
21 | 'negação + forçar a booleano',
22 | ! (!!boolComString)
23 | )
24 |
--------------------------------------------------------------------------------
/03-tipos-de-dados-pt-02/demo-07-listas.js:
--------------------------------------------------------------------------------
1 | const pokemon = [
2 | 'Bulbassaur',
3 | 'Pikachu',
4 | 'Squirtle',
5 | 'Charmander'
6 | ]
7 |
8 | [0] === 'Bulbassaur'
9 | [1] === 'Pikachu'
10 | [2] === 'Squirtle'
11 | [5] === undefined
12 |
13 | // -----------------
14 |
15 | const minhaLista = []
16 | const minhaListaDeTarefas = [
17 | 'mandar email',
18 | 'colocar comida para o dog',
19 | 'limpar o quarto'
20 | ]
21 |
22 | // console.log(minhaListaDeTarefas[0])
23 | // console.log(minhaListaDeTarefas[1])
24 | // console.log(minhaListaDeTarefas[4])
25 |
26 | //quantidade de itens no array
27 | // console.log(minhaListaDeTarefas.length)
28 |
29 | // adicionar item no final da lista
30 | minhaListaDeTarefas.push('formatar computador')
31 | // console.log(minhaListaDeTarefas);
32 |
33 | // remover ultimo da lista
34 | // const ultimo = minhaListaDeTarefas.pop() //pego o valor removido na variavel ultimo
35 | // console.log(ultimo, minhaListaDeTarefas)
36 |
37 | // remover o primeiro da lista
38 | // const primeiro = minhaListaDeTarefas.shift() //pego o primeiro valor removido da lista
39 | // console.log(primeiro, minhaListaDeTarefas)
40 |
41 | // remover um item especifico a partir de um indice
42 | // console.log(minhaListaDeTarefas[2])
43 | // qual item de inicio
44 | // quantos remover
45 | // minhaListaDeTarefas.splice(2, 1)
46 | // console.log(minhaListaDeTarefas)
47 |
48 | const itens = [
49 | 1, 'computador', 0.22
50 | ]
51 |
52 | // verificar o array
53 | // console.log(typeof(itens))
54 |
55 | console.log(Array.isArray(itens)) // essa é a forma corretar de verificar se o retorno é um array
56 |
57 | // ordernar
58 | // const numeros = [ 3, 2, 1, 0]
59 | // console.log(numeros.sort())
60 |
61 | // juntar dois arrays
62 | // const novoArray = itens.concat([4, 5, 6])
63 | // console.log(novoArray)
64 |
65 | // console.log(itens.join('---')) // 1---computador---0.22
66 |
67 | // verificar indice/posicao do item no meu array
68 | // const index = itens.indexOf('computador')
69 | // console.log(index)
70 |
71 | // const index = itens.indexOf('chaves')
72 | // console.log(index) // -1
73 |
74 | const index = itens.indexOf('computador')
75 | console.log(itens[index])
76 |
--------------------------------------------------------------------------------
/03-tipos-de-dados-pt-02/demo-08-objetos.js:
--------------------------------------------------------------------------------
1 | const pessoa =
2 | {
3 | id: '0011AABBCC',
4 | nome: 'Xuxa da Silva',
5 | idade: 40,
6 | dataNascimento: new Date(2000, 6, 1),
7 | }
8 |
9 | // console.log(pessoa.id)
10 | // console.log(pessoa['nome'])
11 | // console.log(pessoa['nomeDaMae'] = 'Maria da Silva')
12 |
13 | // -------------------
14 |
15 | const heroi = {
16 | nome: 'Flash',
17 | idade: 100,
18 | sexo: 'Masculino'
19 | }
20 |
21 | // console.log('nome', heroi.nome)
22 | // console.log('idade', heroi['idade'])
23 | // console.log('sexo', heroi['sexo'])
24 | // console.log('naoExiste', heroi.naoExiste)
25 | // heroi.id = 0001
26 | // console.log(heroi)
27 |
28 | // imprimo as chaves do meu objeto //[ 'nome', 'idade', 'sexo' ]
29 | // console.log(Object.keys(heroi))
30 |
31 | // saber valores // [ 'Flash', 100, 'Masculino' ]
32 | // console.log(Object.values(heroi))
33 |
34 | novaPessoa = {
35 | tamanho: '10 metros'
36 | }
37 |
38 | //juntas dois objetos
39 | const novoObj = Object.assign(heroi, novaPessoa)
40 |
41 | console.log(novoObj)
42 | delete novoObj.nome
43 | console.log(novoObj)
44 | // por convenção e padrão não alterar o objeto original e sempre criar um novo usando o assign
45 |
46 |
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Tipo de dados em Javascript - parte 3
2 | Como interceptar quando alguém acessar o meu objeto? Ou tenta inserir um novo valor para esse objeto?
3 | Nesse caso se pode utilizar modificadores de acesso ou métodos acessores de objetos get/set
4 |
5 | ----
6 |
7 | ````
8 | const pessoa = {
9 | _nome: "",
10 | get nome() {
11 | return this._nome
12 | },
13 | set nome(n) {
14 | this._nome = n.toUpperCase()
15 | },
16 | }
17 |
18 | pessoa.nome = 'joselita do céu'
19 | ````
20 |
21 | ----
22 |
23 | ## 🎓 Aprendizagem
24 |
25 | - [x] Conhecendo os métodos assessores get/set de objetos
26 | - [x] Demonstração: conhecendo objetos globais pré-definidos
27 | - [x] Demonstração: Trabalhando com datas
28 | - [x] Funções em javascript
29 | - [x] Formas de declarar uma função: expressão, declarativa e arrow function
30 | - [x] Trabalhando com classes
31 | - [x] Demonstração: Trabalhando com classes
32 |
33 | ---
34 |
35 | ## Convenção dos desenvolvedores javascript
36 |
37 | - Sempre que declarar uma variavel private deixá-la com um underline (_) na frente do seu nome, exemplo: `_nome`
38 |
39 | ---
40 |
41 | ## Entendendo classes
42 |
43 | Representação de Piloto:
44 |
45 | ````
46 |
47 | Dados:
48 |
49 | Nome = José da Silva
50 | Data de nascimento = 01/05/1972
51 | Tempo de voo = 10 anos
52 | Tem permissão para voar = Não
53 |
54 | ````
55 |
56 | ````
57 | Objeto:
58 |
59 | const piloto = {
60 | nome: 'José da silva',
61 | nascimento: 01/05/1972,
62 | tempoVoo: '10 years',
63 | permissaoVoo: false
64 | }
65 |
66 | ````
67 |
68 | Acessos:
69 |
70 | pilotar()
71 |
72 | dormir ()
73 |
74 | acordar()
75 |
76 | tomarUnsDrinks()
77 |
78 | ````
79 |
80 | class Piloto {
81 | constructor(
82 | nome,
83 | dataNascimento,
84 | tempoDeVoo,
85 | temPermissaoParaVoar
86 | ) {
87 | this.nome = nome;
88 | this.dataNascimento = dataNascimento;
89 | this.tempoDeVoo = tempoDeVoo;
90 | this.temPermissaoParaVoar = temPermissaoParaVoar;
91 | }
92 | }
93 |
94 | ````
95 |
96 | ````
97 |
98 | class Piloto {
99 | constructor(
100 | nome,
101 | dataNascimento,
102 | tempoDeVoo,
103 | temPermissaoParaVoar
104 | )
105 |
106 | const piloto = new Piloto(
107 | 'geraldino',
108 | new Date(1990, 2, 3),
109 | '10 anos',
110 | true
111 | )
112 | }
113 |
114 | piloto.nome // geraldino
115 | piloto.dataNascimento // 03 1990 00:00:00 GMT-0300
116 |
117 | ````
118 |
119 | ````
120 |
121 | class Piloto {
122 | constructor( ...
123 | }
124 |
125 | pilotar() {
126 | console.log(`${this.nome} vai pilotar!`);
127 | }
128 |
129 | dormir() {
130 | console.log(`${this.nome` vai dormir!);
131 | }
132 |
133 | ````
134 |
135 | ````
136 |
137 | piloto.pilotar()
138 |
139 | piloto.dormir()
140 |
141 | ````
142 |
143 | Obs: No conceito de classes não se utiliza a palavra function ao criar um função como o pilotar e dormir.
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/demo-09-object-get-set.js:
--------------------------------------------------------------------------------
1 | const pessoa = {
2 | _nome: '',
3 | _idade: 20,
4 | get nome() {
5 | return this._nome
6 | },
7 | set nome(valor) {
8 | this._nome = valor.toUpperCase()
9 | },
10 |
11 | get podeDirigir() {
12 | return this._idade > 18
13 | },
14 | set idade(valor) {
15 | this._idade = valor
16 | }
17 | }
18 |
19 | pessoa.nome = 'leticia campos'
20 | console.log(pessoa.nome)
21 |
22 | pessoa.idade = 16
23 | console.log(pessoa.podeDirigir)
24 |
25 |
26 | // --------------------
27 |
28 | const animal = {
29 | _id: '123',
30 | _idade: '123',
31 | get id() {
32 | return this._id
33 | },
34 | set idade(valor) {
35 | this._idade = valor
36 | }
37 | }
38 |
39 | console.log(animal.id)
40 | animal.idade = 10
41 |
42 | console.log(animal.idade)
43 |
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/demo-10-objetos-globais.js:
--------------------------------------------------------------------------------
1 | console.log('keys', Object.keys({ nome: 'Leticia' })) //keys [ 'nome' ]
2 | console.log('values', Object.values({ nome: 'Leticia' })) //values [ 'Leticia' ]
3 | console.log('now', Date.now()) //now 1589671915896
4 | console.log('random', Math.random()) //random 0.14529393352855946
5 |
6 | // global
7 | console.log('global', global) //No node.js se chama global no browser this -- mostra listagem de funções précriadas do JS
8 |
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/demo-11-date.js:
--------------------------------------------------------------------------------
1 | // date começa com zero
2 | // as data no JS sempre começa de 1970 até hoje
3 |
4 | // meses começam do zero
5 | const dataAniversario = new Date(2020, 0, 20)
6 | // console.log(dataAniversario)
7 |
8 | const primeiraDataDoJS = new Date(0) //2020-01-20T02:00:00.000Z
9 | // console.log(primeiraDataDoJS) //1970-01-01T00:00:00.000Z
10 |
11 | const hoje = new Date()
12 | // console.log(hoje.toString()) //Sat May 16 2020 20:42:37 GMT-0300 (GMT-03:00)
13 | // console.log(hoje.toLocaleDateString())
14 |
15 |
16 | // formato global recomendado!
17 | // console.log(hoje.toISOString())
18 |
19 | const dia = hoje.getDate()
20 | hoje.setDate(dia + 5) // +5 dias depois de hoje
21 | hoje.setHours(10, 30, 0)
22 |
23 | console.log(`
24 | Dia: ${hoje.getDate()}
25 | Mes: ${hoje.getMonth()}
26 | Ano: ${hoje.getFullYear()}
27 | Hora: ${hoje.getHours()}
28 | Minute: ${hoje.getMinutes()}
29 | Seconds: ${hoje.getSeconds()}
30 | `)
31 |
32 | console.log(
33 | new Date(2020, 1, 20) > new Date(2020, 3, 20)
34 | )
35 |
36 |
37 |
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/demo-12-functions.js:
--------------------------------------------------------------------------------
1 | function nomeDaFuncao(parametro1) {
2 | //bloco de codigo
3 | }
4 |
5 | function queDiaEhoje() {
6 | const data = new Date()
7 | console.log(`Hoje é dia: ${data.getDate()}`)
8 | }
9 | queDiaEhoje()
10 |
11 | function soma(valor1, valor2) {
12 | console.log(`A soma de ${valor1} + ${valor2} é`, valor1 + valor2)
13 | }
14 | soma(10, 20)
15 | soma(2, 4)
16 |
17 | // Funções que podem retornar valores
18 | function soma (valor1, valor2) {
19 | return valor1 + valor2
20 | }
21 | const idade = 20
22 | const tamanho = 10
23 | const resultado = soma(idade, tamanho)
24 | console.log('resultado', resultado)
25 |
26 | // não é boa prática passar os valores direto para a função, e sim através de variaveis como no ex: resultado
27 |
28 | function multiplicar(valor1, valor2) {
29 | const resultado = valor1 * valor2
30 | return resultado
31 | }
32 | console.log(`O resultado da multiplicao é:`, multiplicar(10,30))
33 |
34 | ////
35 |
36 | const funcionario1 = {
37 | nome: 'Zezinho',
38 | desconto: 0.2,
39 | salarioBruto: 2000,
40 | salarioLiquido: 0
41 | }
42 |
43 | const funcionario2 = {
44 | nome: 'Mariazinha',
45 | desconto: 0.1,
46 | salarioBruto: 2000,
47 | salarioLiquido: 0
48 | }
49 |
50 | // const descontoFuncionario1 =
51 | // funcionario1.salarioBruto - (funcionario1.desconto * funcionario1.salarioBruto)
52 |
53 |
54 | // const descontoFuncionario2 =
55 | // funcionario2.salarioBruto - (funcionario2.desconto * funcionario2.salarioBruto)
56 |
57 | // console.log(descontoFuncionario1)
58 | // console.log(descontoFuncionario2)
59 |
60 | function calcularDesconto(salarioBruto, desconto) {
61 | return salarioBruto - (salarioBruto * desconto)
62 | }
63 |
64 | funcionario1.salarioLiquido = calcularDesconto(
65 | funcionario1.salarioBruto,
66 | funcionario1.desconto
67 | )
68 |
69 | funcionario2.salarioLiquido = calcularDesconto(
70 | funcionario2.salarioBruto,
71 | funcionario2.desconto
72 | )
73 |
74 | console.log(`
75 | Salário ${funcionario1.nome}: ${funcionario1.salarioLiquido}
76 | Salário ${funcionario2.nome}: ${funcionario2.salarioLiquido}
77 | `)
78 |
79 |
80 |
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/demo-13-formas-funcoes.js:
--------------------------------------------------------------------------------
1 | // usando function
2 | function minhaFuncao1(parametro1) {
3 | return `aeeeee`
4 | }
5 |
6 | // usando const
7 | const minhaFuncao2 = function(parametro1) {
8 | return `aeee ${parametro1}`
9 | }
10 |
11 | // usando arrow function
12 | const minhaFuncao3 = (parametro1) => {
13 | return `aeeee ${parametro1}`
14 | }
15 |
16 | // usando arrow function sem quebrar linha
17 | const minhaFuncao4 = parametro1 => `aeeee ${parametro1}`
18 |
19 | const obj1 = {
20 | minhaFuncao: parametro1 => `aeee ${parametro1}`
21 | }
22 |
23 | obj1.minhaFuncao('test')
24 |
25 | // sem a palavra function
26 | const obj2 = {
27 | minhaFuncao(parametro1) {
28 | return `aeee ${parametro1}`
29 | }
30 | }
31 |
32 | obj2.minhaFuncao('test')
33 |
--------------------------------------------------------------------------------
/04-tipos-de-dados-pt-03/demo-14-classes.js:
--------------------------------------------------------------------------------
1 | class Heroi {
2 | atacar() {
3 | console.log(`atacou!!`)
4 | }
5 | defender() {
6 | console.log(`defendeu`)
7 | }
8 | }
9 |
10 | const heroi = new Heroi()
11 | heroi.atacar()
12 | heroi.defender()
13 |
14 | // ----------------------------------------------------
15 |
16 | // usando constructor
17 | // this é no contexto do escopo da classe
18 |
19 | class Heroi2 {
20 | constructor(nome, idade) {
21 | this.nome = nome
22 | this.idade = idade
23 | }
24 |
25 | atacar() {
26 | console.log(`
27 | O ${this.nome} atacou !!`)
28 | }
29 | }
30 |
31 | const heroi2 = new Heroi2(
32 | `Flash`, 80
33 | )
34 | heroi2.atacar()
35 |
36 | // ----------------------------------------------------
37 |
38 | // Podemos usar a função na classe sem a palavra function que vai sempre olhar para o this
39 | // Para usar o this, é necessário ter ela vazia la
40 | // Mas se não precisar usar o this, pode usar o static
41 | // Dessa forma ele não faz parte das propriedades da minha classe
42 | // essas funções na programação são chamadas de helpers ou funcoes utils que não envolva nada
43 | // do meu contexto atual
44 | // executando essa funcao eu nao preciso usar o new
45 | // lembrete: o static são para valores que não se alteram, é criado dentro da função e morre logo após a criação
46 |
47 | class Heroi3 {
48 | static obterAnoNascimento(idade) {
49 | return 2020 - idade
50 | }
51 | }
52 |
53 | const anoNascimento = Heroi3.obterAnoNascimento(26)
54 | console.log(
55 | `O ano de nascimento do Heroi é ${anoNascimento}`
56 | )
57 |
--------------------------------------------------------------------------------
/05-controlando-o-fluxo-de-dados/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Controlando o fluxo de dados
2 | Baseados nos aprendizado das aulas anteriores, agora é o momento de transformar isso em uma aplicação inteligente, a partir da criação de estruturas para organizar o fluxo e controlar as ações dos usuários em suas aplicações.
3 |
4 | ----
5 |
6 | ## 🎓 Aprendizagem
7 |
8 | - [x] Introdução ao capítulo
9 | - [x] Demonstração: Conhecendo o if, else e else if
10 | - [x] Conhecendo o Switch Case
11 | - [x] Demonstração: Conhecendo o Switch Case
12 | - [x] Conhecendo o While e Do..While
13 | - [x] Demonstração: Conhecendo o While e Do..While
14 | - [x] Demonstração: Trabalhando com For, ForIn e ForOf
15 |
--------------------------------------------------------------------------------
/05-controlando-o-fluxo-de-dados/demo-15-if-else.js:
--------------------------------------------------------------------------------
1 | let frutaExistenteNoMercado = false
2 | let temCPUSuficiente = true
3 |
4 | //
5 | // obter valores do terminal
6 | const args = process.argv
7 | const saldo = args[args.length -1]
8 | // console.log('args', args)
9 | console.log('saldo', saldo)
10 |
11 | if (isNaN(saldo)) {
12 | console.log('valor invalido!!')
13 | return;
14 | }
15 |
16 | let tipoCliente = 'premium'
17 | if (saldo < 9) {
18 | tipoCliente = 'basic'
19 | }
20 | else if (saldo >= 10 && saldo < 20) {
21 | tipoCliente = 'gold'
22 | }
23 | else {
24 | tipoCliente = null
25 | }
26 |
27 | // null, undefined, vazia, 0 === false!
28 | if(!tipoCliente) {
29 | tipoCliente = 'indefinido'
30 | }
31 |
32 | console.log('tipoDoCliente', tipoCliente)
33 |
34 | const operadorOu = 1 > 2 || 2 > 1
35 | const operadorE = 1 === 1 && 2 !== 2
36 | const operadorNot = !(1==1)
37 |
38 | const idade = 18
39 | const resultado = idade >= 18 ? 'pode dirigir' : 'nao pode dirigir!!'
40 | console.log('resultado: ', resultado)
41 |
--------------------------------------------------------------------------------
/05-controlando-o-fluxo-de-dados/demo-16-switch-case.js:
--------------------------------------------------------------------------------
1 | // criando menu de seleção de forma menos verbosa
2 | // usamos o require para pegar uma classe que já existe no Node.js é para capturar eventos no caso o que o usuario esta digitando
3 |
4 | const readLine = require('readline')
5 | const terminal = readLine.createInterface({
6 | // definir o modo de entrada via terminal
7 | input: process.stdin,
8 | // todo texto de saída sairá no terminal
9 | output: process.stdout
10 | })
11 |
12 | // texto do menu
13 | const textoMenu = `
14 | Olá, seja bem vindo ao sistema de média
15 | Digite 1 para acessar o menu inicial
16 | Digite 2 para acessar o menu de Herois
17 | Digite 3 para acessar o menu de Guerreiras
18 | Digite 0 para sair
19 | `
20 | console.log('textoMenu', textoMenu)
21 |
22 | // terminal.question('Qual é seu nome?', (msg) => {
23 | // console.log('você escreveu', msg)
24 | // terminal.close()
25 | // })
26 |
27 | const questoes = {
28 | menuInicial: {
29 | texto: textoMenu,
30 | fn: menuInicial
31 | },
32 | opcao1: {
33 | texto: 'submenu! Pressione enter para selecionar mais opções...',
34 | fn: opcao1
35 | }
36 | }
37 | function opcao1(msg) {
38 | console.log('Não há mais opções!')
39 | terminal.close()
40 | }
41 | function menuInicial(msg) {
42 | const opcao = Number(msg)
43 | if(isNaN(opcao)) {
44 | throw new Error('Não é um número', msg)
45 | }
46 | switch(opcao) {
47 | case 0:
48 | console.log('Saindo...')
49 | terminal.close()
50 | break;
51 | case 1:
52 | console.log('menu inicial')
53 | terminal.question(
54 | questoes.opcao1.texto,
55 | questoes.opcao1.fn
56 | )
57 | break;
58 | default:
59 | console.log('opcao invalida')
60 | terminal.close()
61 | break;
62 | }
63 | }
64 |
65 | terminal.question(
66 | questoes.menuInicial.texto,
67 | questoes.menuInicial.fn
68 | )
69 |
70 |
--------------------------------------------------------------------------------
/05-controlando-o-fluxo-de-dados/demo-17-while-do.js:
--------------------------------------------------------------------------------
1 | // enquanto não mudar, não para!
2 | let termoDeParada = true
3 | let contador = 0
4 | while(termoDeParada) {
5 | termoDeParada = contador < 10
6 | if (contador % 2 === 0) {
7 | console.log('Numero par', contador)
8 | }
9 | contador += 1
10 | // contador = contador + 1
11 | }
12 |
13 | // roda a primeira vez e testa a variavel depois!
14 | do {
15 | console.log('Só uma vez! pois termoDeParada é', termoDeParada)
16 | } while(termoDeParada)
17 |
18 |
19 | while (termoDeParada) {
20 | // nao vai executar
21 | console.log('Nem vai executar!')
22 | }
23 |
--------------------------------------------------------------------------------
/05-controlando-o-fluxo-de-dados/demo-18-for-forin-forof.js:
--------------------------------------------------------------------------------
1 | const textoPar = 'par'
2 | const textoImpar = 'impar'
3 | // for(let index = 0; index <= 10; index++) {
4 | // const decisao = index % 2 == 0 ? textoPar : textoImpar
5 | // console.log(`O numero ${index} é ${decisao}`)
6 | // }
7 |
8 | const minhaListaDeTarefas = [
9 | {
10 | id: parseInt(Math.random() * 10),
11 | nome: 'Zezinho',
12 | superPoder: 'Valoz'
13 | },
14 | {
15 | id: parseInt(Math.random() * 10),
16 | nome: 'Mariazinha',
17 | superPoder: 'Super força'
18 | },
19 | ]
20 | // console.log(minhaListaDeTarefas)
21 |
22 | // for(let index = 0; index < minhaListaDeTarefas.length; index ++) {
23 | // const item = minhaListaDeTarefas[index]
24 | // console.log(
25 | // `
26 | // id: ${item.id}
27 | // nome: ${item.nome}
28 | // `
29 | // )
30 | // }
31 |
32 | // não precisa do contador
33 | // usando o for in
34 | // for(const index in minhaListaDeTarefas) {
35 | // const item = minhaListaDeTarefas[index]
36 | // console.log('Nome', item.nome)
37 | // }
38 |
39 | // não precisa usar o index
40 | // com o of pega o item especifico
41 | for(const item of minhaListaDeTarefas) {
42 | console.log('Nome', item.nome)
43 | }
44 |
--------------------------------------------------------------------------------
/06-modulos-em-javascript/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Módulos em Javascript
2 | Com módulos é possível entender melhor como funciona a interação do Javascript no browser e a interação do Javascript no Node.js
3 |
4 | ----
5 |
6 | ## 🎓 Aprendizagem
7 |
8 | - [x] Introdução ao capítulo
9 | - [x] [Módulos no Node.js](./modulo-nodejs)
10 | - [x] [Módulos em navegadores](./modulo-browser)
11 |
--------------------------------------------------------------------------------
/06-modulos-em-javascript/modulo-browser/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | Módulo em Navegadores
4 |
6 |
7 |
8 |
33 |
34 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/06-modulos-em-javascript/modulo-browser/main.js:
--------------------------------------------------------------------------------
1 | window.onload = () => {
2 | console.log('tela carregou!!')
3 | const btn = document.getElementById('btnCalcular')
4 | btn.onclick = click
5 |
6 | function obterValorInput(id) {
7 | const item = document.getElementById(id)
8 | return item.value
9 | }
10 |
11 | function click() {
12 | const tipoOperacao = obterValorInput('tipoOperacao')
13 | const valor1 = obterValorInput('valor1')
14 | const valor2 = obterValorInput('valor2')
15 | const resultado = Matematica[tipoOperacao](valor1, valor2)
16 | console.log('resultado', resultado)
17 | document.getElementById('resultado')
18 | .innerText = `A operação de ${tipoOperacao}, ${valor1} por ${valor2} é ${resultado}`
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/06-modulos-em-javascript/modulo-browser/matematica.js:
--------------------------------------------------------------------------------
1 | class Matematica {
2 | static dividir(valor1, valor2) {
3 | return valor1 / valor2
4 | }
5 |
6 | static subtrair(valor1, valor2) {
7 | return valor1 - valor2
8 | }
9 | }
10 |
11 | // já fica publico sozinho, só de importar no html não precisa de module.exports
--------------------------------------------------------------------------------
/06-modulos-em-javascript/modulo-nodejs/main.js:
--------------------------------------------------------------------------------
1 | // require(readline) // dessa forma eu pego dos modulos internos do nodejs
2 | // require(./readline) // dessa forma eu pego de um arquivo local indicado
3 |
4 | const Matematica = require('./matematica')
5 | // console.log(Matematica.somar(1, 4))
6 | const readline = require('readline')
7 | const terminal = readline.createInterface({
8 | input: process.stdin,
9 | output: process.stdout
10 | })
11 |
12 | // primeiro valor do cliente e depois o segundo valor, por isso 2 funcoes
13 | terminal.question('Insira o primeiro valor\n', valor1 => {
14 | terminal.question('Insira o segundo valor\n', valor2 => {
15 | terminal.question('Insira a operação\n', tipoOperacao => {
16 | const resultado = Matematica[tipoOperacao](
17 | Number(valor1), Number(valor2)
18 | )
19 | console.log(
20 | `A operação ${tipoOperacao} de ${valor1} e ${valor2} é ${resultado}`
21 | )
22 | terminal.close()
23 | })
24 | })
25 | })
26 |
27 | // a classe no fim de tudo é convertida para objeto
28 | // para acessar o objeto usar ponto ou colchetes
29 | // Exemplo: console.log(Matematica['somar'], Matematica['multiplicar'])
30 |
31 |
--------------------------------------------------------------------------------
/06-modulos-em-javascript/modulo-nodejs/matematica.js:
--------------------------------------------------------------------------------
1 | class Matematica {
2 | static somar(valor1, valor2) {
3 | return valor1 + valor2
4 | }
5 |
6 | static multiplicar(valor1, valor2) {
7 | return valor1 * valor2
8 | }
9 | }
10 |
11 | // deixar o arquivo publico
12 | module.exports = Matematica
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Ciclo de vida do Javascript
2 | Abordagem de funções assíncronas, cenários da vida real e porque tudo isso embola tanto a vida dos desenvolvedores.
3 |
4 | ----
5 |
6 | ## 🎓 Aprendizagem
7 |
8 | - [x] Introdução ao capítulo
9 | - [x] Funções assíncronas?
10 | - [x] O que são Callbacks?
11 | - [x] Demonstração: Trabalhando com Callbacks
12 | - [x] O que são Promises?
13 | - [x] Trabalhando com Promises?
14 | - [x] Como usar async/await para resolver Promises?
15 |
16 | ---
17 |
18 | ## Entendendo sincronismo
19 |
20 | - Imagina que você está em na fila do banco e precisa aguardar cada pessoa ser atendida para conseguir resolver as suas coisas e durante esse tempo não pode fazer nada. Ou seja, tem que aguardar um a um ser atendido até chegar a sua vez, isso na programação é chamado de sincronia, sempre um atrás do outro.
21 |
22 | 
23 |
24 | - E assincronia o que seria? É parecido com o fastfood, por exemplo você faz o pedido e recebe uma senha, enquanto aguarda pelo lanche você pode fazer várias outras coisas ao mesmo tempo, como fazer uma ligação, jogar um jogo, sair e dar uma volta, e ai o seu pedido fica pronto e a sua senha é chamada. Isso é chamado de Callback (chamada de volta), você vai entrega a senha e recebe o lanche.
25 |
26 | 
27 |
28 | - assincronia = termina as coisas sobre demanda e aos poucos
29 |
30 | ---
31 |
32 | ## Event Loop
33 |
34 | - Dentro do event loop o javascript executa uma função por vez e 1. recebe essa função assincrona, como uma leitura de um arquivo ou processamento de um dado e em seguida ele 2. delega para o sistema operacional fazendo o pedido "windows, quando você conseguir ler e obter os dados, faz um callback e me chama de volta", feito isso o 3. javascript continua executando outras coisas, quando o sistema operacional termina ele 4. devolve a resposta pro event loop que 5. retorna para quem chamou.
35 |
36 | - Desta forma o Javascript sempre executa as operações sobre demanda e por isso é mais rápido, pois não precisa parar toda a sua execução para fazer alguma coisa.
37 |
38 | ````
39 |
40 | const callback = function(msg) {
41 | console.log(msg)
42 | }
43 |
44 | terminal.question("Nome", callback)
45 |
46 | ````
47 |
48 | Neste exemplo usando o terminal.question o que passamos como segundo argumento vai ser sempre o callback, que é a função que vai ser executada quando o terminal acabar.
49 |
50 | Por convenção usamos o callback sempre com 2 parâmetros, sendo o primeiro de erro e o segundo o sucesso.
51 |
52 | ````
53 |
54 | const callback = function(error, result) {
55 | if (error) return console.log(error)
56 | return console.log(result)
57 | }
58 |
59 | fs.readFile('arquivo.txt', callback)
60 |
61 | ````
62 |
63 |
64 | ## Promise
65 |
66 | Recurso nativo do javascript
67 |
68 | ````
69 |
70 | new Promise((resolve, reject) => {
71 | return resolve(sucesso)
72 | return reject(erro)
73 | })
74 | .then(sucesso => ({}))
75 | .catch(erro => ({}))
76 | .then(sucesso => ({}))
77 | .then(sucesso => ({}))
78 | .catch(erro => ({}))
79 | .finally(resultado => ({}))
80 |
81 | ````
82 |
83 | ````
84 |
85 | const readFile = caminho =>
86 | new Promise((resolve, reject) => {
87 | fs.readFile(caminho, (error, res) => {
88 | error ? reject(error) : resolve(res)
89 | })
90 | })
91 |
92 | ````
93 |
94 | ````
95 |
96 | readFile(arquivo.txt)
97 | .then(conteudo, fn)
98 | .catch(erro, fn)
99 |
100 | ````
101 |
102 | Outro exemplo:
103 |
104 | ````
105 |
106 | procurarUsuario()
107 | .then(usuario
108 |
109 | procurarEndereco(idUsuario)
110 | .then(endereco
111 |
112 | procurarTelefone(idUsuario)
113 | .then(telefone
114 |
115 | imprimirUsuario(
116 | nome, rua, telefone
117 | )
118 | .catch(error
119 |
120 | ````
121 |
122 | Importante lembrar que cada .then herda o resultado do anterior
123 |
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/arq1.txt:
--------------------------------------------------------------------------------
1 | Olá eu sou o arquivo 1
2 | agora sim
3 | vou aprender
4 | javascript
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/arq2.txt:
--------------------------------------------------------------------------------
1 | Hello, I am arquive 2
2 | que curso
3 | maneiro
4 | vou sair daqui
5 | seniorzao
6 | kkkkkkkkkkkk
7 |
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/arq3.txt:
--------------------------------------------------------------------------------
1 | haha
2 | check_box_outline_blank
3 | kkk
4 | oia
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/demo-18-callbacks.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs')
2 | // // verifica no sistema operacional se o arquivo existe, se nao retorna o erro
3 | // fs.readFile('./arq1.txt', (error, resposta) => {
4 | // if (error) {
5 | // console.error('Deu ruim', error.stack)
6 | // return;
7 | // }
8 |
9 | // //deve retornar um buffer
10 | // console.log('resposta', resposta.toString())
11 | // })
12 |
13 | fs.readFile('./arq1.txt', (errorArq1, respostaArq1) => {
14 | if(errorArq1) {
15 | console.error('Deu ruim no arq1', errorArq1)
16 | return;
17 | }
18 | fs.readFile('./arq2.txt', (errorArq2, respostaArq2) => {
19 | if(errorArq2) {
20 | console.error('Deu ruim no arq2', errorArq2)
21 | }
22 | fs.readFile('./arq3.txt', (errorArq3, respostaArq3) => {
23 | if(errorArq3) {
24 | console.error('Deu ruim no arq3', errorArq3)
25 | }
26 |
27 | const conteudo = `${respostaArq1}\n${respostaArq2}\n${respostaArq3}`
28 | fs.writeFile('./final.txt', conteudo, (errorWrite, respostaWrite) => {
29 | if(errorWrite) {
30 | console.error('Deu ruim na gravação', errorWrite)
31 | return;
32 | }
33 | console.log('Arquivo salvo com sucesso!!')
34 | })
35 | })
36 | })
37 | })
38 |
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/demo-19-promises.js:
--------------------------------------------------------------------------------
1 | const readline = require('readline')
2 | const terminal = readline.createInterface({
3 | input: process.stdin,
4 | output: process.stdout
5 | })
6 |
7 | // terminal.question('Qual é seu nome?\n', nome => {
8 | // terminal.question('Qual é seu telefone?\n', telefone => {
9 | // console.log(
10 | // `
11 | // Nome: ${nome},
12 | // Telefone: ${telefone}
13 | // `
14 | // )
15 | // terminal.close()
16 | // })
17 | // })
18 |
19 | // encapsulando a função questão, e trabalhando com promises
20 | function questionAsync(texto) {
21 | return new Promise((resolve, reject) => {
22 | terminal.question(`${texto}\n`, resolve)
23 | })
24 | }
25 |
26 | let nome = ""
27 | let telefone = ""
28 | Promise.resolve()
29 | .then(() => questionAsync('Qual é seu nome?'))
30 | .then(respostaNome => {
31 | if(!respostaNome) throw new Error('campo vazio!')
32 | nome = respostaNome
33 | })
34 | .then(() => questionAsync('Qual é o seu telefone?'))
35 | .then(respostaTelefone => {
36 | if(!respostaTelefone) throw new Error('campo vazio!')
37 | telefone = respostaTelefone
38 | })
39 | .then(() => {
40 | console.log(`Nome: ${nome}, Telefone: ${telefone}`)
41 | })
42 | .catch(error => {
43 | console.error(error)
44 | })
45 | .finally(() => terminal.close())
46 |
47 |
48 |
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/demo-20-async-await.js:
--------------------------------------------------------------------------------
1 | const readline = require('readline')
2 | const terminal = readline.createInterface({
3 | input: process.stdin,
4 | output: process.stdout
5 | })
6 |
7 | function questionAsync(texto) {
8 | return new Promise((resolve, reject) => {
9 | terminal.question(`${texto}\n`, msg => {
10 | !!msg ? resolve(msg) : reject(new Error('O campo não pode ser vazio!'))
11 | })
12 | })
13 | }
14 |
15 | // para informar o compilador do javascript que vai ser trabalhado com promisse, coloca async
16 | async function main() {
17 | try {
18 | const nome = await questionAsync('Qual é o seu nome?')
19 | const telefone = await questionAsync('Qual é seu telefone?')
20 | console.log(`Nome: ${nome}, Telefone: ${telefone}`)
21 | } catch (error) {
22 | console.log('Deu ruim***', error.stack)
23 | }
24 | finally {
25 | terminal.close()
26 | }
27 | }
28 | main()
29 |
30 |
--------------------------------------------------------------------------------
/07-ciclo-de-vida-javascript/final.txt:
--------------------------------------------------------------------------------
1 | Olá eu sou o arquivo 1
2 | agora sim
3 | vou aprender
4 | javascript
5 | Hello, I am arquive 2
6 | que curso
7 | maneiro
8 | vou sair daqui
9 | seniorzao
10 | kkkkkkkkkkkk
11 |
12 | haha
13 | check_box_outline_blank
14 | kkk
15 | oia
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Fundamentos Javascript 🔥
2 | 🎓 Repositório com as aulas e exercícios do curso de Fundamentos de Javascript by Erick Wendel
3 |
4 | ----
5 |
6 | ## 🤯 Aulas
7 |
8 | - [x] [Introdução ao curso](./00-introducao-ao-curso)
9 | - [x] [Iniciando com Javascript](./01-iniciando-com-javascript)
10 | - [x] [Tipos de dados - parte 01](./02-tipos-de-dados-pt-01)
11 | - [x] [Tipos de dados - parte 02](./03-tipos-de-dados-pt-02)
12 | - [x] [Tipos de dados - parte 03](./04-tipos-de-dados-pt-03)
13 | - [x] [Controlando o fluxo de dados](./05-controlando-o-fluxo-de-dados)
14 | - [x] [Módulos em Javascript](./06-modulos-em-javascript)
15 | - [x] [O Ciclo de vida Javascript](./07-ciclo-de-vida-javascript)
16 | - [x] [Projeto final: Construindo um jogo de Mémoria](./memory-game)
17 | - [x] Próximos passos
18 |
19 | ----
20 |
21 | ## 🎓 Projeto Final
22 | Jogo da memória - Herois
23 |
24 |
25 |
--------------------------------------------------------------------------------
/memory-game/README.md:
--------------------------------------------------------------------------------
1 | # 🤯 Projeto Final
2 | Construindo um jogo da memória, utilizando os principais conceitos abordados durante o curso.
3 |
4 | ----
5 |
6 | ## 🎓 Aprendizagem
7 |
8 | - [x] O que faremos?
9 | - [x] Criando estrutura de pastas e esqueleto inicial
10 | - [x] Retornando imagens dinâmicas ao jogo
11 | - [x] Criando função para embaralhar o jogo
12 | - [x] Escondendo cartas
13 | - [x] Encontrando a combinação de cartas
14 | - [x] Exibir herois a partir da combinação correta
15 | - [x] Criando mensagens customizadas e utilitários
16 | - [x] Exibindo todas as cartas do jogo e adicionando timer
17 | - [x] Configurando ambiente
18 | - [x] Publicando jogo da memória na web
19 |
20 | ----
21 |
22 | ## Ferramentas
23 |
24 | - [Bootstrap](https://getbootstrap.com/)
25 | - [Iconfinder](https://www.iconfinder.com/)
26 |
--------------------------------------------------------------------------------
/memory-game/arquivos/batman.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/memory-game/arquivos/frank.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/memory-game/arquivos/groot.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/memory-game/arquivos/mulhermaravilha.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/memory-game/arquivos/padrao.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/memory-game/assets/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/leticiacamposs2/fundamentos-javascript/81c9c468756f5ab829fdc5906eb3b34bbcb2dba6/memory-game/assets/favicon.ico
--------------------------------------------------------------------------------
/memory-game/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Memory Game
7 |
8 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
Começando em 1 ...
24 |
25 | Loading...
26 |
27 |
29 |
30 |
31 |
32 |
33 |
34 | Combinação!!
35 |
36 |
29 |
30 |
31 |
32 |
33 |