Aplicação web para gerenciar dados utilizando o padrão CRUD (Create, Read, Update e Delete). Desenvolvida com HTML, CSS e JavaScript, a aplicação permite a manipulação de dados diretamente na interface e salva as informações temporariamente no LocalStorage. As ações de criação, edição e exclusão são realizadas por meio de eventos, e os modais são utilizados para interações mais detalhadas com o usuário.
Funcionalidades Criar: Adicionar novos itens ao sistema. Ler: Visualizar a lista de itens cadastrados. Atualizar: Editar itens já existentes. Deletar: Remover itens da lista. Armazenamento temporário dos dados no LocalStorage. Exibição de modais para confirmar ou editar operações. Manipulação da DOM para refletir as mudanças na interface em tempo real.
Tecnologias Utilizadas HTML: Estruturação do formulário e dos elementos de interação. CSS: Estilização da aplicação e dos modais. JavaScript: Funções acionadas por eventos para gerenciar as operações CRUD. Uso de LocalStorage para armazenar os dados temporariamente. Manipulação dinâmica da DOM para atualizar a lista de itens conforme as ações do usuário.
Como Utilizar Clone este repositório:
bash Copiar código git clone https://github.com/RCysne/Form-CRUD.git Abra o arquivo index.html no seu navegador.
Utilize o formulário para adicionar novos itens à lista.
Após preencher o formulário, os dados serão salvos no LocalStorage e exibidos na página. É possível editar ou excluir qualquer item da lista utilizando os botões correspondentes. As alterações (criação, atualização ou exclusão) serão refletidas na interface em tempo real.
Estrutura do Projeto index.html: Contém a estrutura do formulário e da lista de itens. styles.css: Define o layout da página, estilos dos modais e aparência geral. script.js: Gerencia as operações CRUD, manipulação do DOM e integração com o LocalStorage.
Requisitos Navegador moderno com suporte a JavaScript ES6+.
Exemplo de Uso Adicione um novo item preenchendo o formulário e clicando em "Salvar". O item aparecerá na lista exibida na tela. Utilize os botões de "Editar" ou "Excluir" para modificar ou remover um item, e um modal será exibido para confirmar a ação.
Contribuição Contribuições são bem-vindas! Sinta-se à vontade para abrir issues, fazer forks ou enviar pull requests com melhorias.
