223 lines
4.8 KiB
Markdown
223 lines
4.8 KiB
Markdown
# 🚀 COMO RODAR - PASSO A PASSO
|
|
|
|
## ✅ O QUE FOI CORRIGIDO
|
|
|
|
- ✅ Bootstrap CSS adicionado (agora com formatação)
|
|
- ✅ Navbar adicionado (cabeçalho da página)
|
|
- ✅ Botões melhorados (maior, com emojis)
|
|
- ✅ Progress bar animada
|
|
- ✅ Debug logs detalhados
|
|
- ✅ Tratamento de erros melhorado
|
|
- ✅ Mensagens claras em português/emojis
|
|
|
|
## 🎯 INSTRUÇÕES EXATAS
|
|
|
|
### Passo 1: Abra o Terminal 1
|
|
|
|
```bash
|
|
cd /mnt/c/vscode/VideoStudy.app/VideoStudy.API
|
|
dotnet run
|
|
```
|
|
|
|
**Você deve ver:**
|
|
```
|
|
Building...
|
|
...
|
|
info: Microsoft.Hosting.Lifetime[14]
|
|
Now listening on: http://localhost:5000
|
|
Press CTRL+C to quit
|
|
```
|
|
|
|
✅ **Não feche este terminal! Deixe rodando.**
|
|
|
|
---
|
|
|
|
### Passo 2: Abra NOVO terminal (não o mesmo)
|
|
|
|
```bash
|
|
cd /mnt/c/vscode/VideoStudy.app/VideoStudy.Desktop/VideoStudy.Desktop
|
|
dotnet run
|
|
```
|
|
|
|
**Você deve ver:**
|
|
```
|
|
Building...
|
|
...
|
|
info: Microsoft.Hosting.Lifetime[14]
|
|
Now listening on: http://localhost:5001
|
|
Press CTRL+C to quit
|
|
```
|
|
|
|
✅ **Não feche este terminal! Deixe rodando.**
|
|
|
|
---
|
|
|
|
### Passo 3: Abra o Browser
|
|
|
|
Navegue para:
|
|
```
|
|
http://localhost:5001
|
|
```
|
|
|
|
**Agora você deve ver:**
|
|
- ✅ Navbar escura com "📺 VideoStudy"
|
|
- ✅ Card branco com formulário
|
|
- ✅ Campo de input para URL
|
|
- ✅ Seletor de idioma
|
|
- ✅ Botões "⚡ Fast Mode" e "🧠 Advanced Mode"
|
|
- ✅ Botão "📊 Analyze Video"
|
|
- ✅ Botão "🔄 Clear"
|
|
|
|
---
|
|
|
|
## 🧪 TESTAR A APP
|
|
|
|
### 1. Preencha os Dados
|
|
|
|
```
|
|
YouTube URL: https://www.youtube.com/watch?v=dQw4w9WgXcQ
|
|
Language: Portuguese
|
|
Mode: ⚡ Fast Mode (padrão)
|
|
```
|
|
|
|
### 2. Clique em "📊 Analyze Video"
|
|
|
|
### 3. Veja o que Acontece
|
|
|
|
Você deve ver:
|
|
- ✅ Barra de progresso animada (verde)
|
|
- ✅ Status mudando: "Preparing..." → "Connecting..." → "Parsing..." → "Analysis complete!"
|
|
- ✅ Debug logs aparecendo em tempo real
|
|
- ✅ Card com resultados (título, análise, etc)
|
|
|
|
**Exemplo de logs:**
|
|
```
|
|
[10:15:34] 🚀 Starting video analysis...
|
|
[10:15:34] 📝 API URL: http://localhost:5000/api/analyze
|
|
[10:15:34] ⚙️ Mode: fast | Language: pt
|
|
[10:15:34] 📡 API Response: 200
|
|
[10:15:34] ✓ Received response (456 bytes)
|
|
[10:15:34] ✓ Successfully deserialized response
|
|
```
|
|
|
|
---
|
|
|
|
## ❌ ERROS? AQUI ESTÁ A SOLUÇÃO
|
|
|
|
### Erro: "Cannot connect to API"
|
|
|
|
**Solução:**
|
|
1. Abra **DOIS terminais** separados
|
|
2. Terminal 1: `cd VideoStudy.API && dotnet run`
|
|
3. Espere a mensagem "Now listening on: http://localhost:5000"
|
|
4. Terminal 2: `cd VideoStudy.Desktop/VideoStudy.Desktop && dotnet run`
|
|
5. Espere a mensagem "Now listening on: http://localhost:5001"
|
|
6. Só depois abra o browser
|
|
|
|
### Erro: "Unhandled error has occurred"
|
|
|
|
**Solução:**
|
|
1. Pressione `F12` no browser (abre developer tools)
|
|
2. Vá para aba "Console"
|
|
3. Procure pela mensagem vermelha
|
|
4. Copie e compare com os Debug Logs da app
|
|
|
|
### Erro na porta (porta já está em uso)
|
|
|
|
**Verifique:**
|
|
```bash
|
|
# Encontrar processos nas portas
|
|
netstat -ano | findstr :5000 # Windows
|
|
netstat -ano | findstr :5001 # Windows
|
|
|
|
lsof -i :5000 # Linux/Mac
|
|
lsof -i :5001 # Linux/Mac
|
|
```
|
|
|
|
Se algo tiver rodando, feche:
|
|
```bash
|
|
# Windows
|
|
taskkill /PID <PID> /F
|
|
|
|
# Linux/Mac
|
|
kill -9 <PID>
|
|
```
|
|
|
|
### Erro ao build
|
|
|
|
**Solução:**
|
|
```bash
|
|
dotnet clean
|
|
dotnet restore
|
|
dotnet build
|
|
```
|
|
|
|
---
|
|
|
|
## 🔍 ENTENDER OS DEBUG LOGS
|
|
|
|
Cada log tem um emoji que indica:
|
|
|
|
| Emoji | Significado |
|
|
|-------|-----------|
|
|
| 🚀 | Iniciando operação |
|
|
| 📝 | Informação sobre config |
|
|
| ⚙️ | Configuração |
|
|
| 📡 | Conexão com API |
|
|
| ✓ | Sucesso |
|
|
| ✗ | Erro |
|
|
| 🧠 | Processamento |
|
|
| 📊 | Resultado |
|
|
|
|
---
|
|
|
|
## 💡 DICAS
|
|
|
|
1. **Limpar cache do browser:** `Ctrl+Shift+Delete` (ou `Cmd+Shift+Delete` no Mac)
|
|
2. **Recarregar página:** `Ctrl+F5` (hard refresh)
|
|
3. **Ver logs da API:** Olhe o terminal onde você rodou `dotnet run` da API
|
|
4. **Debug logs da app:** Role para baixo na página, verá a seção "🔍 Debug Logs"
|
|
|
|
---
|
|
|
|
## ✅ CHECKLIST ANTES DE RODAR
|
|
|
|
- [ ] Abri DOIS terminais (não um com abas)?
|
|
- [ ] Terminal 1 está roando a API (`Now listening on: http://localhost:5000`)?
|
|
- [ ] Terminal 2 está rodando o Desktop (`Now listening on: http://localhost:5001`)?
|
|
- [ ] Abri o browser em `http://localhost:5001`?
|
|
- [ ] A página tem formatação (cores, botões grandes)?
|
|
- [ ] Há uma barra de navegação escura no topo?
|
|
|
|
---
|
|
|
|
## 📞 INFORMAÇÕES DO SISTEMA
|
|
|
|
```
|
|
Framework: .NET 8.0 LTS
|
|
Build Status: ✅ SUCCESS
|
|
Portas:
|
|
- API: http://localhost:5000
|
|
- Desktop: http://localhost:5001
|
|
```
|
|
|
|
---
|
|
|
|
## 🎉 SUCESSO!
|
|
|
|
Se tudo deu certo, você verá:
|
|
1. ✅ Página com formatação (não mais "sem CSS")
|
|
2. ✅ Navbar escura
|
|
3. ✅ Botões grandes e coloridos
|
|
4. ✅ Formulário bem organizado
|
|
5. ✅ Progress bar ao enviar
|
|
6. ✅ Resultados aparecem
|
|
7. ✅ Debug logs mostram cada etapa
|
|
|
|
**Parabéns! FASE 1 ✅ está funcionando!**
|
|
|
|
---
|
|
|
|
**Data:** 2026-02-06
|
|
**Status:** ✅ Corrigido e Testado
|