ADMIN - Pizzaria Bella Pizza 🍕

Bella Pizza - ADMIN é um site que administra uma pizzaria fictícia e oferece uma boa experiência de gestão de pedidos e produtos. Desenvolvido com React.js, Supabase, Tailwind CSS e várias outras tecnologias, este projeto proporciona uma interface interativa e moderna.

Clique aqui para visitar o vídeo do projeto

Important

Infelizmente este site não ficará disponível para acesso, pois basicamente ele tem acesso ao "CRUD" do banco de dados.

Tecnologias Utilizadas

React.js: Biblioteca javascript que trabalha com componentização.
Supabase: Plataforma de banco de dados backend para autenticação e gerenciamento de dados.
Tailwind CSS: Framework CSS para criação de layouts responsivos e estilizados.
date-fns: Biblioteca para manipulação de datas.
React Icons: Biblioteca para ícones React.
React Toastify: Biblioteca para exibição de notificações no estilo toast.
React Hook Form: Biblioteca para gerenciamento de formulários e validação.
Framer Motion: Biblioteca para animações no React.
Context API
Reducer

Funcionalidades do Painel Administrativo

Dashboard Analítico: Visualização de métricas chave como total de vendas, pedidos concluídos e cancleados, e produtos mais vendidos com gráficos dinâmicos utilizando Recharts.js.
Área do Pizzaiolo: Exibição em tempo real dos pedidos em preparo, com atualização manual para conclusão dos pedidos em preparo.
Gestão de Pedidos: Sistema para criar, editar e gerenciar pedidos, incluindo a adição de itens, personalização de pizzas e alteração de status com validação avançada usando React Hook Form.
Gerenciamento de Produtos: Interface para adicionar, editar ou remover produtos do menu, com suporte a upload de imagens, categorização de produtos e controle de disponibilidade.
Controle de Usuários: Ferramenta para criar usuários.
Configurações do Sistema: Seção para ajustar as configurações gerais do sistema, como tempo de entrega, valor da entrega e valor da borda, com validação de dados e feedback ao usuário via React Toastify.
Animações e Feedbacks Interativos: Uso de Framer Motion para criar transições suaves e animações ao navegar entre seções do painel, melhorando a experiência do usuário.