Visão geral
Aplicação web de lista de tarefas desenvolvida com HTML5, CSS3 e JavaScript puro. Utiliza manipulação da DOM para gerenciar tarefas dinamicamente e a LocalStorage API para persistência dos dados. Possui validação de entrada, controle de estado (concluído/pendente) e interface responsiva com media queries. Projeto leve, sem frameworks e de fácil manutenção.
Sobre o Projeto
Este projeto é uma aplicação de lista de tarefas (to-do list) simples e direta, construída apenas com tecnologias de front-end. O foco é produtividade com interface limpa e interações objetivas:
- Adicionar tarefas rapidamente.
- Marcar tarefas como concluídas com um clique.
- Remover tarefas instantaneamente.
- Manter tarefas salvas no LocalStorage do navegador.
- Interface responsiva para desktop e mobile.
Destaques do Projeto
Mesmo com estrutura mínima, ele entrega um fluxo completo para o dia a dia:
- Zero complexidade de framework.
- Carregamento rápido e código leve.
- Feedback visual intuitivo para ações do usuário.
- Persistência prática sem necessidade de backend.
Funcionalidades
- Criar nova tarefa.
- Validar campos vazios.
- Marcar tarefa como concluída/não concluída.
- Excluir tarefas.
- Persistir tarefas após atualizar a página.
- Experiência responsiva para diferentes dispositivos.
Tecnologias Utilizadas
HTML5
Estrutura semântica da interface
CSS3
Layout, estilos e estados visuais
JavaScript (Vanilla)
Lógica das tarefas e atualização dinâmica da DOM
Local Storage API
Persistência de dados no navegador
Font Awesome
Ícone de lixeira para exclusão de tarefas
Google Fonts (Poppins)
Tipografia personalizada
Resumo Técnico
Aplicação web de lista de tarefas (To-Do List) desenvolvida utilizando HTML5, CSS3 e JavaScript puro (Vanilla JS), sem dependência de frameworks. O sistema implementa manipulação dinâmica da DOM para criação, atualização e remoção de tarefas em tempo real. A persistência dos dados é realizada por meio da LocalStorage API, garantindo que as informações sejam mantidas mesmo após recarregamento da página. O projeto inclui validação de entrada, gerenciamento de estados (concluído/pendente) e feedback visual ao usuário. A interface é construída com foco em responsividade, utilizando media queries e separação de estilos (styles.css e mobile.css). Recursos adicionais incluem uso de Font Awesome para ícones e Google Fonts para tipografia, resultando em uma aplicação leve, performática e de fácil manutenção.