https://github.com/geovaneborba/desafio-ignite-todo-app

Desafio realizado durante o programa ignite da Rocketseat
https://github.com/geovaneborba/desafio-ignite-todo-app

Last synced: about 1 month ago
JSON representation

Desafio realizado durante o programa ignite da Rocketseat

• Host: GitHub
• URL: https://github.com/geovaneborba/desafio-ignite-todo-app
• Owner: geovaneborba
• License: mit
• Created: 2023-03-13T22:44:12.000Z (almost 2 years ago)
• Default Branch: master
• Last Pushed: 2023-03-14T14:08:28.000Z (almost 2 years ago)
• Last Synced: 2024-11-10T19:13:16.003Z (about 1 month ago)
• Language: TypeScript
• Homepage: https://geovaneborba-todo-app.vercel.app/
• Size: 80.1 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        




  

   

  





  Sobre   |  

  Tecnologias   |  

   Pré requisitos   |  

  Começando   |  

  Licença   |  

  Autor






## :dart: Sobre



  Desafio realizado durante o programa ignite da Rocketseat  :rocket:, onde

  foi solicitado o desenvolvimento de uma aplicação de controle de tarefas no estilo to-do list, que contém as seguintes funcionalidades:

- Adicionar uma nova tarefa

- Marcar e desmarcar uma tarefa como concluída

- Remover uma tarefa da listagem

- Mostrar o progresso de conclusão das tarefas

Apesar de parecer poucas funcionalidades foi trabalhado conceitos importantes do react como por exemplo:

- Estados

- Imutabilidade do estado

- Listas e chaves no ReactJS

- Propriedades

- Componentização

🎯 Clique aqui para acessar o desafio ⬅️

Além de concluir o desafio eu também andei a milha extra e então adicionei uma funcionalidade para salvar as tarefas no localStorage utilizando um hook do React chamado useEffect, ele fica monitorando o array de tarefas, assim que uma nova tarefa for adicionada ele salva no localStorage. Quando a aplicação é executada pela primeira o estado de tarefas tenta buscar as informações no localStorage, caso não tenha nenhuma tarefa salva lá, então ele começa seu estado como um array vazio. Isso ajuda nos casos do usuário fechar a aplicação sem querer e perder todas suas tarefas...



(Voltar para o topo)


## :rocket: Tecnologias

As seguintes tecnologias foram usadas na construção do projeto:

- [Vite](https://vitejs.dev/)

- [React](https://reactjs.org/docs/getting-started.html)

- [TypeScript](https://www.typescriptlang.org/)

- [Eslint](https://eslint.org/)

- [Prettier](https://prettier.io/)

(Voltar para o topo)


## :warning: Pré-requisitos

Antes de começar, você precisa ter o [Git](https://git-scm.com) e o [Node](https://nodejs.org/en/) instalados em sua maquina.

(Voltar para o topo)


## :checkered_flag: Começando

```bash

# Clone este repositório

$ git clone https://github.com/geovaneborba/ignite-todo-app.git

# Entre na pasta

$ cd ignite-todo-app

# Instale as dependências

$ npm install

# Para iniciar o projeto

$ npm run dev

# O app vai inicializar e será informado no terminal o endereço e porta onde estará rodando a aplicação

# geralmente é http://localhost:5173/

```

(Voltar para o topo)


## :memo: Licença

Este projeto está sob licença MIT. Veja o arquivo [LICENSE](LICENSE.md) para mais detalhes.

(Voltar para o topo)


Feito com ❤️ por Geovane Borba