É um aplicativo web simples para criar e gerenciar notas de forma eficiente.
- Criar Notas: Você pode criar anotações facilmente usando a interface intuitiva do aplicativo.
- Salvar Notas: Todas as suas notas são salvas automaticamente no localStorage do seu navegador.
- Reconhecimento de Voz: Com o suporte à Web Speech API, você pode criar notas por meio de reconhecimento de voz. Basta falar e sua nota será transcrita em texto automaticamente.
- Deletar Notas: Se não precisar mais de uma nota você pode excluí-la.
- Pesquisar Notas: O recurso de pesquisa permite filtrar suas notas por palavras-chave, facilitando a localização da informação desejada.
Confira o layout original do projeto no Figma
- TypeScript: Linguagem de programação utilizada para desenvolver o aplicativo, proporcionando tipagem estática e melhorando a manutenção do código.
- React: Biblioteca JavaScript para criar interfaces de usuário, utilizada para desenvolver a interface do aplicativo.
- Tailwind CSS: Framework CSS utilizado para estilizar a interface do usuário de forma rápida e eficiente.
- Radix UI: Biblioteca de componentes React utilizada para criar componentes acessíveis e personalizáveis.
- Sonner: Biblioteca para criação de toaster, um alerta apresentado ao usuário.
- Lifting State Up do React: Aprendi a técnica de Lifting State Up do React, que me permitiu gerenciar o estado de forma eficiente em componentes pai e filhos.
- Propriedades de Estilização do Tailwind: Explorei as propriedades de estilização do Tailwind CSS, que me ajudaram a criar uma interface de usuário bonita e responsiva.
- Trabalho com APIs Nativas do Navegador: Aprofundei meus conhecimentos sobre como trabalhar com as APIs nativas do navegador, especialmente a Web Speech API, que me permitiu adicionar a funcionalidade de reconhecimento de voz ao aplicativo.
- Baixe o repositório para sua máquina local.
- Rode os seguintes comandos no terminal dentro do projeto:
npm install
npm run dev
- Acesse http://localhost:5173/
Obs.: A API de reconhecimento de voz só funciona em alguns navegadores, como: Chrome e Edge