> ## Documentation Index
> Fetch the complete documentation index at: https://docs.lumi.new/llms.txt
> Use this file to discover all available pages before exploring further.

# Glossário

> Compreenda os termos-chave para navegar e construir eficazmente com a Lumi.

## Conceitos-Chave

* AI (Inteligência Artificial): Tecnologia que permite que as máquinas simulem a inteligência humana, permitindo-lhes aprender, raciocinar e resolver problemas.
* Prompt: Um comando de texto usado para instruir um modelo de IA. Na Lumi, os prompts são a ferramenta fundamental que utilizará para criar e modificar cada componente da sua aplicação.

## Termos Específicos da Lumi

* **Modo de Discussão:** Mais do que um gerador de código, a Lumi atua como um parceiro de desenvolvimento interativo. Guia-o através do planeamento, depuração e lançamento, ajudando-o a construir com confiança.
* **Modo de Edição:** O ambiente para fazer alterações diretas ao código e conteúdo da sua aplicação.
* **Editar:** Uma ferramenta alimentada por IA com controlos visuais nativos do Tailwind para um refinamento preciso e intuitivo.
* **Remix:** Duplique qualquer projeto para usar como um novo ponto de partida. O Remixing permite-lhe experimentar alterações e explorar ideias, preservando a versão original.
* **Pré-visualização:** Uma vista interativa e em tempo real para testar funcionalidades e conteúdo antes de publicar as suas alterações.

## Produto e Desenvolvimento

### **Gestão de Produto e Estratégia**

* **MVP (Produto Mínimo Viável):** A versão mais simples de um produto com funcionalidades suficientes para atrair os primeiros utilizadores e validar a ideia central.
* **Roadmap:** Um plano de alto nível que descreve a visão, direção e futuras funcionalidades de um produto ao longo do tempo.
* **Pedido de Funcionalidade:** Uma sugestão de utilizadores ou partes interessadas para uma nova capacidade ou melhoria.
* **História de Utilizador:** Uma descrição breve e simples de uma funcionalidade da perspetiva do utilizador final.
* **Jornada do Utilizador:** O caminho que um utilizador percorre para atingir um objetivo dentro do seu produto.
* **Persona:** Um perfil detalhado e fictício de um utilizador-alvo, criado a partir de pesquisa para orientar as decisões de design e desenvolvimento.

### **Conceitos de Engenharia**

* **PRD (Documento de Requisitos do Produto):** Um documento que detalha o propósito, as funcionalidades e as especificações técnicas de um produto para orientar a equipa de desenvolvimento.
* **API (Interface de Programação de Aplicações):** Um conjunto de regras que permite que diferentes aplicações de software comuniquem e troquem dados. Os tipos comuns incluem APIs REST e GraphQL.
* **Refatorizar:** O processo de reestruturar o código para melhorar a sua qualidade e manutenibilidade sem alterar a sua funcionalidade.
* **GitHub:** Uma plataforma popular para controlo de versões e desenvolvimento de software colaborativo.

### **Dados e Análise**

* **Teste A/B:** Comparar duas versões de uma página web ou funcionalidade para ver qual delas tem melhor desempenho.
* **Taxa de Conversão:** A percentagem de utilizadores que concluem um objetivo específico, como inscrever-se ou fazer uma compra.
* **Taxa de Abandono (Churn Rate):** A percentagem de utilizadores que deixam de usar o seu produto durante um período específico.
* **Taxa de Retenção:** A percentagem de utilizadores que continuam a usar o seu produto ao longo do tempo.
* **Rastreamento de Eventos:** Monitorizar ações específicas do utilizador (como cliques ou submissões de formulários) para compreender o envolvimento.

## **UI/UX e Desenvolvimento Frontend**

### **Desenvolvimento Frontend**

* **Frontend:** A parte de uma aplicação que os utilizadores veem e com a qual interagem, incluindo a interface do utilizador e a experiência geral.
* **React:** Uma biblioteca JavaScript popular para construir interfaces de utilizador dinâmicas, especialmente para aplicações de página única.
* **Gradiente:** Uma transição suave entre duas ou mais cores.
* **Tailwind CSS:** Uma framework CSS "utility-first" para construir rapidamente designs personalizados diretamente no seu HTML.
* **Sistema de Design:** Uma coleção padronizada de componentes reutilizáveis e diretrizes que garante a consistência do design em todo o produto.

### **Conceitos de Design UI/UX**

* **Cor de Destaque:** Uma cor contrastante usada para realçar elementos-chave como botões ou links.
* **Tema:** A aparência geral de uma aplicação, definida pelo seu esquema de cores, tipografia e layout.
* **Design Responsivo:** Uma abordagem que garante que a sua aplicação tenha uma boa aparência e funcione bem em qualquer dispositivo, desde computadores de secretária a telemóveis.
* **Acima da Dobra (Above the Fold):** O conteúdo visível numa página web sem necessidade de rolar. É um espaço privilegiado para informações importantes.
* **CTA (Chamada para Ação):** Um apelo, como um botão ou link, que incentiva os utilizadores a realizar uma ação específica (por exemplo, "Inscrever-se", "Comprar Agora").

### **Estrutura da Página e Navegação**

* **Títulos:** Títulos (H1, H2, etc.) que estruturam o conteúdo e estabelecem uma hierarquia visual clara.
* **Rodapé:** A secção na parte inferior de uma página web, que normalmente contém links, informações de contacto e avisos legais.
* **Breadcrumb:** Um rasto de navegação que mostra a localização atual de um utilizador num site (por exemplo, Início > Produtos > Portáteis).
* **Favicon:** O pequeno ícone que representa o seu site no separador do navegador ou nos favoritos.
* **Meta Título:** O título da página exibido nos resultados dos motores de busca e nos separadores do navegador, crucial para SEO.
* **Meta Descrição:** O breve resumo de uma página web mostrado nos resultados de busca para atrair cliques.
* **URL Canónico:** Uma tag que informa os motores de busca sobre a versão preferida de uma página para evitar problemas de conteúdo duplicado.
* **Slug do URL:** A parte amigável de um URL que identifica uma página específica (por exemplo, `/sobre-nos`).
* **Sitemap:** Um ficheiro que lista todas as páginas do seu site para ajudar os motores de busca a indexá-las eficazmente.
* **Barra de Navegação (Nav Bar):** O menu principal que fornece links para as secções principais do seu site.
* **Links de Salto:** Links de acessibilidade que permitem aos utilizadores contornar a navegação e saltar diretamente para o conteúdo principal.
* **Paginação:** Um sistema para dividir longas listas de conteúdo em páginas separadas.
* **Link Âncora:** Um link que leva o utilizador a uma secção específica na mesma página.
* **Página 404:** Uma página de erro personalizada exibida quando um utilizador tenta aceder a um URL que não existe.

### **Notificações e Feedback**

* **Toast:** Uma notificação pequena e temporária que fornece feedback breve sobre uma ação.
* **Snackbar:** Semelhante a um toast, mas aparece frequentemente na parte inferior do ecrã e pode incluir um botão de ação (por exemplo, "Desfazer").
* **Tooltip:** Uma caixa pop-up com informações extra que aparece ao passar o rato sobre um elemento.
* **Emblema (Badge):** Um pequeno marcador visual num ícone ou botão para indicar uma contagem, estado ou notificação.
* **Spinner de Carregamento:** Um ícone animado que indica que um processo está a decorrer em segundo plano.
* **Barra de Progresso:** Uma barra visual que mostra o progresso da conclusão de uma tarefa.
* **Skeleton Loader:** Uma UI de placeholder que imita o layout do conteúdo final, melhorando a perceção da velocidade de carregamento.

### **Sobreposições e Pop-ups**

* **Popover:** Uma sobreposição que fornece contexto adicional ou opções relacionadas com um elemento específico.
* **Diálogo (Modal):** Uma janela que aparece sobre o conteúdo principal, exigindo a interação do utilizador para ser fechada.
* **Gaveta (Painel Lateral):** Um painel que desliza da lateral, contendo normalmente navegação ou definições.
* **Lightbox:** Uma janela modal que exibe multimédia, como imagens, numa vista focada e ampliada.
* **Caixa de Alerta:** Uma mensagem do sistema que informa os utilizadores sobre informações críticas, erros ou avisos.

### **Navegação e Seleção**

* **Botão:** Um elemento clicável que desencadeia uma ação.
* **Interruptor (Toggle):** Um controlo que permite aos utilizadores alternar entre dois estados, como ligado e desligado.
* **Separadores (Tabs):** Um componente que organiza o conteúdo em diferentes vistas entre as quais um utilizador pode alternar.
* **Stepper (Assistente):** Um processo guiado de múltiplos passos que mostra aos utilizadores o seu progresso.
* **Acordeão:** Uma série de painéis recolhíveis usados para organizar e revelar conteúdo.
* **Menu Suspenso (Dropdown):** Uma lista de opções que aparece quando um utilizador interage com um botão ou campo.

### **Formulários e Entrada de Dados**

* **Formulário:** Um conjunto de campos para recolher dados do utilizador, como um formulário de inscrição ou de contacto.
* **Grupo de Botões de Rádio:** Um conjunto de opções onde o utilizador pode selecionar apenas uma.
* **Caixa de Seleção (Checkbox):** Um controlo que permite aos utilizadores selecionar uma ou mais opções de uma lista.
* **Campo de Texto:** Uma caixa de entrada padrão para a inserção de texto de uma única linha.
* **Área de Texto:** Uma caixa de entrada maior para texto de várias linhas, como comentários ou mensagens.
* **Select (Caixa de Seleção Suspensa):** Uma lista suspensa para escolher uma opção de um conjunto predefinido.
* **Seletor de Data:** Uma interface de calendário que permite aos utilizadores selecionar uma data facilmente.
* **Slider:** Um controlo para selecionar um valor de um intervalo contínuo.
* **Carregamento de Ficheiros:** Um componente que permite aos utilizadores carregar ficheiros do seu dispositivo.
* **Preenchimento Automático (Autocomplete):** Um campo de entrada que sugere resultados à medida que o utilizador digita.

### **Estilos e Tendências de Design**

Use estes termos nos seus prompts para definir a estética que deseja alcançar.

* **Neobrutalismo:** Um estilo de design cru, de alto contraste, com tipografia arrojada e elementos não refinados.
* **Retro:** Um design que evoca nostalgia ao usar estilos de décadas passadas.
* **Hacker:** Uma estética inspirada em interfaces de terminal, com fundos escuros e fontes monoespaçadas.
* **Glassmorfismo:** Um estilo que usa camadas translúcidas, semelhantes a vidro fosco, para criar profundidade.
* **Nudy:** Uma abordagem minimalista que usa paletas de cores suaves e neutras para um visual discreto.

## **Desenvolvimento Backend e Bases de Dados**

### **Fundamentos de Backend**

* **Backend:** O lado do servidor de uma aplicação que lida com dados, lógica e operações centrais.
* **Webhooks:** Mensagens automatizadas enviadas por aplicações quando algo acontece, permitindo a troca de dados em tempo real.

### **Gestão de Bases de Dados**

* **CRUD (Create, Read, Update, Delete):** As quatro operações fundamentais para gerir dados.
* **SQL (Structured Query Language):** A linguagem padrão para gerir e consultar dados em bases de dados relacionais.
* **PostgreSQL:** Uma poderosa base de dados relacional de código aberto, conhecida pela sua fiabilidade e funcionalidades avançadas.

### **Segurança e Autenticação**

* **OAuth:** Um padrão de autenticação que permite aos utilizadores iniciar sessão com contas de terceiros, como Google ou GitHub.
* **Autenticação de Dois Fatores (2FA):** Uma camada de segurança que exige que os utilizadores forneçam duas formas de identificação para iniciar sessão.
* **CORS (Cross-Origin Resource Sharing):** Um mecanismo de segurança que controla como os recursos no seu servidor podem ser acedidos a partir de outros domínios.