Skip to content

comodorop/AWS-console-Hub

BranchesTags

Repository files navigation

AWS Console Hub - Extensión para Chrome

License: MIT Chrome Extension Ko-fi

Una extensión simple, segura y poderosa para gestionar accesos rápidos a múltiples cuentas de AWS Console con sistema de grupos y favoritos.

☕ Apóyame

Si encuentras útil esta extensión, considera invitarme un café:

ko-fi

Tu apoyo ayuda a mantener y mejorar este proyecto. ¡Gracias! 🙏

🎯 Objetivo

AWS Console Hub permite acceso rápido y organizado a múltiples cuentas de AWS Console sin manejar credenciales ni secretos. La extensión solo almacena metadatos de cuentas para facilitar el acceso rápido.

✨ Características Principales

  • 🗂️ Sistema de Grupos - Organiza cuentas por cliente/proyecto
  • ⭐ Favoritos - Marca y prioriza tus cuentas más usadas
  • 📋 Copiar Rápido - Copia alias + URL al portapapeles
  • 💾 Importar/Exportar - Importación aditiva y exportación completa
  • 🔍 Búsqueda Avanzada - Filtra por alias, environment, grupo, etc.
  • ⚙️ Editor JSON - Página completa de configuración con snippet de ejemplo
  • 🎨 UI Intuitiva - Interfaz limpia con identificación visual de environments

🔐 Restricciones de Seguridad

✅ SEGURO: La extensión NO almacena información sensible:

  • ❌ NO guarda passwords
  • ❌ NO guarda tokens
  • ❌ NO maneja MFA
  • ❌ NO usa AWS SDK
  • ❌ NO consume APIs de AWS
  • ❌ NO intercepta tráfico

✅ Solo almacena metadatos:

  • Alias de la cuenta
  • Environment (dev, stage, qa, prod)
  • Account ID de AWS (12 dígitos)
  • Grupo/Cliente (para organización)
  • Usuario (solo como referencia visual)
  • URL de login (generada automáticamente)
  • Favoritos (marcados localmente)

📦 Formato de Datos Simplificado

Solo necesitas 5 campos (id y loginUrl se generan automáticamente):

{
  "alias": "stage-qa",
  "environment": "stage",
  "accountId": "211125735698",
  "group": "Cliente A",
  "usernameLabel": "pablo.gonzalez@tecnoavance.mx"
}

🚀 Instalación en Modo Desarrollador

Paso 1: Descargar o clonar el proyecto

git clone <repository-url>
cd aws-console-hub

Paso 2: Abrir Chrome y acceder a extensiones

  1. Abre Google Chrome
  2. Navega a chrome://extensions/
  3. Activa el "Modo de desarrollador" en la esquina superior derecha

Paso 3: Cargar la extensión

  1. Haz clic en el botón "Cargar descomprimida"
  2. Selecciona la carpeta aws-console-hub que descargaste
  3. La extensión aparecerá en tu lista de extensiones

Paso 4: Verificar instalación

  1. Busca el icono ⚡ de AWS Console Hub en la barra de extensiones
  2. Haz clic en él para abrir el popup
  3. La extensión está lista para usar

📋 Guía de Uso

🗂️ Sistema de Grupos

Organiza tus cuentas por cliente, proyecto o equipo:

  1. Cada cuenta tiene un campo group (ej: "Cliente A", "Proyecto X")
  2. En el popup, usa el dropdown para filtrar por grupo
  3. Selecciona "📁 Todos los grupos" para ver todas las cuentas

⭐ Favoritos

Marca tus cuentas más usadas:

  1. En el popup, haz clic en la estrella ☆ de cualquier cuenta
  2. La estrella se vuelve amarilla ⭐ indicando que es favorito
  3. Los favoritos aparecen primero en la lista automáticamente
  4. Haz clic nuevamente para quitar de favoritos

📁 Importar Configuración

Importación aditiva (no borra cuentas existentes):

  1. Haz clic en el botón ⚙️ (Configuración)
  2. Haz clic en 📁 Importar Archivo
  3. Selecciona un archivo JSON con el formato correcto
  4. Las nuevas cuentas se agregarán a las existentes
  5. Haz clic en 💾 Guardar Cambios

💾 Exportar Configuración

Guarda un respaldo o comparte con tu equipo:

  1. Haz clic en el botón ⚙️ (Configuración)
  2. Haz clic en 💾 Exportar Config
  3. Se descargará un archivo JSON con todas tus cuentas
  4. Formato: aws-console-hub-config-YYYY-MM-DD.json

⚙️ Editar Configuración

Editor JSON completo con snippet de ejemplo:

  1. Haz clic en el botón ⚙️ (Configuración)
  2. Edita el JSON directamente en el editor
  3. Usa el snippet de ejemplo (botón 📋 Copiar)
  4. Haz clic en ✨ Formatear JSON para organizar el código
  5. Haz clic en 💾 Guardar Cambios

📋 Copiar Información Rápida

Copia alias + URL al portapapeles:

  1. En el popup, localiza la cuenta que necesitas
  2. Haz clic en el ícono 📋 de la tarjeta
  3. Se copia al portapapeles: 
    Cuenta: [alias]
Console URL: [loginUrl]
  4. Pega donde necesites (Slack, email, documentación, etc.)

🔍 Buscar Cuentas

Búsqueda en tiempo real:

  • Usa el campo de búsqueda para filtrar por:
    • Alias
    • Environment
    • Account ID
    • Grupo
    • Usuario

🚀 Acceder a una Cuenta

  • Haz clic en cualquier tarjeta para abrir la consola AWS en una nueva pestaña

📄 Formato de Archivo de Configuración

Formato Completo (Ejemplo)

[
  {
    "alias": "stage-qa",
    "environment": "stage",
    "accountId": "211125735698",
    "group": "Cliente A",
    "usernameLabel": "pablo.gonzalez@tecnoavance.mx"
  },
  {
    "alias": "prod-main",
    "environment": "prod",
    "accountId": "123456789012",
    "group": "Cliente A",
    "usernameLabel": "admin@empresa.com"
  },
  {
    "alias": "dev-sandbox",
    "environment": "dev",
    "accountId": "987654321098",
    "group": "Cliente B",
    "usernameLabel": "developer@empresa.com"
  }
]

Campos Requeridos

Campo Descripción Ejemplo
alias Nombre identificativo "stage-qa"
environment Entorno "prod", "stage", "dev", "qa"
accountId Account ID de AWS (12 dígitos) "211125735698"
group Grupo/Cliente/Proyecto "Cliente A"
usernameLabel Email de referencia (opcional) "user@example.com"

Campos Auto-generados

  • id → Generado automáticamente por el sistema
  • loginUrl → Generado como: https://[accountId].signin.aws.amazon.com/console

🎨 Características de la Interfaz

📱 Popup Principal

[📁 Seleccionar Grupo ▼]  [⚙️]
─────────────────────────────
🔍 Buscar...
─────────────────────────────
⭐ prod-main (Cliente A) [📋][⚙️]
⭐ stage-qa (Cliente A)  [📋][⚙️]
☆ dev-test (Cliente B)   [📋][⚙️]
─────────────────────────────
3 cuentas

Identificación Visual de Environments

  • 🔵 dev: Azul
  • 🟠 stage: Naranja
  • 🟣 qa: Púrpura
  • 🔴 prod: Rojo

Botones en Tarjetas

  • ⭐/☆ - Marcar/desmarcar favorito
  • 📋 - Copiar alias + URL
  • ⚙️ - Ir a configuración

Página de Configuración

  • 📁 Importar Archivo - Importación aditiva de JSON
  • 💾 Exportar Config - Descargar configuración
  • 💾 Guardar Cambios - Aplicar cambios del editor
  • ✨ Formatear JSON - Organizar código
  • 🗑️ Limpiar Todo - Borrar todas las cuentas
  • 📋 Copiar Snippet - Copiar template de ejemplo

🗂️ Estructura del Proyecto

aws-console-hub/
├── manifest.json          # Configuración de la extensión (Manifest V3)
├── popup.html             # Interfaz principal del popup
├── popup.js               # Lógica del popup (grupos, favoritos, copiar)
├── options.html           # Página de configuración
├── options.js             # Lógica del editor (importar, exportar, editar)
├── styles.css             # Estilos CSS completos
├── config-example.json    # Ejemplo de configuración para importar
├── README.md              # Este archivo
├── GUIA_USO.md           # Guía detallada de uso
└── TROUBLESHOOTING.md    # Solución de problemas

🛠️ Requisitos Técnicos

  • Navegador: Google Chrome (última versión)
  • Manifest: Versión 3
  • Tecnologías: HTML5 + CSS3 + JavaScript ES6+
  • Almacenamiento: chrome.storage.local (local del navegador)
  • Permisos mínimos: storage, activeTab

🔄 Flujo de Trabajo Recomendado

Primera vez

  1. Instalar extensión en modo desarrollador
  2. Importar config-example.json desde configuración
  3. Guardar cambios para aplicar
  4. Organizar con grupos y favoritos

Uso diario

  1. Abrir popup (clic en icono ⚡)
  2. Filtrar por grupo si tienes muchas cuentas
  3. Marcar favoritos para acceso rápido
  4. Copiar info con 📋 cuando necesites compartir
  5. Clic en cuenta para abrir AWS Console

Gestión

  1. Editar desde ⚙️ Configuración
  2. Exportar respaldos periódicamente
  3. Importar configuraciones de equipo

🚨 Consideraciones de Seguridad

  1. Datos Locales: Toda la información se almacena localmente en el navegador
  2. Sin Transmisión: No se envían datos a servidores externos
  3. Sin Credenciales: Nunca se almacenan tokens, passwords o claves
  4. Código Abierto: Todo el código es visible y auditable
  5. Permisos Mínimos: Solo los permisos estrictamente necesarios
  6. Favoritos Locales: Se guardan solo en tu navegador

🐛 Solución de Problemas

La extensión no aparece en Chrome

  • Verifica que activaste el "Modo de desarrollador"
  • Asegúrate de seleccionar la carpeta correcta (no el archivo manifest.json)
  • Recarga Chrome e intenta nuevamente

Las cuentas no se guardan

  • Verifica que Chrome tenga permisos de escritura
  • Abre la página de configuración y revisa el editor
  • Revisa la consola de desarrollador (F12) para ver errores

La importación no funciona desde el popup

  • Limitación conocida: El selector de archivos cierra el popup
  • Solución: Usa la página de configuración (⚙️) para importar

Los favoritos no se guardan

  • Los favoritos se guardan automáticamente al hacer clic
  • Verifica el almacenamiento local en DevTools
  • Recarga la extensión si persiste el problema

📈 Características Implementadas

  • ✅ Sistema de grupos/clientes
  • ✅ Marcado de favoritos
  • ✅ Importación aditiva (no destructiva)
  • ✅ Exportación de configuración
  • ✅ Copiar información rápida
  • ✅ Editor JSON completo
  • ✅ Snippet de ejemplo
  • ✅ Auto-generación de id y loginUrl
  • ✅ Búsqueda avanzada
  • ✅ Filtrado por grupo
  • ✅ Ordenamiento (favoritos primero)

🔮 Roadmap Futuro

  • Integración con SSO corporativo
  • Sincronización entre dispositivos
  • Historial de accesos
  • Atajos de teclado personalizados
  • Temas personalizados (dark mode)
  • Múltiples configuraciones/perfiles
  • Notificaciones de cambios en cuentas

📄 Licencia

Este proyecto está bajo la Licencia MIT - mira el archivo LICENSE para más detalles.

Esto significa que puedes:

  • ✅ Usar comercialmente
  • ✅ Modificar
  • ✅ Distribuir
  • ✅ Uso privado

🤝 Contribuciones

¡Las contribuciones son bienvenidas! Por favor lee CONTRIBUTING.md para conocer los detalles de nuestro código de conducta y el proceso para enviar pull requests.

Cómo Contribuir

  1. Fork el proyecto
  2. Crea tu Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit tus cambios (git commit -m 'Add some AmazingFeature')
  4. Push a la Branch (git push origin feature/AmazingFeature)
  5. Abre un Pull Request

Reportar Issues

⭐ ¿Te gustó el proyecto?

Si este proyecto te fue útil:

👨‍💻 Autor

Pablo Torres - @comodorop

AWS Console Hub v1.3 - Tu acceso rápido, organizado y seguro a múltiples consolas AWS ⚡

Con sistema de grupos, favoritos y exportación de configuración

About

No description, website, or topics provided.

Resources

Readme

License

MIT license

Contributing

Contributing
Activity

Stars

1 star

Watchers

0 watching

Forks

0 forks
Report repository

Releases

No releases published

Sponsor this project

Packages

 
 
 

Contributors

Languages