A Memoteca é um aplicativo organizador de pensamentos e frases que permite cadastrar, listar, editar, deletar, filtrar e favoritar pensamentos, incluindo informações como conteúdo, autoria e data.
| 🪧 Vitrine.Dev | |
|---|---|
| ✨ Nome | Memoteca |
| 🏷️ Tecnologias | JavaScript |
| 🚀 URL | https://andreduarte99.github.io/memoteca-parte2/ |
| 🔥 Desafio | https://cursos.alura.com.br/course/javascript-implementando-crud-requisicoes-http |
Cadastro de pensamentos: Permite adicionar novos pensamentos à lista, inserindo informações como conteúdo e autoria.
Listagem de pensamentos: Exibe os pensamentos cadastrados, permitindo visualizar o texto e a autoria.
Edição de pensamentos: Permite editar pensamentos existentes, atualizando as informações conforme necessário.
Exclusão de pensamentos: Permite remover pensamentos da lista.
Busca typeahead: Implementa uma funcionalidade de busca com sugestões automáticas, permitindo filtrar pensamentos conforme a pessoa digita.
Favoritar pensamentos: Adiciona a opção de favoritar pensamentos, destacando os favoritos na lista para fácil acesso.
Validações de formulário com Regex: Utiliza expressões regulares para validar campos do formulário, garantindo que os dados inseridos estejam no formato correto antes do envio.
Cadastro e manipulação de data: Permite registrar a data do pensamento no momento do cadastro, garantindo que cada pensamento esteja associado a um timestamp.
JavaScript: Linguagem de programação utilizada para desenvolver a lógica do aplicativo.
Fetch API: Utilizada para realizar requisições HTTP para comunicação com o servidor.
Axios: Biblioteca usada para facilitar e simplificar as requisições HTTP.
Node.js: Plataforma utilizada para executar o ambiente de desenvolvimento.
JSON Server: Utilizado para simular um backend e facilitar o desenvolvimento e teste das operações CRUD.
CSS: Utilizado para estilização da interface do aplicativo.
Você pode acessar o figma do projeto aqui.
Para executar a API fake, você vai precisar do NodeJS; a versão utilizada foi a 20.12.2.
Instale o JSON Server globalmente (se ainda não estiver instalado):
npm install -g json-serverPara executar, abra um novo terminal e, dentro da pasta backend, execute:
npm startAcesse o backend localmente em seu navegador:
Para executar o frontend, abra o projeto no Visual Studio Code. Com a extensão Live Server instalada, clique com o botão direito no arquivo index.html e selecione "Open with Live Server" no menu de contexto.
Acesse o frontend localmente em seu navegador: