Resolução prática PG do módulo 02 - Introdução a Node e JavaScript.
Pôr em prática os conceitos aprendidos ao longo do módulo "Introdução ao Node e JavaScript" através das práticas propostas no PG.
O que é necessário para acompanhar a prática?
-
Ter as ferramentas instaladas em ambiente local (node.js, npm, VSCode, gitBash)
-
Ter uma conta no gitHub (ou similar) para versionar o projeto
-
Consumir o conteúdo do PlayGround
-
Assistir as aulas síncronas
Replicação dos enunciados para facilitar a compreensão dos exercícios.
Práticas referentes a Aula 01
- No terminal verificar se o node foi instalado
node -v
- Criar pasta para projeto, chamada CineHouse
mkdir CineHouse
- Criar arquivo chamado cinema.js, nele criar uma variável chamada cinema e esta deverá receber um valor como nome da loja
cd CineHouse && touch cinema.js
const cinema = "CineMarco"
- Executar
npm init
e verificar as mudanças que ocorreram na pasta e arquivos novos adicionados ao projeto
npm init
# Preencher as perguntas conforme preferências
- No arquivo cinema.js passar a variável anteriormente criada como parâmetro do
console.log
, a fim de que ao executar o arquivo
console.log(cinema)
- Executar o arquivo
node cinema.js
- Instalar o pacote nodemon
npm i --save -D nodemon
- Analisar a pasta node_modules
Práticas referentes a Aula 02
- No arquivo criado na última aula (cinema.js), deve ser criada uma variável do tipo array chamada catalogo. Esta será um array de objetos, onde cada objeto representará um filme.
const catalogo = []
-
O filme deve conter os seguintes atributos:
a.
codigo
(numérico - identificador do filme)b.
titulo
(string)c.
duracao
(numérico - em horas)d.
atores
(array de strings - nomes)e.
anoDeLancamento
(numérico)f.
emCartaz
(booleano) -
Deverão ser criados dois registros de filmes (de acordo com sua preferência). É importante apenas que um deles receba o valor de
true
na propriedadeemCartaz
e o outro o valorfalse
.
const catalogo = [{
codigo: 1,
titulo: "O Poderoso Chefão",
duracao: 2.91,
atores: ["Al Pacino", "Marlon Brando", "Diane Keaton", "Robert De Niro"],
anoDeLancamento: 1972,
emCartaz: true
},
{
codigo: 2,
titulo: "O Mágico de Oz",
duracao: 1.86,
atores: ["Judy Garland", "Jack Haley", "Bert Lahr", "Frank Morgan"],
anoDeLancamento: 1939,
emCartaz: false
}
]
adicionarFilme
| A função deve receber os parâmetros com as informações necessárias para criar um objeto do tipo Filme.
const adicionarFilme = filme => catalogo.push(filme)
const testarAdicionarFilme = () => {
console.log(`Antes da adição do novo filme ao catálogo, o catálogo possui ${catalogo.length} filmes.`)
adicionarFilme({
codigo: 3,
titulo: "Cidadão Kane",
duracao: 1.98,
atores: ["Orson Welles", "Joseph Cotten", "Dorothy Comingore", "William Alland"],
anoDeLancamento: 1941,
emCartaz: false
})
console.log(`Após adição do novo filme ao catálogo, o catálogo possui ${catalogo.length} filmes.`)
}
testarAdicionarFilme()
buscarFilme
| A função deve receber como parâmetro o número identificador do filme e fazer busca no array de catálogo e ao fim retornar o objeto encontrado. Preferencialmente, retorne de forma mais amigável ao usuário final (pode utilizarconsole
para não retornar apenas o objeto).
const buscarFilme = codigo => {
for (let filme of catalogo) {
if (filme.codigo === codigo) {
console.log(`O filme de código ${codigo} se chama ${filme.titulo}`)
}
}
}
const testarBuscarFilme = () => {
buscarFilme(1)
buscarFilme(2)
}
testarBuscarFilme()
alterarStatusEmCartaz
| A função deve receber como parâmetro o número identificador do filme escolhido, buscar o filme com base no parâmetro recebido e alterar o status existente da propriedadeemCartaz
(se estava comotrue
, alterar parafalse
, e vice e versa).
const alterarStatusEmCartaz = codigo => {
for (let filme of catalogo) {
if (filme.codigo === codigo) {
console.log(`Status do filme ${filme.titulo} (código ${codigo}) antes: ${filme.emCartaz}`)
filme.emCartaz = !filme.emCartaz
console.log(`Status do filme ${filme.titulo} (código ${codigo}) depois: ${filme.emCartaz}`)
}
}
}
const testarAlterarStatusEmCartaz = () => {
alterarStatusEmCartaz(1)
alterarStatusEmCartaz(2)
}
testarAlterarStatusEmCartaz()
- Criar uma pasta nova - Calculadora - (separa dos projetos anteriores para perdermos onde essa prática será feita).
cd .. && mkdir Calculadora
- Criar um arquivo somar.js que contenha uma função chamada
somar
, a qual deve ser exportada ao final do arquivo. Esta função deve receber 2 parâmetros e retornar a soma dos mesmos.
touch somar.js && code ./somar.js
const somar = (num1, num2) => num1 + num2
console.log(`Função somar recebendo 1 e 2 retorna: ${somar(1,2)}`)
module.exports = somar
- Criar um arquivo subtrair.js que contenha uma função chamada
subtrair
, a qual deve ser exportada ao final do arquivo. Esta função deve receber 2 parâmetros e retornar a diferença entre eles.
touch subtrair.js && code ./subtrair.js
const subtrair = (num1, num2) => num1 - num2
console.log(`Função subtrair recebendo 10 e 2 retorna: ${subtrair(10,2)}`)
module.exports = subtrair
- Criar um arquivo multiplicar.js que contenha uma função chamada
multiplicar
, a qual deve ser exportada ao final do arquivo. Esta função deve receber 2 parâmetros e retornar a multiplicação dos mesmos.
touch multiplicar.js && code ./multiplicar.js
const multiplicar = (num1, num2) => num1 * num2
console.log(`Função multiplicar recebendo 10 e 2 retorna: ${multiplicar(10,2)}`)
console.log(`Função multiplicar recebendo 10 e 0 retorna: ${multiplicar(10,0)}`)
console.log(`Função multiplicar recebendo 0 e 10 retorna: ${multiplicar(0,10)}`)
console.log(`Função multiplicar recebendo 0 e 0 retorna: ${multiplicar(0,0)}`)
module.exports = multiplicar
- Criar um arquivo dividir.js que contenha uma função chamada
dividir
, a qual deve ser exportada ao final do arquivo. Esta função deve receber 2 parâmetros e retornar a divisão dos mesmos. Importante: contemplar o cenário em que se algum dos dois parâmetros é zero, a função retornará "Não se pode dividir por zero".
ERRATA: na realidade, apenas o segundo parâmetro não pode ser 0. Isso por que não se pode dividir um número por 0, mas é possível dividir 0 por qualquer número (que não seja 0).
touch dividir.js && code ./dividir.js
const dividir = (num1, num2) => num2 === 0 ? "Não se pode dividir por zero" : num1 * num2
/**
* NOTA DE ESCLARECIMENTO
* O exercício pede para retornarmos "Não se pode dividir por zero" caso qualquer um dos dois números seja 0.
* No entanto, não se pode dividir um número por 0, mas é possível dividir 0 por qualquer número (que não seja 0).
*/
console.log(`Função dividir recebendo 10 e 2 retorna: ${dividir(10,2)}`)
console.log(`Função dividir recebendo 10 e 0 retorna: ${dividir(10,0)}`)
console.log(`Função dividir recebendo 0 e 10 retorna: ${dividir(0,10)}`)
console.log(`Função dividir recebendo 0 e 0 retorna: ${dividir(0,0)}`)
module.exports = dividir
- Criar um arquivo calculadora.js, em que devemos importar os quatro arquivos feitos anteriormente.
touch calculadora.js && code ./calculadora.js
const somar = require('./somar')
const subtrair = require('./subtrair')
const multiplicar = require('./multiplicar')
const dividir = require('./dividir')
- Executar a função que permite somar e a função que permite subtrair, passando como argumentos dois números quaisquer. Mostrar no console os resultados.
console.log(`Função somar recebendo 1 e 2 retorna: ${somar(1,2)}`)
console.log(`Função subtrair recebendo 10 e 2 retorna: ${subtrair(10,2)}`)
- Executar a função que permite multiplicar, passando como argumentos dois números quaisquer. Mostrar no console o resultado.
console.log(`Função multiplicar recebendo 10 e 2 retorna: ${multiplicar(10,2)}`)
- Executar a função que permite multiplicar, passando agora como um dos dois argumentos, o número zero. Mostrar no console o resultado.
console.log(`Função multiplicar recebendo 10 e 0 retorna: ${multiplicar(10,0)}`)
console.log(`Função multiplicar recebendo 0 e 10 retorna: ${multiplicar(0,10)}`)
console.log(`Função multiplicar recebendo 0 e 0 retorna: ${multiplicar(0,0)}`)
- Executar a função que permite dividir, passando como argumentos dois números quaisquer. Mostrar no console o resultado.
console.log(`Função dividir recebendo 10 e 2 retorna: ${dividir(10,2)}`)
console.log(`Função dividir recebendo 0 e 10 retorna: ${dividir(0,10)}`)
- Executar a função que permite dividir, passando agora como um dos dois argumentos, o número zero. Mostrar no console o resultado.
console.log(`Função dividir recebendo 10 e 0 retorna: ${dividir(10,0)}`)
console.log(`Função dividir recebendo 0 e 0 retorna: ${dividir(0,0)}`)
Práticas referentes a Aula 03
- Chegou o momento de deixarmos de utilizar o objeto literal integrado ao arquivo principal. Vamos modularizar essa nossa base de informações de filmes. Para isso crie, na pasta raíz do projeto, uma nova pasta chamada database (aqui será alocado qualquer arquivo que nos sirva como base de informações a serem consultadas).
mkdir database
- Crie, dentro da pasta, um arquivo chamado catalogo.json.
cd database && touch catalogo.json && code ./catalogo.json
- Passe para esse arquivo todos os registros criados por você no arquivo cinema.js. E exclua o objeto
catalogo
do arquivo citado.
Lembre-se de que a forma de escrita de objeto para JSON, apesar de serem bem parecidas, não são iguais.
[
{
"codigo": 1,
"titulo": "O Poderoso Chefão",
"duracao": 2.91,
"atores": [
"Al Pacino",
"Marlon Brando",
"Diane Keaton",
"Robert De Niro"
],
"anoDeLancamento": 1972,
"emCartaz": true
},
{
"codigo": 2,
"titulo": "O Mágico de Oz",
"duracao": 1.86,
"atores": [
"Judy Garland",
"Jack Haley",
"Bert Lahr",
"Frank Morgan"
],
"anoDeLancamento": 1939,
"emCartaz": false
}
]
- Perceba que ainda precisaremos das informações dos filmes para que as funções criadas no arquivo cinema.js funcione. Para isso você deve importar o arquivo JSON e armazená-los em uma variável.
const catalogo = require('./database/catalogo.json')
- Teste as funções novamente certificando-se de que a migração de arquivo e formato não prejudicou seu funcionamento.
node cinema.js
listarTodosOsFilmes
| A função deve percorrer toda a lista de filmes armazenada no catálogo utilizando o loopfor
e retornar as informações de maneira amigável ao usuário.
const listarTodosOsFilmes = () => {
for (let filme of catalogo) {
console.log(`
Título: ${filme.titulo}
Código: ${filme.codigo}
Ano: ${filme.anoDeLancamento}
Duração (hs): ${filme.duracao}
Atores: ${filme.atores.join(', ')}
Status: ${filme.emCartaz ? "Em cartaz" : "Não está em cartaz"}
`)
}
}
const testarListarTodosOsFilmes = () => listarTodosOsFilmes()
testarListarTodosOsFilmes()
listarFilmesEmCartaz
| A função deve percorrer toda a lista de filmes armazenada no catálogo utilizando o loopfor
e retornar os filmes disponíveis em cartaz - as informações de maneira amigável ao usuário.
const listarFilmesEmCartaz = () => {
for (let filme of catalogo) {
if (filme.emCartaz) {
console.log(`
Título: ${filme.titulo}
Código: ${filme.codigo}
Ano: ${filme.anoDeLancamento}
Duração (hs): ${filme.duracao}
Atores: ${filme.atores.join(', ')}
Status: ${filme.emCartaz ? "Em cartaz" : "Não está em cartaz"}
`)
}
}
}
const testarListarFilmesEmCartaz = () => listarFilmesEmCartaz()
testarListarFilmesEmCartaz()
alterarStatusEmCartaz
| A função deve receber como parâmetro o número identificador do filme escolhido, buscar o filme com base no parâmetro recebido e alterar o status existente da propriedadeemCartaz
(se estava comotrue
, alterar parafalse
, e vice e versa). O escopo é igual ao da aula passada, porém o desafio é ao invés de usarmos a estrutura condicionalif
que estamos habituados, mudar paraif
ternário.
const alterarStatusEmCartaz = codigo => {
for (let filme of catalogo) {
if (filme.codigo === codigo) {
console.log(`Status do filme ${filme.titulo} (código ${codigo}) antes: ${filme.emCartaz}`)
filme.emCartaz = filme.emCartaz ? false : true
console.log(`Status do filme ${filme.titulo} (código ${codigo}) depois: ${filme.emCartaz}`)
}
}
}
const testarAlterarStatusEmCartaz = () => {
alterarStatusEmCartaz(1)
alterarStatusEmCartaz(2)
}
testarAlterarStatusEmCartaz()
Algumas melhorias aplicadas, de acordo com o conteúdo apresentado no módulo.
CineHouse/cinema.js
const catalogo = require('./database/catalogo.json')
// const cinema = "CineMarco"
// console.log(cinema)
const adicionarFilme = filme => catalogo.push(filme)
const testarAdicionarFilme = () => {
console.log(`Antes da adição do novo filme ao catálogo, o catálogo possui ${catalogo.length} filmes.`)
adicionarFilme({
codigo: 3,
titulo: "Cidadão Kane",
duracao: 1.98,
atores: ["Orson Welles", "Joseph Cotten", "Dorothy Comingore", "William Alland"],
anoDeLancamento: 1941,
emCartaz: false
})
console.log(`Após adição do novo filme ao catálogo, o catálogo possui ${catalogo.length} filmes.`)
}
// testarAdicionarFilme()
const buscarFilme = codigo => {
let resultado = catalogo.filter(filme => filme.codigo == codigo)[0]
console.log(resultado ? `O filme de código ${codigo} se chama ${resultado.titulo}` : `Não existe filme cujo código seja ${codigo}`)
return resultado
}
const testarBuscarFilme = () => {
buscarFilme(1)
buscarFilme(2)
buscarFilme(3)
}
// testarBuscarFilme()
const alterarStatusEmCartaz = codigo => {
let resultado = buscarFilme(codigo)
if (resultado && resultado.titulo) {
let {
titulo,
emCartaz
} = resultado
console.log(`Status do filme ${titulo} (código ${codigo}) antes: ${emCartaz}`)
emCartaz = !emCartaz
console.log(`Status do filme ${titulo} (código ${codigo}) depois: ${emCartaz}`)
}
return resultado
}
const testarAlterarStatusEmCartaz = () => {
alterarStatusEmCartaz(1)
alterarStatusEmCartaz(2)
alterarStatusEmCartaz(3)
}
// testarAlterarStatusEmCartaz()
// Função de Apoio
const mostrarDetalhesFilme = filme => {
const {
titulo,
codigo,
anoDeLancamento,
duracao,
atores,
emCartaz
} = filme
return `
Título: ${titulo}
Código: ${codigo}
Ano: ${anoDeLancamento}
Duração (hs): ${duracao}
Atores: ${atores.join(', ')}
Status: ${emCartaz ? "Em cartaz" : "Não está em cartaz"}
`
}
const listarTodosOsFilmes = () => {
catalogo.forEach(filme => console.log(mostrarDetalhesFilme(filme)))
}
const testarListarTodosOsFilmes = () => listarTodosOsFilmes()
// testarListarTodosOsFilmes()
const listarFilmesEmCartaz = () => {
const filmesEmCartaz = catalogo.filter(filme => filme.emCartaz)
for (let filme of filmesEmCartaz) {
console.log(mostrarDetalhesFilme(filme))
}
}
const testarListarFilmesEmCartaz = () => listarFilmesEmCartaz()
// testarListarFilmesEmCartaz()
CineHouse/package.json
{
"name": "cinehouse",
"version": "1.0.0",
"description": "Prática CineHouse do módulo 02 - Introdução ao Node e JavaScript'",
"main": "cinema.js",
"scripts": {
"start": "node cinema.js",
"dev": "nodemon cinema.js"
},
"keywords": [
"node",
"javascript"
],
"author": "Marcelo Diament",
"license": "MIT",
"devDependencies": {
"nodemon": "^2.0.15"
}
}
Registro de alterações (em ordem cronológica decrescente).
-
doc: [#M2] Atualizando changelog Atualizando o changelog.
-
doc: [#M2] Adicionando resoluções a cada enunciado - 2 Atualizando o README.md com esoluções de cada etapa (Aula 03 e refatoração).
-
doc: [#M2] Adicionando resoluções a cada enunciado Atualizando o README.md com esoluções de cada etapa (Aulas 01 e 02).
-
doc: [#M2] Atualizando changelog com melhorias Atualizando o changelog.
-
chore: [#M2] Adicionando scripts start e dev Atualizando o package.json com scripts start (node) e dev (nodemon).
-
fix: [#M2] Ajustando indentação e comentando const não utilizada Atualizando o cinema.js comendando a variável
cinema
e ajustando indentação. -
refactor: [#M2] Refatorando
listarFilmesEmCartaz
usandofilter
,for/of
e a função de apoiomostrarDetalhesFilme
RefatorandolistarFilmesEmCartaz
usandofilter
,for/of
e a função de apoiomostrarDetalhesFilme
. -
refactor: [#M2] Refatorando
listarTodosOsFilmes
usandoforEach
,arrowFunction
e interpolação RefatorandolistarTodosOsFilmes
usandoforEach
,arrowFunction
e interpolação. -
refactor: [#M2] Refatorando
alterarStatusEmCartaz
usandobuscarFilme
e desestruturação RefatorandoalterarStatusEmCartaz
usandobuscarFilme
e desestruturação. -
refactor: [#M2] Refatorando
buscarFilme
comfilter
eif
ternário RefatorandobuscarFilme
comfilter
eif
ternário.
-
doc: [#M2] Atualizando changelog com o HotFix Atualizando o changelog.
-
hotfix: [#M2] Ajustando a função
adicionarFilme
Ajustando a funçãoadicionarFilme
- estava adicionando o catálogo ao invés do filme recebido como argumento.
-
doc: [#M2A03-pt02] Atualizando changelog da Parte 02 da Aula 03 do Módulo 02 Atualizando o changelog.
-
fix: [#M2A03-pt02] Comentando
testarAlterarStatusEmCartaz
Comentando o testetestarAlterarStatusEmCartaz
. -
feat: [#M2A03-pt02] Usando
if
ternário na funçãoalterarStatusEmCartaz
Atualizando a funçãoalterarStatusEmCartaz
para usar oif
ternário (ainda que a solução anterior fosse mais enxuta) e testando. -
feat: [#M2A03-pt02] Adicionando função
listarFilmesEmCartaz
Adicionando a funçãolistarFilmesEmCartaz
e testando. -
feat: [#M2A03-pt02] Adicionando função
listarTodosOsFilmes
Adicionando a funçãolistarTodosOsFilmes
e testando.
-
doc: [#M2A03-pt01] Atualizando changelog da Parte 01 da Aula 03 do Módulo 02 Atualizando o changelog.
-
feat: [#M2A03-pt01] Importando o catalogo em JSON para cinema.js Importando o JSON
catalogo
e testando as funções de cinema.js novamente. -
feat: [#M2A03-pt01] Movendo o array
catalogo
para um arquivo JSON em database/catalogo.json Movendo ocatalogo
para um arquivo à parte (catalogo.json) e realizando os ajustes necessários.
- doc: [#M2A03] Adicionando enunciados da Aula 03 do Módulo 02 Adicionando os enunciados da Aula 03 do Módulo 02 (projeto CineHouse) e atualizando o changelog.
- doc: [#M2A02] Adicionando enunciados da Aula 02 do Módulo 02 Adicionando os enunciados da Aula 02 do Módulo 02 (projetos CineHouse e Calculadora) e atualizando o changelog.
- doc: [#M2A01] Adicionando enunciados da Aula 01 do Módulo 02 Adicionando os enunciados da Aula 01 do Módulo 02 e atualizando o changelog.
- doc: [#M2A02-pt04] Adicionando documentação Adicionando detalhes sobre as etapas realizadas na parte 04, Calculadora (changelog).
-
feat: [#M2A02-pt04] Executando
dividir
- com num2 recebendo 0 - em calculadora.js Movendo o teste de dividir.js (usando num2 como 0) para calculadora.js. -
feat: [#M2A02-pt04] Executando
dividir
em calculadora.js Importando o arquivo dividir.js e movendo o teste de dividir.js para calculadora.js. -
feat: [#M2A02-pt04] Executando
multiplicar
em calculadora.js Importando o arquivo multiplicar.js e movendo o teste de multiplicar.js para calculadora.js. -
feat: [#M2A02-pt04] Executando
subtrair
em calculadora.js Importando o arquivo subtrair.js e movendo o teste de subtrair.js para calculadora.js. -
feat: [#M2A02-pt04] Executando
somar
em calculadora.js Importando o arquivo somar.js e movendo o teste de somar.js para calculadora.js. -
feat: [#M2A02-pt04] Adicionando arquivo calculadora.js Criando o arquivo
calculadora.js
.
-
fix: [#M2A02-pt03] Ajustando título da etapa de documentaçao da Calculadora no changelog Atualizando o título "Módulo 02 - Aula 02 - Calculadora | Extra" e atualizando o changelog.
-
doc: [#M2A02-pt03] Adicionando documentação Adicionando detalhes sobre as etapas realizadas na parte 03, Calculadora (changelog).
-
feat: [#M2A02-pt03] Adicionando função
dividir
com condicional e testando Criando a funçãodividir
- que recebe 2 números e retorna a divisão (a menos que o segundo número seja 0) - e testando. -
feat: [#M2A02-pt03] Adicionando função
multiplicar
e testando Criando a funçãomultiplicar
- que recebe 2 números e retorna a multiplicação - e testando. -
feat: [#M2A02-pt03] Adicionando função
subtrair
e testando Criando a funçãosubtrair
- que recebe 2 números e retorna a subtração - e testando. -
feat: [#M2A02-pt03] Criando projeto Calculadora, adicionando função
somar
e testando Criando a pastaCalculadora
e a funçãosomar
- que recebe 2 números e retorna a soma - e testando.
- doc: [#M2A02] Adicionando documentação Adicionando detalhes sobre as etapas realizadas (changelog).
-
feat: [#M2A02-pt02] Adicionando função
alterarStatusEmCartaz
e testando Criando a funçãoalterarStatusEmCartaz
- que recebe um código e modifica o valor da propriedadeemCartaz
- e testando. -
feat: [#M2A02-pt02] Adicionando função
buscarFilme
e testando Criando a funçãobuscarFilme
- que recebe um código e retorna o filme identificado - e testando. -
feat: [#M2A02-pt02] Adicionando função
adicionarFilme
e testando Criando a funçãoadicionarFilme
- que recebe um objeto com um novo filme e adiciona aocatalogo
- e testando.
- feat: [#M2A02-pt01] Adicionando Array catalogo com 2 filmes
Atribuindo um array com 2 objetos (que representam filmes) à variável
catalogo
.
- doc: [#M2A01] Adicionando documentação Adicionando detalhes sobre a prática e as etapas realizadas (changelog).
-
feat: [#M2A01-pt02] Adicionando nodemon como dependência de desenvolvimento Instalando nodemon como devDependency com
npm i --save -D nodemon
. -
feat: [#M2A01-pt02] Exibindo valor da variável cinema com
console.log()
Exibindo o valor decinema
comconsole.log()
. -
feat: [#M2A01-pt02] Adicionando
package.json
Criação dopackage.json
.
- feat: [#M2A01-pt01] Adicionaendo nome do cinema
Criação da pasta CineHouse e do arquivo
cinema.js
. Criação da variávelcinema
, quer recebe o nome do cinema.