📖 The Living Library

Uma aplicação full stack onde você interage com um livro 3D animado que abre revelando sua biblioteca pessoal de livros!

✨ Funcionalidades

• 📚 Livro 3D Animado com abertura realista usando Framer Motion
• 🔍 Busca Inteligente via Google Books API no footer
• 💾 Persistência com Spring Boot + H2 Database
• 🎨 Design Profissional com Tailwind CSS
• 🚀 API RESTful completa com validação e tratamento de erros
• ⚡ Atualização em Tempo Real da biblioteca
• 🎯 Seeding Automático de dados iniciais

🏗️ Arquitetura

Backend (Spring Boot)

backend/
├── src/main/java/com/biblioteca/
│   ├── LivingLibraryApplication.java
│   ├── config/
│   │   └── DatabaseSeeder.java
│   ├── controller/
│   │   └── BookController.java
│   ├── dto/
│   │   ├── BookRequestDTO.java
│   │   └── BookResponseDTO.java
│   ├── exception/
│   │   ├── BookAlreadyExistsException.java
│   │   ├── BookNotFoundException.java
│   │   ├── ErrorResponse.java
│   │   └── GlobalExceptionHandler.java
│   ├── model/
│   │   └── Book.java
│   ├── repository/
│   │   └── BookRepository.java
│   └── service/
│       └── BookService.java
└── src/main/resources/
    └── application.properties

Frontend (React + Vite)

frontend/
├── src/
│   ├── components/
│   │   ├── Book3D.jsx       # Livro 3D animado
│   │   └── SearchFooter.jsx  # Busca do Google Books
│   ├── services/
│   │   └── api.js            # Integração com APIs
│   ├── App.jsx
│   ├── main.jsx
│   └── index.css
├── index.html
├── tailwind.config.js
├── vite.config.js
└── package.json

🚀 Como Executar

Pré-requisitos

• Java 17+ instalado
• Maven instalado
• Node.js 18+ e npm instalados

1️⃣ Backend (Spring Boot)

# Navegue até a pasta do backend
cd backend

# Execute o projeto com Maven (Windows)
mvnw.cmd spring-boot:run

# OU no Linux/Mac
./mvnw spring-boot:run

O backend estará rodando em: http://localhost:8080

Console H2 Database: http://localhost:8080/h2-console

• JDBC URL: jdbc:h2:mem:livinglibrary
• Username: sa
• Password: (deixe em branco)

2️⃣ Frontend (React)

# Navegue até a pasta do frontend
cd frontend

# Instale as dependências
npm install

# Inicie o servidor de desenvolvimento
npm run dev

O frontend estará rodando em: http://localhost:3000

🎯 Endpoints da API

Método	Endpoint	Descrição
GET	/api/books	Lista todos os livros
GET	/api/books/{id}	Busca livro por ID
POST	/api/books	Adiciona novo livro
PUT	/api/books/{id}	Atualiza livro
DELETE	/api/books/{id}	Remove livro

Exemplo de Request (POST)

{
  "title": "Clean Code",
  "author": "Robert C. Martin",
  "description": "Um guia para escrever código limpo",
  "coverImageUrl": "https://...",
  "publishedDate": "2008",
  "isbn": "9780132350884",
  "pageCount": 464,
  "language": "en",
  "googleBooksId": "hjEFCAAAQBAJ"
}

🎨 Como Usar a Aplicação

1. Abra o navegador em http://localhost:3000
2. Clique no livro para abri-lo e ver sua biblioteca
3. Use o footer para buscar livros no Google Books
4. Clique em "+ Adicionar" nos resultados para salvar na biblioteca
5. Clique no "×" sobre um livro para removê-lo
6. Clique em "Fechar Livro" para fechar a visualização

🎭 Tecnologias Utilizadas

Backend

• Spring Boot 3.2.2 - Framework principal
• Spring Data JPA - Persistência de dados
• H2 Database - Banco de dados em memória
• Lombok - Redução de boilerplate
• Bean Validation - Validação de dados

Frontend

• React 18.2 - Biblioteca UI
• Vite - Build tool rápida
• Tailwind CSS - Estilos utilitários
• Framer Motion - Animações fluidas
• Axios - Cliente HTTP
• Google Books API - Busca de livros

🎪 Destaques da Animação 3D

O livro 3D utiliza:

• perspective: 2000px para profundidade
• rotateY: -120deg para abrir a capa
• transformStyle: preserve-3d para manter o 3D
• backfaceVisibility: hidden para ocultar face traseira
• Transições suaves com easing personalizado
• AnimatePresence para entrada/saída fluida de conteúdo

🔒 Segurança & CORS

O backend está configurado com @CrossOrigin(origins = "http://localhost:3000") para desenvolvimento. Para produção, ajuste para o domínio específico.

📝 Personalização

Alterar cores do livro

Edite tailwind.config.js:

colors: {
  'book-brown': '#8B4513',
  'book-dark': '#654321',
  'page-cream': '#FFFEF0',
}

Adicionar mais livros iniciais

Edite DatabaseSeeder.java

Alterar porta do backend

Edite application.properties:

server.port=8080

🐛 Troubleshooting

Erro de CORS: Verifique se o backend está rodando na porta 8080 e o frontend na 3000.

Livros não aparecem: Verifique o console do navegador e os logs do Spring Boot.

Imagens não carregam: Algumas URLs do Google Books podem ser HTTP. A aplicação converte para HTTPS automaticamente.

📦 Build para Produção

Backend

cd backend
mvnw clean package
java -jar target/living-library-1.0.0.jar

Frontend

cd frontend
npm run build
# Os arquivos estarão em: frontend/dist/

🎓 Aprendizados do Projeto

• ✅ Arquitetura em camadas profissional (Controller → Service → Repository)
• ✅ DTOs para separação de responsabilidades
• ✅ Tratamento global de exceções
• ✅ Animações 3D complexas com Framer Motion
• ✅ Integração com APIs externas (Google Books)
• ✅ Design responsivo e moderno
• ✅ CRUD completo com validações

🌟 Melhorias Futuras

• Autenticação de usuários
• Categorização de livros
• Sistema de favoritos
• Avaliações e comentários
• Mode dark/light
• PWA (Progressive Web App)
• Deploy em cloud

📄 Licença

Este projeto foi criado para fins educacionais.

---

Desenvolvido com ❤️ usando Spring Boot e React

🔗 Ver no GitHub