Rick and Morty Characters

Este proyecto es una aplicación full stack en respuesta a Challenge laboral. Permite buscar y gestionar personajes de la serie Rick y Morty, utilizando la API pública de Rick y Morty.

Tabla de Índice

• Rick and Morty Characters
  • Tecnologías utilizadas
  • Requisitos previos
  • Configuración y ejecución
    • Backend
      • Uso de Apollo GraphQL
        • Queries y Mutations
    • Frontend
  • Uso de la aplicación
  • Diagrama ERD
  • Flujo operativo
  • Imágenes
• Agradecimiento

Tecnologías utilizadas

• Frontend: React 18, GraphQL, Nextjs, TailwindCSS, Typescript
• Backend: Express, GraphQL, TypeScript, Typeorm, Redis
• Base de datos: PostgreSQL
• Dockerfile - docker compose
• Patrón hexagonal

Requisitos previos

• Docker y Docker Compose
• Node.js (versión 18 o superior)
• npm

Configuración y ejecución

1. Clona el repositorio:

git clone https://github.com/Nagarehazh/FullStactkRaMChallenge.git

Backend

cd server

1. Crea un archivo .env en la raíz del proyecto con el siguiente contenido:

DATABASE_URL=postgres://postgres:password@postgres_db:5432/rickmorty_db
DB_HOST=postgres_db
DB_PORT=5432
DB_USERNAME=postgres
DB_PASSWORD=password
DB_NAME=rickmorty_db

2. Inicia los contenedores Docker:

docker-compose up --build

Este comando iniciará los contenedores para PostgreSQL, Redis y la aplicación del servidor.

4. La aplicación estará disponible en http://localhost:4040/graphql

Uso de Apollo GraphQL

Para interactuar con la API GraphQL, utiliza la configuración de Apollo Studio Explorer, que estará disponible en http://localhost:4040/graphql una vez que la aplicación esté en funcionamiento.

Queries y Mutations

1. Obtener personajes:

query GetCharacters {
  getCharacters(status: "Alive", species: "Human") {
    id
    name
    status
    species
    gender
    origin
    image
     comments {
      id
      content
     }
    favorites {
      id
    }
  }
}

2. Importar personajes:

mutation ImportCharacters {
  importCharacters(count: 15) {
    id
    name
    status
  }
}

3. Agregar un comentario:

mutation AddComment {
  addComment(characterId: "1", content: "Este es un personaje genial") {
    success
    message
    comment {
      id
      content
    }
  }
}

4. Marcar/Desmarcar favorito:

mutation ToggleFavorite {
  toggleFavorite(characterId: "1") {
    success
    message
    favorite {
      id
      characterId
    }
  }
}

5. Verificar el estado de salud del servidor:

query HealthCheck {
  healthCheck {
    status
  }
}

Frontend

cd client

1. instalamos las dependencias:

npm install

2. Inicia la aplicación:

npm run dev

La aplicación estará disponible en http://localhost:3000

Uso de la aplicación

1. Busca personajes por nombre
2. Filtra personajes por estado, especie, género y origen
3. Agrega comentarios a los personajes
4. Marca tus personajes favoritos
5. Cron Job: node-cron para actualización automática de personajes
6. Seed inicial de base de datos con 15 personajes

Diagrama ERD

Flujo operativo

Imágenes

Agradecimiento

Quiero expresar mi más sincero agradecimiento por la oportunidad de participar en este challenge. Espero que el resultado cumpla con sus expectativas y estoy ansioso por nuestro encuentro. ¡Un gran abrazo Team!

con cariño Harley Zapata