Compare commits
No commits in common. "70bfb3f0641ff4982622e801efd6a73c5b423696" and "4a372209d9f80096ae8284f717521a4bee7f5b08" have entirely different histories.
70bfb3f064
...
4a372209d9
6 changed files with 16 additions and 698 deletions
3
.gitignore
vendored
3
.gitignore
vendored
|
|
@ -15,7 +15,6 @@
|
||||||
!sops/
|
!sops/
|
||||||
!projects/
|
!projects/
|
||||||
!data/
|
!data/
|
||||||
!docs/
|
|
||||||
|
|
||||||
# Excluir el contenido de data pero mantener la carpeta
|
# Excluir el contenido de data pero mantener la carpeta
|
||||||
data/*
|
data/*
|
||||||
|
|
@ -36,5 +35,3 @@ data/*
|
||||||
!bin/ansible/**
|
!bin/ansible/**
|
||||||
!inventory/**
|
!inventory/**
|
||||||
!sops/*.yaml
|
!sops/*.yaml
|
||||||
!docs/*.md
|
|
||||||
!docs/img/**
|
|
||||||
|
|
|
||||||
55
README.md
55
README.md
|
|
@ -63,23 +63,11 @@ MRDevs Tools utiliza una estructura organizada que separa el código (en ~/devs)
|
||||||
|
|
||||||
| Comando | Descripción |
|
| Comando | Descripción |
|
||||||
|---------|-------------|
|
|---------|-------------|
|
||||||
| `bin/bootstrap.sh` | Instala herramientas básicas (incluyendo oathtool, zbar, redis-cli y gum) y configura la gestión de contenedores |
|
| `bin/bootstrap.sh` | Instala herramientas básicas (incluyendo oathtool, zbar y redis-cli) y configura la gestión de contenedores |
|
||||||
| `bin/update.sh` | Actualiza el entorno de desarrollo y herramientas (incluyendo oathtool, zbar, redis-cli y gum) |
|
| `bin/update.sh` | Actualiza el entorno de desarrollo y herramientas (incluyendo oathtool, zbar y redis-cli) |
|
||||||
| `bin/npm_install.sh` | Instala NodeJS y npm de forma interactiva |
|
| `bin/npm_install.sh` | Instala NodeJS y npm de forma interactiva |
|
||||||
| `bin/project_new.sh` | Crea un nuevo proyecto con estructura estandarizada según el tipo seleccionado |
|
| `bin/project_new.sh` | Crea un nuevo proyecto con estructura estandarizada según el tipo seleccionado |
|
||||||
|
|
||||||
### Interfaces de Usuario con Gum
|
|
||||||
|
|
||||||
MRDevs Tools utiliza [Gum](https://github.com/charmbracelet/gum) para crear interfaces de texto (TUI) elegantes y funcionales:
|
|
||||||
|
|
||||||
| Comando/Documento | Descripción |
|
|
||||||
|---------|-------------|
|
|
||||||
| `docs/forms-gum.md` | Tutorial completo para crear formularios interactivos con Gum |
|
|
||||||
| `gum style` | Da formato al texto (color, negrita, etc.) |
|
|
||||||
| `gum input` | Campo de entrada para texto |
|
|
||||||
| `gum choose` | Menú de selección de opciones |
|
|
||||||
| `gum confirm` | Diálogo de confirmación (Sí/No) |
|
|
||||||
|
|
||||||
### Herramientas de IA y Productividad
|
### Herramientas de IA y Productividad
|
||||||
|
|
||||||
| Comando | Descripción |
|
| Comando | Descripción |
|
||||||
|
|
@ -151,23 +139,6 @@ MRDevs Tools utiliza [Gum](https://github.com/charmbracelet/gum) para crear inte
|
||||||
|
|
||||||
## 📚 Guía de Usuario
|
## 📚 Guía de Usuario
|
||||||
|
|
||||||
### Interfaces de Texto con Gum
|
|
||||||
|
|
||||||
MRDevs Tools incluye soporte completo para [Gum](https://github.com/charmbracelet/gum), una herramienta que permite crear interfaces de texto (TUI) elegantes:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Abrir el tutorial completo sobre Gum
|
|
||||||
xdg-open ~/devs/docs/forms-gum.md
|
|
||||||
```
|
|
||||||
|
|
||||||
El tutorial incluye:
|
|
||||||
- Ejemplos prácticos de formularios interactivos
|
|
||||||
- Guía para crear menús de selección
|
|
||||||
- Técnicas para estilizar texto y crear layouts complejos
|
|
||||||
- Referencias visuales de cada componente
|
|
||||||
|
|
||||||
Para más detalles, consulta la [documentación completa de Gum](docs/forms-gum.md).
|
|
||||||
|
|
||||||
### Preparación del Entorno
|
### Preparación del Entorno
|
||||||
|
|
||||||
El directorio `$HOME/devs` sirve como área principal de desarrollo donde se gestionan diversos ambientes y proyectos. Por razones de seguridad, se prioriza [podman](https://podman.io/) sobre [docker](https://www.docker.com/) como gestor de contenedores.
|
El directorio `$HOME/devs` sirve como área principal de desarrollo donde se gestionan diversos ambientes y proyectos. Por razones de seguridad, se prioriza [podman](https://podman.io/) sobre [docker](https://www.docker.com/) como gestor de contenedores.
|
||||||
|
|
@ -577,18 +548,16 @@ MRDevs Tools está diseñado con la seguridad y privacidad en mente:
|
||||||
```
|
```
|
||||||
$HOME/
|
$HOME/
|
||||||
├── devs/ # Directorio principal del proyecto
|
├── devs/ # Directorio principal del proyecto
|
||||||
│ ├── bin/ # Scripts ejecutables y herramientas
|
│ └── bin/ # Scripts ejecutables y herramientas
|
||||||
│ │ ├── lib/ # Bibliotecas compartidas
|
│ ├── lib/ # Bibliotecas compartidas
|
||||||
│ │ ├── msg/ # Archivos de mensajes multilingües
|
│ ├── msg/ # Archivos de mensajes multilingües
|
||||||
│ │ ├── config/ # Configuraciones y parámetros
|
│ ├── config/ # Configuraciones y parámetros
|
||||||
│ │ │ └── *.gitignore # Plantillas para proyectos
|
│ │ └── *.gitignore # Plantillas para proyectos
|
||||||
│ │ ├── bootstrap.sh # Instalador básico
|
│ ├── bootstrap.sh # Instalador básico
|
||||||
│ │ ├── update.sh # Actualizador de entorno
|
│ ├── update.sh # Actualizador de entorno
|
||||||
│ │ ├── ollama*.sh # Scripts de Ollama
|
│ ├── ollama*.sh # Scripts de Ollama
|
||||||
│ │ ├── claude_voice.py # Asistente de voz para Claude Code
|
│ ├── claude_voice.py # Asistente de voz para Claude Code
|
||||||
│ │ └── ... # Otros scripts
|
│ └── ... # Otros scripts
|
||||||
│ └── data/ # Datos persistentes (no versionados)
|
|
||||||
│ └── rates/ # Tarifas almacenadas para programadores
|
|
||||||
│
|
│
|
||||||
├── .sounds/ # Archivos de audio para notificaciones
|
├── .sounds/ # Archivos de audio para notificaciones
|
||||||
├── .ollama/ # Configuración y datos de Ollama (IA)
|
├── .ollama/ # Configuración y datos de Ollama (IA)
|
||||||
|
|
|
||||||
|
|
@ -6,8 +6,8 @@
|
||||||
#Company Email : mauro@rosero.one
|
#Company Email : mauro@rosero.one
|
||||||
#Personal Email : mauro.rosero@gmail.com
|
#Personal Email : mauro.rosero@gmail.com
|
||||||
#Created : 2025/03/19 11:57:08
|
#Created : 2025/03/19 11:57:08
|
||||||
#Modified : 2025/04/04 14:00:00
|
#Modified : 2025/03/30 16:30:00
|
||||||
#Version : 1.3.1
|
#Version : 1.3.0
|
||||||
#Use Notes :
|
#Use Notes :
|
||||||
#==============================================================================
|
#==============================================================================
|
||||||
# Derechos de Autor [2025] [Mauro Rosero P. <mauro@rosero.one>]
|
# Derechos de Autor [2025] [Mauro Rosero P. <mauro@rosero.one>]
|
||||||
|
|
@ -89,7 +89,6 @@ install() {
|
||||||
local OATHTOOL_PACKAGE=oathtool
|
local OATHTOOL_PACKAGE=oathtool
|
||||||
local ZBAR_PACKAGE=zbar
|
local ZBAR_PACKAGE=zbar
|
||||||
local REDIS_CLI_PACKAGE=redis-tools
|
local REDIS_CLI_PACKAGE=redis-tools
|
||||||
local GUM_PACKAGE=gum
|
|
||||||
|
|
||||||
# Load base bash library
|
# Load base bash library
|
||||||
BIN_HOME=$BIN_PATH
|
BIN_HOME=$BIN_PATH
|
||||||
|
|
@ -232,14 +231,6 @@ install() {
|
||||||
os_pkgs_install $REDIS_CLI_PACKAGE
|
os_pkgs_install $REDIS_CLI_PACKAGE
|
||||||
fi
|
fi
|
||||||
|
|
||||||
# Install gum if not already installed
|
|
||||||
command_installed gum
|
|
||||||
if [ $? -ne 0 ]
|
|
||||||
then
|
|
||||||
echo "Instalando gum..."
|
|
||||||
gum_install
|
|
||||||
fi
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
# Load messages
|
# Load messages
|
||||||
|
|
|
||||||
|
|
@ -465,51 +465,3 @@ function zbar_install() {
|
||||||
echo "zbar instalado correctamente."
|
echo "zbar instalado correctamente."
|
||||||
return 0
|
return 0
|
||||||
}
|
}
|
||||||
|
|
||||||
# Install gum package (TUI toolkit)
|
|
||||||
function gum_install() {
|
|
||||||
echo "Instalando gum (toolkit para interfaces TUI)..."
|
|
||||||
|
|
||||||
if [ "$(uname)" == "Darwin" ]; then
|
|
||||||
# En macOS, instalamos a través de Homebrew
|
|
||||||
brew install gum
|
|
||||||
elif [ -f /etc/debian_version ] || [ -f /etc/os-release ]; then
|
|
||||||
# En sistemas Debian y derivados
|
|
||||||
mkdir -p /etc/apt/keyrings
|
|
||||||
curl -fsSL https://repo.charm.sh/apt/gpg.key | gpg --dearmor -o /etc/apt/keyrings/charm.gpg
|
|
||||||
echo "deb [signed-by=/etc/apt/keyrings/charm.gpg] https://repo.charm.sh/apt/ * *" > /etc/apt/sources.list.d/charm.list
|
|
||||||
apt update
|
|
||||||
apt install -y gum
|
|
||||||
elif [ -f /etc/redhat-release ]; then
|
|
||||||
# En sistemas Red Hat
|
|
||||||
echo '[charm]
|
|
||||||
name=Charm
|
|
||||||
baseurl=https://repo.charm.sh/yum/
|
|
||||||
enabled=1
|
|
||||||
gpgcheck=1
|
|
||||||
gpgkey=https://repo.charm.sh/yum/gpg.key' | tee /etc/yum.repos.d/charm.repo
|
|
||||||
dnf install -y gum
|
|
||||||
elif [ -f /etc/arch-release ]; then
|
|
||||||
# En Arch Linux, instalamos desde AUR
|
|
||||||
command_installed "yay"
|
|
||||||
if [ $? -ne 0 ]; then
|
|
||||||
echo "Instalando yay para acceder a AUR..."
|
|
||||||
pacman -Sy --noconfirm git base-devel
|
|
||||||
git clone https://aur.archlinux.org/yay.git /tmp/yay
|
|
||||||
cd /tmp/yay
|
|
||||||
makepkg -si --noconfirm
|
|
||||||
cd - > /dev/null
|
|
||||||
rm -rf /tmp/yay
|
|
||||||
fi
|
|
||||||
yay -S --noconfirm gum
|
|
||||||
elif [ -f /etc/rc.conf ]; then
|
|
||||||
# En FreeBSD
|
|
||||||
pkg install -y gum
|
|
||||||
else
|
|
||||||
echo "${os_nofound}"
|
|
||||||
return 1
|
|
||||||
fi
|
|
||||||
|
|
||||||
echo "gum instalado correctamente."
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -6,8 +6,8 @@
|
||||||
#Company Email : mauro@rosero.one
|
#Company Email : mauro@rosero.one
|
||||||
#Personal Email : mauro.rosero@gmail.com
|
#Personal Email : mauro.rosero@gmail.com
|
||||||
#Created : 2024/12/09 10:27:00
|
#Created : 2024/12/09 10:27:00
|
||||||
#Modified : 2025/04/04 14:00:00
|
#Modified : 2025/03/30 16:30:00
|
||||||
#Version : 1.3.1
|
#Version : 1.3.0
|
||||||
#Use Notes :
|
#Use Notes :
|
||||||
#==============================================================================
|
#==============================================================================
|
||||||
# Derechos de Autor [2025] [Mauro Rosero P. <mauro@rosero.one>]
|
# Derechos de Autor [2025] [Mauro Rosero P. <mauro@rosero.one>]
|
||||||
|
|
@ -288,34 +288,6 @@ update_additional_tools() {
|
||||||
fi
|
fi
|
||||||
echo -e "${head_info}: redis-cli actualizado correctamente."
|
echo -e "${head_info}: redis-cli actualizado correctamente."
|
||||||
fi
|
fi
|
||||||
|
|
||||||
# Actualizar gum si está instalado
|
|
||||||
command_installed gum
|
|
||||||
if [ $? -eq 0 ]; then
|
|
||||||
echo -e "\n${head_info}: Actualizando gum (Charm TUI toolkit)..."
|
|
||||||
if [ -f /etc/debian_version ] || [ -f /etc/os-release ]; then
|
|
||||||
# Para sistemas basados en Debian
|
|
||||||
apt update
|
|
||||||
apt install --only-upgrade -y gum
|
|
||||||
elif [ -f /etc/redhat-release ]; then
|
|
||||||
# Para sistemas basados en Red Hat
|
|
||||||
dnf upgrade -y gum
|
|
||||||
elif [ -f /etc/arch-release ]; then
|
|
||||||
# Para Arch Linux con yay
|
|
||||||
command_installed yay
|
|
||||||
if [ $? -eq 0 ]; then
|
|
||||||
yay -Syu --noconfirm gum
|
|
||||||
else
|
|
||||||
echo -e "${head_error}: yay no está instalado, no se puede actualizar gum"
|
|
||||||
fi
|
|
||||||
elif [ "$(uname)" == "Darwin" ]; then
|
|
||||||
# Para macOS con Homebrew
|
|
||||||
brew upgrade gum
|
|
||||||
else
|
|
||||||
echo -e "${head_error}: Sistema operativo no soportado para actualizar gum"
|
|
||||||
fi
|
|
||||||
echo -e "${head_info}: gum actualizado correctamente."
|
|
||||||
fi
|
|
||||||
}
|
}
|
||||||
|
|
||||||
# Actualizar herramientas adicionales con sudo si están instaladas
|
# Actualizar herramientas adicionales con sudo si están instaladas
|
||||||
|
|
|
||||||
|
|
@ -1,563 +0,0 @@
|
||||||
# Creando Formularios Interactivos con Gum
|
|
||||||
|
|
||||||
## Introducción
|
|
||||||
|
|
||||||
[Gum](https://github.com/charmbracelet/gum) es una herramienta de línea de comandos desarrollada por [Charm](https://charm.sh/) que permite crear interfaces de texto (TUI) elegantes y funcionales para scripts Bash. Con Gum, puedes mejorar dramáticamente la experiencia de usuario de tus scripts de shell, añadiendo formularios interactivos, menús, estilos y más.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Este tutorial cubre cómo utilizar Gum para crear formularios interactivos en scripts de shell dentro del entorno MRDevs Tools.
|
|
||||||
|
|
||||||
## Requisitos Previos
|
|
||||||
|
|
||||||
- MRDevs Tools instalado (bootstrap.sh ya instala Gum automáticamente)
|
|
||||||
- Conocimientos básicos de shell scripting
|
|
||||||
|
|
||||||
|
|
||||||
## Componentes Básicos de Gum
|
|
||||||
|
|
||||||
Gum ofrece varios comandos para crear diferentes tipos de elementos de interfaz:
|
|
||||||
|
|
||||||
| Comando | Descripción |
|
|
||||||
|---------------|--------------------------------------------|
|
|
||||||
| `gum style` | Da formato al texto (color, negrita, etc.) |
|
|
||||||
| `gum input` | Campo de entrada para texto |
|
|
||||||
| `gum write` | Área de texto multilínea |
|
|
||||||
| `gum confirm` | Diálogo de confirmación (Sí/No) |
|
|
||||||
| `gum choose` | Menú de selección de opciones |
|
|
||||||
| `gum filter` | Lista filtrable de opciones |
|
|
||||||
| `gum spin` | Indicador de carga con mensaje |
|
|
||||||
| `gum format` | Formatea texto (Markdown, código, etc.) |
|
|
||||||
| `gum join` | Combina salidas en layouts |
|
|
||||||
| `gum table` | Muestra datos en formato de tabla |
|
|
||||||
| `gum pager` | Visualizador de texto paginado |
|
|
||||||
|
|
||||||
### 1. Formulario Básico de Registro
|
|
||||||
|
|
||||||
Vamos a crear un formulario simple que solicite nombre, correo electrónico y contraseña:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
#!/bin/bash
|
|
||||||
# Ejemplo de formulario básico con Gum
|
|
||||||
|
|
||||||
# Título estilizado
|
|
||||||
echo
|
|
||||||
gum style --foreground 212 --bold --align center "Formulario de Registro"
|
|
||||||
echo
|
|
||||||
|
|
||||||
# Solicitar información
|
|
||||||
gum style --foreground 99 "Por favor, ingresa tus datos:"
|
|
||||||
echo
|
|
||||||
|
|
||||||
nombre=$(gum input --placeholder "Tu nombre completo" --prompt "Nombre: " --width 40)
|
|
||||||
email=$(gum input --placeholder "ejemplo@dominio.com" --prompt "Email: " --width 40)
|
|
||||||
password=$(gum input --password --placeholder "Tu contraseña segura" --prompt "Contraseña: " --width 40)
|
|
||||||
|
|
||||||
# Confirmar datos
|
|
||||||
echo
|
|
||||||
gum style --foreground 99 "Confirma tus datos:"
|
|
||||||
echo "Nombre: $nombre"
|
|
||||||
echo "Email: $email"
|
|
||||||
echo "Contraseña: $(echo $password | sed 's/./*/g')"
|
|
||||||
|
|
||||||
# Confirmación
|
|
||||||
echo
|
|
||||||
if gum confirm "¿Los datos son correctos?"; then
|
|
||||||
gum style --foreground 82 "✓ Usuario registrado correctamente."
|
|
||||||
else
|
|
||||||
gum style --foreground 196 "✗ Proceso cancelado."
|
|
||||||
fi
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 2. Selector de Proyecto
|
|
||||||
|
|
||||||
Creemos un selector para elegir el tipo de proyecto a crear:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
#!/bin/bash
|
|
||||||
# Selector de tipo de proyecto
|
|
||||||
|
|
||||||
echo
|
|
||||||
gum style --foreground 212 --bold "Selección de Tipo de Proyecto"
|
|
||||||
echo
|
|
||||||
|
|
||||||
# Definir opciones
|
|
||||||
TIPOS=("Web Frontend" "API Backend" "Aplicación Móvil" "Biblioteca/SDK" "Base de Datos" "DevOps/Infraestructura")
|
|
||||||
|
|
||||||
# Usar gum choose para selección
|
|
||||||
tipo_seleccionado=$(gum choose --height 10 --cursor-prefix "[ ] " --selected-prefix "[✓] " "${TIPOS[@]}")
|
|
||||||
|
|
||||||
# Verificar que se seleccionó un tipo
|
|
||||||
if [ -n "$tipo_seleccionado" ]; then
|
|
||||||
echo
|
|
||||||
gum style --foreground 82 "Has seleccionado: $tipo_seleccionado"
|
|
||||||
|
|
||||||
# Solicitar nombre del proyecto
|
|
||||||
echo
|
|
||||||
nombre_proyecto=$(gum input --width 40 --placeholder "mi-nuevo-proyecto" --prompt "Nombre del proyecto: ")
|
|
||||||
|
|
||||||
# Descripción multilínea
|
|
||||||
echo
|
|
||||||
gum style "Escribe una breve descripción del proyecto:"
|
|
||||||
descripcion=$(gum write --placeholder "Describe tu proyecto aquí..." --width 60 --height 5)
|
|
||||||
|
|
||||||
# Resumen
|
|
||||||
echo
|
|
||||||
gum style --foreground 99 --bold "Resumen del Proyecto:"
|
|
||||||
echo
|
|
||||||
echo "Tipo: $tipo_seleccionado"
|
|
||||||
echo "Nombre: $nombre_proyecto"
|
|
||||||
echo -e "Descripción:\n$descripcion"
|
|
||||||
|
|
||||||
# Confirmación
|
|
||||||
echo
|
|
||||||
if gum confirm "¿Deseas crear este proyecto?"; then
|
|
||||||
gum spin --spinner dot --title "Creando proyecto..." -- sleep 2
|
|
||||||
echo
|
|
||||||
gum style --foreground 82 "✓ Proyecto '$nombre_proyecto' creado con éxito."
|
|
||||||
else
|
|
||||||
echo
|
|
||||||
gum style --foreground 196 "✗ Operación cancelada."
|
|
||||||
fi
|
|
||||||
else
|
|
||||||
gum style --foreground 196 "✗ No se seleccionó ningún tipo de proyecto."
|
|
||||||
fi
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 3. Utilidad de Configuración del Sistema
|
|
||||||
|
|
||||||
Este ejemplo muestra cómo crear una utilidad para configurar aspectos del sistema:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
#!/bin/bash
|
|
||||||
# Utilidad de configuración del sistema
|
|
||||||
|
|
||||||
# Función para mostrar el encabezado
|
|
||||||
show_header() {
|
|
||||||
gum style \
|
|
||||||
--foreground 212 --border double --border-foreground 99 \
|
|
||||||
--align center --width 50 --margin "1 0" --padding "1 2" \
|
|
||||||
"Utilidad de Configuración del Sistema"
|
|
||||||
}
|
|
||||||
|
|
||||||
# Función para mostrar el menú principal
|
|
||||||
show_menu() {
|
|
||||||
gum style --foreground 99 "Selecciona una opción:"
|
|
||||||
gum choose --height 10 \
|
|
||||||
"1. Configurar Red" \
|
|
||||||
"2. Gestionar Usuarios" \
|
|
||||||
"3. Servicios del Sistema" \
|
|
||||||
"4. Actualizaciones" \
|
|
||||||
"5. Salir"
|
|
||||||
}
|
|
||||||
|
|
||||||
# Simular configuración de red
|
|
||||||
config_network() {
|
|
||||||
gum style --foreground 212 --bold "Configuración de Red"
|
|
||||||
|
|
||||||
# Elegir tipo de conexión
|
|
||||||
tipo_red=$(gum choose "Ethernet" "WiFi" "VPN" "Volver")
|
|
||||||
|
|
||||||
if [ "$tipo_red" = "Volver" ]; then
|
|
||||||
return
|
|
||||||
fi
|
|
||||||
|
|
||||||
gum style "Has seleccionado: $tipo_red"
|
|
||||||
|
|
||||||
if [ "$tipo_red" = "WiFi" ]; then
|
|
||||||
# Simulando escaneo de redes
|
|
||||||
gum spin --spinner dot --title "Escaneando redes WiFi..." -- sleep 2
|
|
||||||
|
|
||||||
# Elegir red WiFi
|
|
||||||
red=$(gum filter --placeholder "Buscar red..." --height 10 <<< "Red_Casa
|
|
||||||
Red_Oficina
|
|
||||||
Red_Invitados
|
|
||||||
Red_Vecino
|
|
||||||
WiFi_5G
|
|
||||||
WiFi_IoT")
|
|
||||||
|
|
||||||
if [ -n "$red" ]; then
|
|
||||||
password=$(gum input --password --prompt "Contraseña para $red: ")
|
|
||||||
gum spin --spinner dot --title "Conectando a $red..." -- sleep 2
|
|
||||||
gum style --foreground 82 "✓ Conectado a $red correctamente."
|
|
||||||
fi
|
|
||||||
else
|
|
||||||
gum style --foreground 99 "Esta función está en desarrollo."
|
|
||||||
fi
|
|
||||||
|
|
||||||
gum input --placeholder "Presiona Enter para continuar..."
|
|
||||||
}
|
|
||||||
|
|
||||||
# Función principal
|
|
||||||
main() {
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
|
|
||||||
while true; do
|
|
||||||
echo
|
|
||||||
opcion=$(show_menu)
|
|
||||||
|
|
||||||
case $opcion in
|
|
||||||
"1. Configurar Red")
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
config_network
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
;;
|
|
||||||
"5. Salir")
|
|
||||||
clear
|
|
||||||
gum style --foreground 82 "¡Gracias por usar la Utilidad de Configuración!"
|
|
||||||
exit 0
|
|
||||||
;;
|
|
||||||
*)
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
gum style --foreground 99 "Esta función está en desarrollo."
|
|
||||||
gum input --placeholder "Presiona Enter para continuar..."
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
;;
|
|
||||||
esac
|
|
||||||
done
|
|
||||||
}
|
|
||||||
|
|
||||||
# Ejecutar la aplicación
|
|
||||||
main
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Técnicas Avanzadas
|
|
||||||
|
|
||||||
### Layouts con `gum join`
|
|
||||||
|
|
||||||
Puedes crear layouts horizontales y verticales con `gum join`:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Layout horizontal con columnas
|
|
||||||
gum join --horizontal \
|
|
||||||
"$(gum style --padding "1 2" --border normal --width 20 "Panel 1")" \
|
|
||||||
"$(gum style --padding "1 2" --border normal --width 20 "Panel 2")" \
|
|
||||||
"$(gum style --padding "1 2" --border normal --width 20 "Panel 3")"
|
|
||||||
|
|
||||||
# Layout vertical con filas
|
|
||||||
gum join --vertical \
|
|
||||||
"$(gum style --padding "1 2" --border normal --width 50 "Fila 1")" \
|
|
||||||
"$(gum style --padding "1 2" --border normal --width 50 "Fila 2")" \
|
|
||||||
"$(gum style --padding "1 2" --border normal --width 50 "Fila 3")"
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### Tablas de Datos
|
|
||||||
|
|
||||||
Las tablas son útiles para mostrar datos estructurados:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Crear una tabla
|
|
||||||
echo -e "NOMBRE\tROL\tDEPARTAMENTO\nJuan Pérez\tDesarrollador\tTecnología\nAna García\tDiseñadora\tMarketing\nCarlos López\tGerente\tAdministración" | \
|
|
||||||
gum table --widths 20,15,20 --height 10
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### Filtrar Listas Largas
|
|
||||||
|
|
||||||
Para buscar en listas extensas:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Lista con filtro de búsqueda
|
|
||||||
cat /etc/passwd | gum filter --placeholder "Buscar usuario..." --height 15
|
|
||||||
```
|
|
||||||
|
|
||||||
### Personalización con Temas
|
|
||||||
|
|
||||||
Puedes personalizar colores y estilos con variables de entorno:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Configurar tema
|
|
||||||
export GUM_INPUT_CURSOR_FOREGROUND="#FF5F87"
|
|
||||||
export GUM_INPUT_PROMPT_FOREGROUND="#5F87FF"
|
|
||||||
export GUM_CONFIRM_SELECTED_BACKGROUND="#5F87FF"
|
|
||||||
export GUM_CONFIRM_UNSELECTED_BACKGROUND="#FF5F87"
|
|
||||||
|
|
||||||
# Probar con el tema personalizado
|
|
||||||
gum input --prompt "Nombre: "
|
|
||||||
gum confirm "¿Continuar?"
|
|
||||||
```
|
|
||||||
|
|
||||||
### Ejemplo Práctico: Asistente de Configuración de Proyecto
|
|
||||||
|
|
||||||
Este ejemplo muestra cómo usar Gum para crear un asistente para inicializar proyectos:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
#!/bin/bash
|
|
||||||
# Asistente de configuración de proyecto con Gum
|
|
||||||
|
|
||||||
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
|
|
||||||
source "${SCRIPT_DIR}/lib/base.lib"
|
|
||||||
|
|
||||||
# Asegurar que existe el directorio para guardar los proyectos
|
|
||||||
PROJECTS_DIR="$HOME/projects"
|
|
||||||
mkdir -p "$PROJECTS_DIR"
|
|
||||||
|
|
||||||
# Función para el encabezado
|
|
||||||
show_header() {
|
|
||||||
gum style \
|
|
||||||
--foreground "#00AAFF" --border double --border-foreground "#FF00AA" \
|
|
||||||
--align center --width 70 --margin "1 0" --padding "1 2" \
|
|
||||||
"🚀 Asistente de Inicialización de Proyectos 🚀"
|
|
||||||
}
|
|
||||||
|
|
||||||
# Función para mostrar pasos del proceso
|
|
||||||
show_step() {
|
|
||||||
local step=$1
|
|
||||||
local total=$2
|
|
||||||
local title=$3
|
|
||||||
|
|
||||||
gum style \
|
|
||||||
--foreground "#FFAA00" --bold \
|
|
||||||
"[$step/$total] $title"
|
|
||||||
echo
|
|
||||||
}
|
|
||||||
|
|
||||||
# Función principal
|
|
||||||
main() {
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
|
|
||||||
# Paso 1: Nombre del proyecto
|
|
||||||
show_step 1 5 "Nombre del Proyecto"
|
|
||||||
|
|
||||||
project_name=$(gum input --placeholder "mi-nuevo-proyecto" --prompt "Nombre: " --width 50)
|
|
||||||
|
|
||||||
if [ -z "$project_name" ]; then
|
|
||||||
gum style --foreground "#FF0000" "❌ El nombre del proyecto no puede estar vacío."
|
|
||||||
exit 1
|
|
||||||
fi
|
|
||||||
|
|
||||||
project_path="$PROJECTS_DIR/$project_name"
|
|
||||||
|
|
||||||
if [ -d "$project_path" ]; then
|
|
||||||
overwrite=$(gum confirm "El proyecto ya existe. ¿Deseas sobrescribirlo?")
|
|
||||||
if [ $? -ne 0 ]; then
|
|
||||||
gum style --foreground "#FF0000" "Operación cancelada."
|
|
||||||
exit 0
|
|
||||||
fi
|
|
||||||
rm -rf "$project_path"
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Paso 2: Tipo de proyecto
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
show_step 2 5 "Tipo de Proyecto"
|
|
||||||
|
|
||||||
project_type=$(gum choose "web" "api" "cli" "library" "mobile")
|
|
||||||
|
|
||||||
# Paso 3: Lenguaje de programación
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
show_step 3 5 "Lenguaje de Programación"
|
|
||||||
|
|
||||||
languages=()
|
|
||||||
|
|
||||||
case $project_type in
|
|
||||||
"web")
|
|
||||||
languages=("JavaScript" "TypeScript" "Python" "PHP" "Ruby")
|
|
||||||
;;
|
|
||||||
"api")
|
|
||||||
languages=("JavaScript" "TypeScript" "Python" "Go" "Java" "Ruby")
|
|
||||||
;;
|
|
||||||
"cli")
|
|
||||||
languages=("Python" "Go" "Rust" "C" "C++")
|
|
||||||
;;
|
|
||||||
"library")
|
|
||||||
languages=("JavaScript" "TypeScript" "Python" "C++" "Java")
|
|
||||||
;;
|
|
||||||
"mobile")
|
|
||||||
languages=("Kotlin" "Swift" "React Native" "Flutter")
|
|
||||||
;;
|
|
||||||
esac
|
|
||||||
|
|
||||||
language=$(gum choose "${languages[@]}")
|
|
||||||
|
|
||||||
# Paso 4: Descripción
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
show_step 4 5 "Descripción del Proyecto"
|
|
||||||
|
|
||||||
gum style "Escribe una breve descripción del proyecto:"
|
|
||||||
description=$(gum write --placeholder "Describe tu proyecto aquí..." --width 70 --height 5)
|
|
||||||
|
|
||||||
# Paso 5: Confirmar y crear
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
show_step 5 5 "Confirmación"
|
|
||||||
|
|
||||||
gum style --foreground "#00AAFF" "Resumen del Proyecto:"
|
|
||||||
echo
|
|
||||||
gum style --bold "Nombre: " --no-bold "$project_name"
|
|
||||||
gum style --bold "Tipo: " --no-bold "$project_type"
|
|
||||||
gum style --bold "Lenguaje: " --no-bold "$language"
|
|
||||||
gum style --bold "Ruta: " --no-bold "$project_path"
|
|
||||||
echo
|
|
||||||
gum style --bold "Descripción:"
|
|
||||||
echo "$description"
|
|
||||||
echo
|
|
||||||
|
|
||||||
create=$(gum confirm "¿Crear este proyecto?")
|
|
||||||
if [ $? -ne 0 ]; then
|
|
||||||
gum style --foreground "#FF0000" "Operación cancelada."
|
|
||||||
exit 0
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Crear proyecto
|
|
||||||
gum spin --spinner dot --title "Creando estructura del proyecto..." -- bash -c "
|
|
||||||
mkdir -p \"$project_path\"
|
|
||||||
cd \"$project_path\"
|
|
||||||
echo \"# $project_name\" > README.md
|
|
||||||
echo \"$description\" >> README.md
|
|
||||||
|
|
||||||
# Crear estructura básica según el tipo de proyecto
|
|
||||||
case $project_type in
|
|
||||||
\"web\")
|
|
||||||
mkdir -p src/assets src/components src/styles
|
|
||||||
touch src/index.js src/styles/main.css
|
|
||||||
;;
|
|
||||||
\"api\")
|
|
||||||
mkdir -p src/controllers src/models src/routes
|
|
||||||
touch src/app.js src/config.js
|
|
||||||
;;
|
|
||||||
\"cli\")
|
|
||||||
mkdir -p src/commands src/utils
|
|
||||||
touch src/main.js src/config.js
|
|
||||||
;;
|
|
||||||
\"library\")
|
|
||||||
mkdir -p src/lib tests examples
|
|
||||||
touch src/index.js
|
|
||||||
;;
|
|
||||||
\"mobile\")
|
|
||||||
mkdir -p src/screens src/components src/assets
|
|
||||||
touch src/App.js
|
|
||||||
;;
|
|
||||||
esac
|
|
||||||
|
|
||||||
# Inicializar Git
|
|
||||||
git init > /dev/null 2>&1
|
|
||||||
echo 'node_modules\n.DS_Store\n*.log' > .gitignore
|
|
||||||
git add . > /dev/null 2>&1
|
|
||||||
git commit -m \"Initial commit\" > /dev/null 2>&1
|
|
||||||
"
|
|
||||||
|
|
||||||
# Mostrar resumen final
|
|
||||||
clear
|
|
||||||
show_header
|
|
||||||
|
|
||||||
gum style --foreground "#00FF00" "✅ Proyecto creado exitosamente:"
|
|
||||||
echo
|
|
||||||
gum style --bold "Ubicación: " --no-bold "$project_path"
|
|
||||||
gum style --bold "Estructura:"
|
|
||||||
echo
|
|
||||||
find "$project_path" -type f -o -type d | grep -v ".git" | sort | sed "s|$project_path|└── proyecto|"
|
|
||||||
echo
|
|
||||||
|
|
||||||
gum style --foreground "#00AAFF" "Siguientes pasos:"
|
|
||||||
echo
|
|
||||||
gum style "1. Navega a tu proyecto: cd $project_path"
|
|
||||||
gum style "2. Inicia el desarrollo con tu IDE favorito"
|
|
||||||
gum style "3. Consulta la documentación en el README.md"
|
|
||||||
}
|
|
||||||
|
|
||||||
# Ejecutar programa
|
|
||||||
main
|
|
||||||
```
|
|
||||||
|
|
||||||
## Consejos y Mejores Prácticas
|
|
||||||
|
|
||||||
1. **Verificación de instalación**: Siempre verifica que Gum esté instalado antes de usarlo:
|
|
||||||
```bash
|
|
||||||
command -v gum >/dev/null 2>&1 || { echo "Gum no está instalado"; exit 1; }
|
|
||||||
```
|
|
||||||
|
|
||||||
2. **Personalización de colores**: Usa variables de entorno para personalizar colores:
|
|
||||||
```bash
|
|
||||||
export GUM_INPUT_PROMPT_FOREGROUND="#5F87FF"
|
|
||||||
```
|
|
||||||
|
|
||||||
3. **Reutilización**: Crea funciones para elementos comunes:
|
|
||||||
```bash
|
|
||||||
show_title() {
|
|
||||||
gum style --foreground 212 --bold --align center "$1"
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
4. **Validación de entrada**: Siempre valida las entradas del usuario:
|
|
||||||
```bash
|
|
||||||
if [[ -z "$input" ]]; then
|
|
||||||
gum style --foreground 196 "Error: Campo requerido"
|
|
||||||
fi
|
|
||||||
```
|
|
||||||
|
|
||||||
5. **Confirmaciones**: Usa confirmaciones antes de acciones irreversibles:
|
|
||||||
```bash
|
|
||||||
if gum confirm "¿Estás seguro?"; then
|
|
||||||
# acción peligrosa
|
|
||||||
fi
|
|
||||||
```
|
|
||||||
|
|
||||||
6. **Spinners para operaciones largas**: Muestra progreso durante operaciones que toman tiempo:
|
|
||||||
```bash
|
|
||||||
gum spin --spinner dot --title "Procesando..." -- sleep 3
|
|
||||||
```
|
|
||||||
|
|
||||||
7. **Anchura consistente**: Mantén una anchura consistente en tus interfaces:
|
|
||||||
```bash
|
|
||||||
WIDTH=50
|
|
||||||
gum style --width $WIDTH "Texto 1"
|
|
||||||
gum input --width $WIDTH
|
|
||||||
```
|
|
||||||
|
|
||||||
## Esquemas de Color y Estilos
|
|
||||||
|
|
||||||
Gum soporta colores hexadecimales y códigos ANSI:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Colores hexadecimales
|
|
||||||
gum style --foreground "#FF5F87" "Texto en rosa"
|
|
||||||
|
|
||||||
# Colores ANSI
|
|
||||||
gum style --foreground 212 "Texto en púrpura"
|
|
||||||
```
|
|
||||||
|
|
||||||
Estilos de texto disponibles:
|
|
||||||
- `--bold`: Texto en negrita
|
|
||||||
- `--italic`: Texto en cursiva
|
|
||||||
- `--strikethrough`: Texto tachado
|
|
||||||
- `--underline`: Texto subrayado
|
|
||||||
|
|
||||||
Estilos de borde:
|
|
||||||
- `--border normal`: Borde simple
|
|
||||||
- `--border double`: Borde doble
|
|
||||||
- `--border rounded`: Borde redondeado
|
|
||||||
- `--border thick`: Borde grueso
|
|
||||||
|
|
||||||
## Conclusión
|
|
||||||
|
|
||||||
Gum es una herramienta poderosa para elevar la experiencia de usuario en tus scripts de shell. Permite crear interfaces atractivas y funcionales sin salir de la terminal. En MRDevs Tools, Gum está integrado y listo para usarse, lo que te permite crear flujos de trabajo más intuitivos y profesionales.
|
|
||||||
|
|
||||||
## Recursos Adicionales
|
|
||||||
|
|
||||||
- [Documentación oficial de Gum](https://github.com/charmbracelet/gum)
|
|
||||||
- [Charm.sh](https://charm.sh/) - Creadores de Gum y otras herramientas TUI
|
|
||||||
- [Lip Gloss](https://github.com/charmbracelet/lipgloss) - Biblioteca para estilos en Go (base de Gum)
|
|
||||||
- [Bubble Tea](https://github.com/charmbracelet/bubbletea) - Framework TUI en Go (usado por Gum)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
Creado por Cortana Rosero One para MRDevs Tools.
|
|
||||||
Última actualización: 2025/04/04
|
|
||||||
Loading…
Reference in a new issue