An open API service indexing awesome lists of open source software.

https://github.com/maryucha/crudfirebase


https://github.com/maryucha/crudfirebase

Last synced: 10 months ago
JSON representation

Awesome Lists containing this project

README

          

# Cadastro de PRODUTOS

Nesse projeto estava buscando praticar um pouco mais sobre o angular então trouxe a proposta de fazer um CRUD bássico com:
- [ x] home
- [ x] Listagem de Produtos
- [ x] Editar
- [ x] Criar produtos
- [ x] 404Error

-MEUS DESAFIOS
- [ x] Usar o Angular
- [ x] Consumir do Firebase
- [ x] Usar HTML
- [ x] CSS
- [ x] Responsividade
- [ x] Build e Deploy

● Rodando [Visite](https://crud-a7c55.web.app/)

E a proposta de desenvolvimento para o front era seguir o seguinte padrão
--TELA HOME
![Home](https://github.com/Maryucha/crudFirebase/blob/addimagem/crud/imagens/home.png?raw=true)
--TELA DE FORMULÁRIO
![Formulário](https://github.com/Maryucha/crudFirebase/blob/addimagem/crud/imagens/formulario.png?raw=true)
--TELA DE LISTAGEM
![Listagem](https://github.com/Maryucha/crudFirebase/blob/addimagem/crud/imagens/listagem.png?raw=true)
--TELA DE EDIÇÃO
![Edição](https://github.com/Maryucha/crudFirebase/blob/addimagem/crud/imagens/edite.png?raw=true)
--TELA DE ERRO
![ERRO404](https://github.com/Maryucha/crudFirebase/blob/addimagem/crud/imagens/erro404.png?raw=true)

# O que foi feito

- [ x] Permitir edição;
- [ x] HTML máximo possível semântico;
- [ x] CSS bem estruturado;
- [ x] Código limpo e bem organizado;

Completei todas as tarefas básicas e algumas extras:
Feedbacks visuais para o usuário (alertas, inputs...);

# Tecnologias

ANGULAR | TYPESCRIPT | BOOTSTRAP | ANGULAR MATERIAL | HTML | CSS | FIREBASE
![ANGULAR](https://github.com/Maryucha/ProjetoTesteEstagio/blob/master/imagens/Angular_full_color_logo.svg.png?raw=true) ![Bootstrap](https://github.com/Maryucha/ProjetoTesteEstagio/blob/master/imagens/Bootstrap_logo.svg.png?raw=true) ![TypeScrip](https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Typescript_logo_2020.svg/32px-Typescript_logo_2020.svg.png) ![HTML5](https://upload.wikimedia.org/wikipedia/commons/thumb/6/61/HTML5_logo_and_wordmark.svg/32px-HTML5_logo_and_wordmark.svg.png) ![CSS3](https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/CSS3_logo_and_wordmark.svg/16px-CSS3_logo_and_wordmark.svg.png)