Bookmark Manager

Gerenciador de favoritos (Raindrop clone).

Pré-requisitos

• Node.js 16+.
• Criar o projeto com qualquer biblioteca/frameworks de sua preferência.
• Utilizar o "bom e velho" CSS e JS (mostre suas habilidades! Nada de componentes prontos 😉).

Passos

• Criar a interface baseada no protótipo do Figma.
• Utilizar o endpoint /api/extract para obter os metadados das URLs.
• Utilizar json-server para salvar os favoritos.

Observações:

- Consulte o código na pasta "src" para exemplo de uso dos endpoints (execute "npm start").
- O JSON server obedece os padrões REST. Verifique a documentação para exemplos de uso.

Sugestões

• Utilize animações CSS;
• Utilize alguma metodologia de organização de CSS (BEM, SMACSS, SuitCSS, etc — Seja consistente!);
• Procure deixar os componentes ou funções reutilizáveis (evite acoplamento);
• Se possível, faça code splitting 🔥;
• Se possível, crie teste unitários 🤩;
• Em caso de dúvida, verifique como funciona o Raindrop.

O que será avaliado

• Aplicativo rodando 😝
• Responsividade;
• Fidelidade ao protótipo;
• Domínio de CSS e JS;
• Estrutura do código (padrões, estrutura de pastas, etc);
• Uso de boas práticas (legibilidade, código limpo, etc);
• Funcionalidades adicionais são bem-vindas (use sua criatividade).

Resultado esperado

-- Empty State

-- Menu hover

-- Menu active

-- Menu actions

-- Add/Edit group

-- Add URL