Travel backpack

Índice

Descrição do projeto
Funcionalidades do projeto
Acesso ao projeto
Abrir e rodar o projeto
Processo de evolução do projeto
Ferramentas utilizadas
Desenvolvedores do Projeto

🛠️ Descrição do projeto

Foi feito um projeto de Mochila de Viagem para servir como lista de itens. No projeto Mochila de Viagem, os itens necessários podem ser cadastrados, não podemos esquecer e quando eu montar minha mochila ela estará lá segura. Esta lista pode ser editada. O Projeto Mochila de Viagem parece um formulário simples, onde você pode adicionar um nome, quantidade e adicionar um item. Mochila CSS design por Tricia Akatz.

🛠️ Funcionalidades do projeto

Funcionalidade 1: Adicionar itens para viagem
Funcionalidade 2: Remove itens para viagem
Funcionalidade 3: Soma itens para viagem

📁 Acesso ao projeto

Indique como é possível baixar ou acessar o código fonte do projeto, seja projeto inicial ou final

🛠️ Abrir e rodar o projeto

Apresente as instruções necessárias para abrir e executar o projeto

🛠️ Processo de evolução do projeto

Etapa 1

• Criamos o arquivo JavaScript com o nome: main.js;

• Desenvolvemos evento de interação que recebe dados passados pela pessoa usuária;

• Implementamos a primeira função do projeto que retorna os dados passados em uma lista e estilizados com elemento HTML.

Etapa 2

• Aprendemos na prática como refatorar nosso código melhorando a legibilidade;

• Alteramos os valores de uma lista em string utilizando o método JSON.stringify;

• Salvamos os itens enviados no localStorage em uma lista array

Etapa 3

• Aprendemos como utilizar o operador lógico “ou” || para retornar um tipo de dado desejado;

• Aprendemos como alterar valores de tipo texto, para valores JavaScript com o método JSON.parse;

• Aplicamos o método forEach() para manter os itens criados na página, mesmo após atualizá-la;

• Aprendemos em quais casos é recomendado utilizar localStorage.

Etapa 4

• Utilizar o operador de comparação ===;

• Utilizar o método find();

• Utilizar a condicional if, else;

• Atualizar itens, tanto no navegador, quanto no localStorage.

Etapa 5

• Aprendemos a criar um botão com evento de clique utilizando JS;

• Desenvolvemos uma função para deletar itens de um array, utilizando os métodos splice(), find() e remove();

• Refatoramos a condicional da const itemAtual

🛠️ Ferramentas utilizadas

Desenvolvedores do Projeto

_{Fernanda Corredera}

fernanda1102/TravelBackpack