27 | {/* Sidebar móvil */}
28 |
35 |
36 | {/* Overlay móvil */}
37 | {isOpen && (
38 |
setIsOpen(false)}
41 | />
42 | )}
43 |
44 | {/* Contenido principal */}
45 |
46 |
47 |
53 |
54 |
55 |
56 |
57 | } />
58 | } />
59 | } />
60 | } />
61 | } />
62 | } />
63 | } />
64 | } />
65 | } />
66 | } />
67 | } />
68 | } />
69 |
70 |
71 |
72 |
73 |
74 |
75 | );
76 | };
77 |
78 | export default App;
--------------------------------------------------------------------------------
/src/assets/react.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/components/CategoryFilter.jsx:
--------------------------------------------------------------------------------
1 | import { Fragment } from 'react';
2 | import { Listbox, Transition } from '@headlessui/react';
3 | import { Check, ChevronDown } from 'lucide-react';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const categories = [
7 | { id: 'all', name: 'Todos' },
8 | { id: 'git', name: 'Git' },
9 | { id: 'linux', name: 'Linux' },
10 | { id: 'python', name: 'Python' },
11 | { id: 'docker', name: 'Docker' },
12 | { id: 'powershell', name: 'PowerShell' },
13 | { id: 'postgresql', name: 'PostgreSQL' },
14 | { id: 'apache', name: 'Apache' },
15 | { id: 'nginx', name: 'Nginx' },
16 | { id: 'openssl', name: 'OpenSSL' },
17 | { id: 'letsencrypt', name: "Let's Encrypt" },
18 | { id: 'ssh', name: 'SSH' }
19 | ];
20 |
21 | const CategoryFilter = ({ selectedCategory, onCategoryChange }) => {
22 | const { isDark } = useTheme();
23 | const selected = categories.find(cat => cat.id === selectedCategory) || categories[0];
24 |
25 | return (
26 |
27 |
onCategoryChange(category.id)}>
28 |
29 |
38 | {selected.name}
39 |
40 |
41 |
42 |
43 |
49 |
54 | {categories.map((category) => (
55 | `
58 | relative cursor-pointer select-none py-2 pl-10 pr-4
59 | ${active ?
60 | 'bg-indigo-500 text-white' :
61 | isDark ? 'text-gray-200' : 'text-gray-900'}
62 | `}
63 | value={category}
64 | >
65 | {({ selected, active }) => (
66 | <>
67 |
68 | {category.name}
69 |
70 | {selected ? (
71 |
75 |
76 |
77 | ) : null}
78 |
79 | )}
80 |
81 | ))}
82 |
83 |
84 |
85 |
86 |
87 | );
88 | };
89 |
90 | export default CategoryFilter;
--------------------------------------------------------------------------------
/src/components/CommandCard.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import { ClipboardCopy, Check } from 'lucide-react';
3 | import { useTheme } from '../context/ThemeContext';
4 |
5 | const getCategoryStyle = (category) => {
6 | const styles = {
7 | git: 'bg-gradient-to-r from-[#F05032] to-[#FF6B4A] text-white',
8 | linux: 'bg-gradient-to-r from-[#FCC624] to-[#FFD700] text-black',
9 | python: 'bg-gradient-to-r from-[#3776AB] to-[#4B8BBE] text-white',
10 | docker: 'bg-gradient-to-r from-[#2496ED] to-[#37A3FF] text-white',
11 | powershell: 'bg-gradient-to-r from-[#5391FE] to-[#3D87F5] text-white',
12 | postgresql: 'bg-gradient-to-r from-[#336791] to-[#4682B4] text-white',
13 | apache: 'bg-gradient-to-r from-[#D22128] to-[#FF2D35] text-white',
14 | nginx: 'bg-gradient-to-r from-[#009639] to-[#00B347] text-white',
15 | openssl: 'bg-gradient-to-r from-[#721412] to-[#9B1B18] text-white',
16 | letsencrypt: 'bg-gradient-to-r from-[#2C3C3D] to-[#3F5657] text-white',
17 | ssh: 'bg-gradient-to-r from-[#231F20] to-[#3D3536] text-white'
18 | };
19 | return styles[category] || 'bg-gradient-to-r from-gray-500 to-gray-600 text-white';
20 | };
21 |
22 | const CommandCard = ({ command, description, example, category }) => {
23 | const [copied, setCopied] = useState(false);
24 | const { isDark } = useTheme();
25 |
26 | const copyToClipboard = () => {
27 | navigator.clipboard.writeText(command);
28 | setCopied(true);
29 | setTimeout(() => setCopied(false), 2000);
30 | };
31 |
32 | return (
33 |
39 |
40 |
41 |
42 | {category}
43 |
44 |
54 |
55 |
56 |
61 | {command}
62 |
63 |
64 |
65 | {description}
66 |
67 |
68 | {example && (
69 |
70 |
71 | Ejemplo:
72 |
73 |
78 |
79 | {example}
80 |
81 |
82 |
83 | )}
84 |
85 |
86 | );
87 | };
88 |
89 | export default CommandCard;
--------------------------------------------------------------------------------
/src/components/CommandList.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandCard from './CommandCard';
3 | import { useTheme } from '../context/ThemeContext';
4 |
5 | const CommandList = ({ commands = [], searchTerm = '', selectedCategory = 'all' }) => {
6 | const { isDark } = useTheme();
7 |
8 | const filteredCommands = commands.filter((command) => {
9 | const matchesSearch = searchTerm.toLowerCase();
10 | const matchesCategory = selectedCategory === 'all' || command.category === selectedCategory;
11 |
12 | return (
13 | (command.command.toLowerCase().includes(matchesSearch) ||
14 | command.description.toLowerCase().includes(matchesSearch)) &&
15 | matchesCategory
16 | );
17 | });
18 |
19 | return (
20 |
21 | {filteredCommands.map((command) => (
22 |
23 | ))}
24 | {filteredCommands.length === 0 && (
25 |
26 |
27 | No se encontraron comandos
28 |
29 |
30 | Intenta con otros términos de búsqueda
31 |
32 |
33 | )}
34 |
35 | );
36 | };
37 |
38 | export default CommandList;
--------------------------------------------------------------------------------
/src/components/Navbar.jsx:
--------------------------------------------------------------------------------
1 | import { Moon, Sun } from 'lucide-react';
2 | import { useTheme } from '../context/ThemeContext';
3 |
4 | const Navbar = ({ children, className }) => {
5 | const { isDark, toggleTheme } = useTheme();
6 |
7 | return (
8 |
29 | );
30 | };
31 |
32 | export default Navbar;
--------------------------------------------------------------------------------
/src/components/SearchBar.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Search } from 'lucide-react';
3 | import { useTheme } from '../context/ThemeContext';
4 |
5 | const SearchBar = ({ onSearch }) => {
6 | const { isDark } = useTheme();
7 |
8 | return (
9 |
10 | onSearch(e.target.value)}
14 | className={`
15 | w-full pl-12 pr-4 py-3 rounded-lg
16 | ${isDark ?
17 | 'bg-gray-800 text-gray-200 border-gray-700 placeholder-gray-400' :
18 | 'bg-white text-gray-900 border-gray-200 placeholder-gray-500'}
19 | border focus:outline-none focus:ring-2 focus:ring-blue-500
20 | transition-all duration-300 ease-in-out
21 | `}
22 | />
23 |
27 |
28 | );
29 | };
30 |
31 | export default SearchBar;
--------------------------------------------------------------------------------
/src/components/Sidebar.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Link, useLocation } from 'react-router-dom';
3 | import {
4 | Home, GitBranch, Terminal, Container, Database,
5 | Server, Shield, Lock, Box, X
6 | } from 'lucide-react';
7 | import { useTheme } from '../context/ThemeContext';
8 |
9 | const Sidebar = ({ onClose }) => {
10 | const location = useLocation();
11 | const { isDark } = useTheme();
12 |
13 | const menuItems = [
14 | { name: 'Inicio', icon: Home, path: '/' },
15 | { name: 'Git', icon: GitBranch, path: '/git' },
16 | { name: 'Linux', icon: Terminal, path: '/linux' },
17 | { name: 'Python', icon: Box, path: '/python' },
18 | { name: 'Docker', icon: Container, path: '/docker' },
19 | { name: 'PowerShell', icon: Terminal, path: '/powershell' },
20 | { name: 'PostgreSQL', icon: Database, path: '/postgresql' },
21 | { name: 'Apache', icon: Server, path: '/apache' },
22 | { name: 'Nginx', icon: Server, path: '/nginx' },
23 | { name: 'OpenSSL', icon: Shield, path: '/openssl' },
24 | { name: "Let's Encrypt", icon: Lock, path: '/letsencrypt' },
25 | { name: 'SSH', icon: Terminal, path: '/ssh' }
26 | ];
27 |
28 | return (
29 |
30 |
31 |
32 | Documentación CLI
33 |
34 |
35 |
36 |
59 |
60 | );
61 | };
62 |
63 | export default Sidebar;
--------------------------------------------------------------------------------
/src/context/ThemeContext.jsx:
--------------------------------------------------------------------------------
1 | import { createContext, useContext, useState } from 'react';
2 |
3 | const ThemeContext = createContext();
4 |
5 | export const ThemeProvider = ({ children }) => {
6 | const [isDark, setIsDark] = useState(false);
7 |
8 | const toggleTheme = () => setIsDark(!isDark);
9 |
10 | return (
11 |
12 |
13 | {children}
14 |
15 |
16 | );
17 | };
18 |
19 | export const useTheme = () => useContext(ThemeContext);
--------------------------------------------------------------------------------
/src/data/apacheCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "apache-1",
4 | command: "apache2ctl -t",
5 | description: "Verifica la sintaxis de la configuración",
6 | category: "apache",
7 | example: "apache2ctl -t"
8 | },
9 | {
10 | id: "apache-2",
11 | command: "apache2ctl -S",
12 | description: "Muestra la configuración del servidor virtual",
13 | category: "apache",
14 | example: "apache2ctl -S"
15 | },
16 | {
17 | id: "apache-3",
18 | command: "apache2ctl graceful",
19 | description: "Reinicia Apache de forma elegante",
20 | category: "apache",
21 | example: "sudo apache2ctl graceful"
22 | },
23 | {
24 | id: "apache-4",
25 | command: "apache2ctl configtest",
26 | description: "Prueba el archivo de configuración",
27 | category: "apache",
28 | example: "apache2ctl configtest"
29 | },
30 | {
31 | id: "apache-5",
32 | command: "a2ensite [sitio]",
33 | description: "Habilita un sitio virtual",
34 | category: "apache",
35 | example: "sudo a2ensite 000-default.conf"
36 | },
37 | {
38 | id: "apache-6",
39 | command: "a2dissite [sitio]",
40 | description: "Deshabilita un sitio virtual",
41 | category: "apache",
42 | example: "sudo a2dissite 000-default.conf"
43 | },
44 | {
45 | id: "apache-7",
46 | command: "a2enmod [módulo]",
47 | description: "Habilita un módulo Apache",
48 | category: "apache",
49 | example: "sudo a2enmod rewrite"
50 | },
51 | {
52 | id: "apache-8",
53 | command: "a2dismod [módulo]",
54 | description: "Deshabilita un módulo Apache",
55 | category: "apache",
56 | example: "sudo a2dismod rewrite"
57 | },
58 | {
59 | id: "apache-9",
60 | command: "htpasswd -c [archivo] [usuario]",
61 | description: "Crea un nuevo archivo de contraseñas",
62 | category: "apache",
63 | example: "htpasswd -c /etc/apache2/.htpasswd usuario1"
64 | },
65 | {
66 | id: "apache-10",
67 | command: "apache2ctl -l",
68 | description: "Lista los módulos compilados",
69 | category: "apache",
70 | example: "apache2ctl -l"
71 | },
72 | {
73 | id: "apache-11",
74 | command: "apache2ctl -M",
75 | description: "Lista los módulos cargados",
76 | category: "apache",
77 | example: "apache2ctl -M"
78 | },
79 | {
80 | id: "apache-12",
81 | command: "apache2ctl -v",
82 | description: "Muestra la versión de Apache",
83 | category: "apache",
84 | example: "apache2ctl -v"
85 | },
86 | {
87 | id: "apache-13",
88 | command: "tail -f /var/log/apache2/error.log",
89 | description: "Monitoriza el log de errores en tiempo real",
90 | category: "apache",
91 | example: "tail -f /var/log/apache2/error.log"
92 | },
93 | {
94 | id: "apache-14",
95 | command: "apache2ctl status",
96 | description: "Muestra el estado del servidor",
97 | category: "apache",
98 | example: "apache2ctl status"
99 | },
100 | {
101 | id: "apache-15",
102 | command: "apache2ctl fullstatus",
103 | description: "Muestra el estado completo del servidor",
104 | category: "apache",
105 | example: "apache2ctl fullstatus"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/certbotCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "certbot-1",
4 | command: "certbot certonly",
5 | description: "Obtiene un certificado sin instalarlo",
6 | category: "certbot",
7 | example: "certbot certonly --webroot -w /var/www/html -d ejemplo.com"
8 | },
9 | {
10 | id: "certbot-2",
11 | command: "certbot renew",
12 | description: "Renueva todos los certificados que vencerán pronto",
13 | category: "certbot",
14 | example: "certbot renew --dry-run"
15 | }
16 | ];
--------------------------------------------------------------------------------
/src/data/commands.js:
--------------------------------------------------------------------------------
1 | import { commands as gitCommands } from './gitCommands';
2 | import { commands as linuxCommands } from './linuxCommands';
3 | import { commands as pythonCommands } from './pythonCommands';
4 | import { commands as dockerCommands } from './dockerCommands';
5 | import { commands as postgresqlCommands } from './postgresqlCommands';
6 | import { commands as powershellCommands } from './powershellCommands';
7 | import { commands as apacheCommands } from './apacheCommands';
8 | import { commands as nginxCommands } from './nginxCommands';
9 | import { commands as opensslCommands } from './opensslCommands';
10 | import { commands as letsencryptCommands } from './letsencryptCommands';
11 | import { commands as sshCommands } from './sshCommands';
12 |
13 | export const commands = [
14 | ...gitCommands,
15 | ...linuxCommands,
16 | ...pythonCommands,
17 | ...dockerCommands,
18 | ...postgresqlCommands,
19 | ...powershellCommands,
20 | ...apacheCommands,
21 | ...nginxCommands,
22 | ...opensslCommands,
23 | ...letsencryptCommands,
24 | ...sshCommands
25 | ];
--------------------------------------------------------------------------------
/src/data/dockerCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "docker-1",
4 | command: "docker ps",
5 | description: "Lista los contenedores en ejecución",
6 | category: "docker",
7 | example: "docker ps -a # Muestra todos los contenedores"
8 | },
9 | {
10 | id: "docker-2",
11 | command: "docker images",
12 | description: "Muestra las imágenes descargadas localmente",
13 | category: "docker",
14 | example: "docker images"
15 | },
16 | {
17 | id: "docker-3",
18 | command: "docker build",
19 | description: "Construye una imagen desde un Dockerfile",
20 | category: "docker",
21 | example: "docker build -t mi-app:1.0 ."
22 | },
23 | {
24 | id: "docker-4",
25 | command: "docker run [imagen]",
26 | description: "Crea y ejecuta un nuevo contenedor",
27 | category: "docker",
28 | example: "docker run -d -p 80:80 nginx"
29 | },
30 | {
31 | id: "docker-5",
32 | command: "docker-compose up",
33 | description: "Levanta servicios definidos en docker-compose.yml",
34 | category: "docker",
35 | example: "docker-compose up -d"
36 | },
37 | {
38 | id: "docker-6",
39 | command: "docker stop [contenedor]",
40 | description: "Detiene uno o más contenedores en ejecución",
41 | category: "docker",
42 | example: "docker stop mi-contenedor"
43 | },
44 | {
45 | id: "docker-7",
46 | command: "docker rm [contenedor]",
47 | description: "Elimina uno o más contenedores",
48 | category: "docker",
49 | example: "docker rm mi-contenedor"
50 | },
51 | {
52 | id: "docker-8",
53 | command: "docker rmi [imagen]",
54 | description: "Elimina una o más imágenes",
55 | category: "docker",
56 | example: "docker rmi nginx:latest"
57 | },
58 | {
59 | id: "docker-9",
60 | command: "docker exec",
61 | description: "Ejecuta un comando en un contenedor en ejecución",
62 | category: "docker",
63 | example: "docker exec -it mi-contenedor bash"
64 | },
65 | {
66 | id: "docker-10",
67 | command: "docker logs [contenedor]",
68 | description: "Muestra los logs de un contenedor",
69 | category: "docker",
70 | example: "docker logs --tail 100 mi-contenedor"
71 | },
72 | {
73 | id: "docker-11",
74 | command: "docker network",
75 | description: "Gestiona redes de Docker",
76 | category: "docker",
77 | example: "docker network create mi-red"
78 | },
79 | {
80 | id: "docker-12",
81 | command: "docker volume",
82 | description: "Gestiona volúmenes de Docker",
83 | category: "docker",
84 | example: "docker volume create mi-volumen"
85 | },
86 | {
87 | id: "docker-13",
88 | command: "docker-compose down",
89 | description: "Detiene y elimina los servicios definidos",
90 | category: "docker",
91 | example: "docker-compose down --volumes"
92 | },
93 | {
94 | id: "docker-14",
95 | command: "docker inspect",
96 | description: "Muestra información detallada de objetos Docker",
97 | category: "docker",
98 | example: "docker inspect mi-contenedor"
99 | },
100 | {
101 | id: "docker-15",
102 | command: "docker push",
103 | description: "Sube una imagen a un registro",
104 | category: "docker",
105 | example: "docker push miregistro.com/mi-app:1.0"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/gitCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "git-1",
4 | command: "git init",
5 | description: "Inicializa un nuevo repositorio Git",
6 | category: "git",
7 | example: "git init mi-proyecto"
8 | },
9 | {
10 | id: "git-2",
11 | command: "git clone [url]",
12 | description: "Clona un repositorio remoto en tu máquina local",
13 | category: "git",
14 | example: "git clone https://github.com/usuario/repo.git"
15 | },
16 | {
17 | id: "git-3",
18 | command: "git add [archivo]",
19 | description: "Añade archivos al área de preparación (staging)",
20 | category: "git",
21 | example: "git add . # Añade todos los archivos\ngit add archivo.txt # Añade un archivo específico"
22 | },
23 | {
24 | id: "git-4",
25 | command: "git commit -m \"mensaje\"",
26 | description: "Crea un nuevo commit con los cambios en staging",
27 | category: "git",
28 | example: "git commit -m \"Añade función de login\""
29 | },
30 | {
31 | id: "git-5",
32 | command: "git branch [nombre-rama]",
33 | description: "Crea, lista o elimina ramas",
34 | category: "git",
35 | example: "git branch feature/login # Crea rama\ngit branch -d feature/login # Elimina rama"
36 | },
37 | {
38 | id: "git-6",
39 | command: "git checkout [rama]",
40 | description: "Cambia a una rama específica",
41 | category: "git",
42 | example: "git checkout develop"
43 | },
44 | {
45 | id: "git-7",
46 | command: "git merge [rama]",
47 | description: "Fusiona una rama con la rama actual",
48 | category: "git",
49 | example: "git merge feature/login"
50 | },
51 | {
52 | id: "git-8",
53 | command: "git pull",
54 | description: "Obtiene y fusiona cambios del repositorio remoto",
55 | category: "git",
56 | example: "git pull origin main"
57 | },
58 | {
59 | id: "git-9",
60 | command: "git push",
61 | description: "Envía commits locales al repositorio remoto",
62 | category: "git",
63 | example: "git push origin main"
64 | },
65 | {
66 | id: "git-10",
67 | command: "git status",
68 | description: "Muestra el estado del directorio de trabajo",
69 | category: "git",
70 | example: "git status"
71 | },
72 | {
73 | id: "git-11",
74 | command: "git log",
75 | description: "Muestra el historial de commits",
76 | category: "git",
77 | example: "git log --oneline # Formato resumido"
78 | },
79 | {
80 | id: "git-12",
81 | command: "git stash",
82 | description: "Guarda cambios en un stash temporal",
83 | category: "git",
84 | example: "git stash save \"Cambios temporales\""
85 | },
86 | {
87 | id: "git-13",
88 | command: "git reset [commit]",
89 | description: "Deshace cambios hasta un commit específico",
90 | category: "git",
91 | example: "git reset --hard HEAD~1"
92 | },
93 | {
94 | id: "git-14",
95 | command: "git fetch",
96 | description: "Descarga objetos y referencias del repositorio remoto",
97 | category: "git",
98 | example: "git fetch origin"
99 | },
100 | {
101 | id: "git-15",
102 | command: "git remote",
103 | description: "Gestiona repositorios remotos",
104 | category: "git",
105 | example: "git remote add origin https://github.com/usuario/repo.git"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/letsencryptCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "le-1",
4 | command: "certbot --nginx",
5 | description: "Obtiene e instala un certificado para Nginx",
6 | category: "letsencrypt",
7 | example: "certbot --nginx -d example.com -d www.example.com"
8 | },
9 | {
10 | id: "le-2",
11 | command: "certbot --apache",
12 | description: "Obtiene e instala un certificado para Apache",
13 | category: "letsencrypt",
14 | example: "certbot --apache -d example.com"
15 | },
16 | {
17 | id: "le-3",
18 | command: "certbot certonly",
19 | description: "Obtiene un certificado sin instalarlo",
20 | category: "letsencrypt",
21 | example: "certbot certonly --webroot -w /var/www/html -d example.com"
22 | },
23 | {
24 | id: "le-4",
25 | command: "certbot renew",
26 | description: "Renueva todos los certificados que vencerán pronto",
27 | category: "letsencrypt",
28 | example: "certbot renew --dry-run"
29 | },
30 | {
31 | id: "le-5",
32 | command: "certbot certificates",
33 | description: "Lista todos los certificados gestionados por Certbot",
34 | category: "letsencrypt",
35 | example: "certbot certificates"
36 | },
37 | {
38 | id: "le-6",
39 | command: "certbot delete",
40 | description: "Elimina un certificado",
41 | category: "letsencrypt",
42 | example: "certbot delete --cert-name example.com"
43 | },
44 | {
45 | id: "le-7",
46 | command: "certbot revoke",
47 | description: "Revoca un certificado",
48 | category: "letsencrypt",
49 | example: "certbot revoke --cert-path /etc/letsencrypt/live/example.com/cert.pem"
50 | },
51 | {
52 | id: "le-8",
53 | command: "certbot update_account",
54 | description: "Actualiza la información de la cuenta",
55 | category: "letsencrypt",
56 | example: "certbot update_account --email nuevo@ejemplo.com"
57 | },
58 | {
59 | id: "le-9",
60 | command: "certbot show_account",
61 | description: "Muestra información de la cuenta",
62 | category: "letsencrypt",
63 | example: "certbot show_account"
64 | },
65 | {
66 | id: "le-10",
67 | command: "certbot rollback",
68 | description: "Revierte los cambios de configuración",
69 | category: "letsencrypt",
70 | example: "certbot rollback"
71 | },
72 | {
73 | id: "le-11",
74 | command: "certbot --standalone",
75 | description: "Obtiene un certificado usando el servidor web incorporado",
76 | category: "letsencrypt",
77 | example: "certbot --standalone -d example.com"
78 | },
79 | {
80 | id: "le-12",
81 | command: "certbot --manual",
82 | description: "Obtiene un certificado manualmente",
83 | category: "letsencrypt",
84 | example: "certbot --manual --preferred-challenges dns -d *.example.com"
85 | },
86 | {
87 | id: "le-13",
88 | command: "certbot enhance",
89 | description: "Modifica la configuración de seguridad del servidor",
90 | category: "letsencrypt",
91 | example: "certbot enhance --hsts example.com"
92 | },
93 | {
94 | id: "le-14",
95 | command: "certbot install",
96 | description: "Instala un certificado existente",
97 | category: "letsencrypt",
98 | example: "certbot install --cert-name example.com"
99 | },
100 | {
101 | id: "le-15",
102 | command: "certbot register",
103 | description: "Registra una nueva cuenta",
104 | category: "letsencrypt",
105 | example: "certbot register --email admin@example.com"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/linuxCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "linux-1",
4 | command: "ls",
5 | description: "Lista el contenido de un directorio",
6 | category: "linux",
7 | example: "ls -la # Lista detallada incluyendo archivos ocultos"
8 | },
9 | {
10 | id: "linux-2",
11 | command: "cd [directorio]",
12 | description: "Cambia el directorio actual",
13 | category: "linux",
14 | example: "cd /home/usuario/documentos"
15 | },
16 | {
17 | id: "linux-3",
18 | command: "pwd",
19 | description: "Muestra la ruta del directorio actual",
20 | category: "linux",
21 | example: "pwd"
22 | },
23 | {
24 | id: "linux-4",
25 | command: "mkdir [nombre]",
26 | description: "Crea un nuevo directorio",
27 | category: "linux",
28 | example: "mkdir -p proyectos/nuevo"
29 | },
30 | {
31 | id: "linux-5",
32 | command: "rm [archivo]",
33 | description: "Elimina archivos o directorios",
34 | category: "linux",
35 | example: "rm -rf directorio # Elimina recursivamente"
36 | },
37 | {
38 | id: "linux-6",
39 | command: "cp [origen] [destino]",
40 | description: "Copia archivos o directorios",
41 | category: "linux",
42 | example: "cp -r /origen /destino"
43 | },
44 | {
45 | id: "linux-7",
46 | command: "mv [origen] [destino]",
47 | description: "Mueve o renombra archivos o directorios",
48 | category: "linux",
49 | example: "mv archivo.txt nuevo.txt"
50 | },
51 | {
52 | id: "linux-8",
53 | command: "chmod [permisos] [archivo]",
54 | description: "Cambia los permisos de archivos o directorios",
55 | category: "linux",
56 | example: "chmod 755 script.sh"
57 | },
58 | {
59 | id: "linux-9",
60 | command: "chown [usuario:grupo] [archivo]",
61 | description: "Cambia el propietario de archivos o directorios",
62 | category: "linux",
63 | example: "chown usuario:grupo archivo.txt"
64 | },
65 | {
66 | id: "linux-10",
67 | command: "find [ruta] -name [patrón]",
68 | description: "Busca archivos y directorios",
69 | category: "linux",
70 | example: "find / -name \"*.log\""
71 | },
72 | {
73 | id: "linux-11",
74 | command: "grep [patrón] [archivo]",
75 | description: "Busca patrones en archivos",
76 | category: "linux",
77 | example: "grep -r \"error\" /var/log/"
78 | },
79 | {
80 | id: "linux-12",
81 | command: "ps",
82 | description: "Muestra los procesos en ejecución",
83 | category: "linux",
84 | example: "ps aux | grep nginx"
85 | },
86 | {
87 | id: "linux-13",
88 | command: "kill [PID]",
89 | description: "Termina un proceso",
90 | category: "linux",
91 | example: "kill -9 1234"
92 | },
93 | {
94 | id: "linux-14",
95 | command: "tar",
96 | description: "Comprime o descomprime archivos",
97 | category: "linux",
98 | example: "tar -czf archivo.tar.gz directorio/"
99 | },
100 | {
101 | id: "linux-15",
102 | command: "df",
103 | description: "Muestra el espacio en disco",
104 | category: "linux",
105 | example: "df -h"
106 | },
107 | {
108 | id: "linux-16",
109 | command: "du",
110 | description: "Muestra el uso de espacio de archivos y directorios",
111 | category: "linux",
112 | example: "du -sh *"
113 | },
114 | {
115 | id: "linux-17",
116 | command: "top",
117 | description: "Muestra los procesos en tiempo real",
118 | category: "linux",
119 | example: "top"
120 | },
121 | {
122 | id: "linux-18",
123 | command: "systemctl",
124 | description: "Controla el sistema systemd y servicios",
125 | category: "linux",
126 | example: "systemctl status nginx"
127 | }
128 | ];
--------------------------------------------------------------------------------
/src/data/nginxCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "nginx-1",
4 | command: "nginx -t",
5 | description: "Verifica la sintaxis de la configuración",
6 | category: "nginx",
7 | example: "nginx -t"
8 | },
9 | {
10 | id: "nginx-2",
11 | command: "nginx -s reload",
12 | description: "Recarga la configuración sin detener el servicio",
13 | category: "nginx",
14 | example: "nginx -s reload"
15 | },
16 | {
17 | id: "nginx-3",
18 | command: "nginx -s stop",
19 | description: "Detiene el servidor Nginx",
20 | category: "nginx",
21 | example: "nginx -s stop"
22 | },
23 | {
24 | id: "nginx-4",
25 | command: "nginx -s quit",
26 | description: "Detiene el servidor Nginx de forma elegante",
27 | category: "nginx",
28 | example: "nginx -s quit"
29 | },
30 | {
31 | id: "nginx-5",
32 | command: "nginx -V",
33 | description: "Muestra la versión y configuración de compilación",
34 | category: "nginx",
35 | example: "nginx -V"
36 | },
37 | {
38 | id: "nginx-6",
39 | command: "systemctl start nginx",
40 | description: "Inicia el servicio Nginx",
41 | category: "nginx",
42 | example: "sudo systemctl start nginx"
43 | },
44 | {
45 | id: "nginx-7",
46 | command: "systemctl status nginx",
47 | description: "Muestra el estado del servicio Nginx",
48 | category: "nginx",
49 | example: "sudo systemctl status nginx"
50 | },
51 | {
52 | id: "nginx-8",
53 | command: "nginx -c [archivo]",
54 | description: "Especifica un archivo de configuración alternativo",
55 | category: "nginx",
56 | example: "nginx -c /etc/nginx/nginx-custom.conf"
57 | },
58 | {
59 | id: "nginx-9",
60 | command: "tail -f /var/log/nginx/access.log",
61 | description: "Monitoriza el log de acceso en tiempo real",
62 | category: "nginx",
63 | example: "tail -f /var/log/nginx/access.log"
64 | },
65 | {
66 | id: "nginx-10",
67 | command: "tail -f /var/log/nginx/error.log",
68 | description: "Monitoriza el log de errores en tiempo real",
69 | category: "nginx",
70 | example: "tail -f /var/log/nginx/error.log"
71 | },
72 | {
73 | id: "nginx-11",
74 | command: "nginx -T",
75 | description: "Muestra la configuración actual",
76 | category: "nginx",
77 | example: "nginx -T"
78 | },
79 | {
80 | id: "nginx-12",
81 | command: "openssl req -new -newkey rsa:2048 -nodes -keyout server.key -out server.csr",
82 | description: "Genera una nueva solicitud de certificado SSL",
83 | category: "nginx",
84 | example: "openssl req -new -newkey rsa:2048 -nodes -keyout /etc/nginx/ssl/server.key -out server.csr"
85 | },
86 | {
87 | id: "nginx-13",
88 | command: "nginx -s reopen",
89 | description: "Reabre los archivos de log",
90 | category: "nginx",
91 | example: "nginx -s reopen"
92 | },
93 | {
94 | id: "nginx-14",
95 | command: "htpasswd -c /etc/nginx/.htpasswd [usuario]",
96 | description: "Crea un archivo de autenticación básica",
97 | category: "nginx",
98 | example: "htpasswd -c /etc/nginx/.htpasswd usuario1"
99 | },
100 | {
101 | id: "nginx-15",
102 | command: "nginx -g [directiva]",
103 | description: "Establece directivas globales",
104 | category: "nginx",
105 | example: "nginx -g 'daemon off;'"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/opensslCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "ssl-1",
4 | command: "openssl genrsa -out [archivo].key [bits]",
5 | description: "Genera una clave privada RSA",
6 | category: "openssl",
7 | example: "openssl genrsa -out private.key 2048"
8 | },
9 | {
10 | id: "ssl-2",
11 | command: "openssl req -new -key [clave].key -out [archivo].csr",
12 | description: "Genera una solicitud de firma de certificado (CSR)",
13 | category: "openssl",
14 | example: "openssl req -new -key private.key -out request.csr"
15 | },
16 | {
17 | id: "ssl-3",
18 | command: "openssl x509 -in [cert].crt -text",
19 | description: "Muestra el contenido de un certificado",
20 | category: "openssl",
21 | example: "openssl x509 -in certificate.crt -text -noout"
22 | },
23 | {
24 | id: "ssl-4",
25 | command: "openssl verify [cert].crt",
26 | description: "Verifica un certificado",
27 | category: "openssl",
28 | example: "openssl verify -CAfile ca.crt certificate.crt"
29 | },
30 | {
31 | id: "ssl-5",
32 | command: "openssl s_client -connect [host:puerto]",
33 | description: "Prueba una conexión SSL/TLS",
34 | category: "openssl",
35 | example: "openssl s_client -connect example.com:443"
36 | },
37 | {
38 | id: "ssl-6",
39 | command: "openssl rsa -in [clave].key -pubout",
40 | description: "Extrae la clave pública de una clave privada",
41 | category: "openssl",
42 | example: "openssl rsa -in private.key -pubout -out public.key"
43 | },
44 | {
45 | id: "ssl-7",
46 | command: "openssl req -x509 -new -key [clave].key -out [cert].crt",
47 | description: "Genera un certificado autofirmado",
48 | category: "openssl",
49 | example: "openssl req -x509 -new -key private.key -out cert.crt -days 365"
50 | },
51 | {
52 | id: "ssl-8",
53 | command: "openssl pkcs12 -export -out [archivo].pfx",
54 | description: "Crea un archivo PKCS#12 (.pfx/.p12)",
55 | category: "openssl",
56 | example: "openssl pkcs12 -export -out certificate.pfx -inkey private.key -in certificate.crt"
57 | },
58 | {
59 | id: "ssl-9",
60 | command: "openssl dhparam -out [archivo].pem [bits]",
61 | description: "Genera parámetros Diffie-Hellman",
62 | category: "openssl",
63 | example: "openssl dhparam -out dhparams.pem 2048"
64 | },
65 | {
66 | id: "ssl-10",
67 | command: "openssl crl -in [archivo].crl -text",
68 | description: "Muestra el contenido de una lista de revocación",
69 | category: "openssl",
70 | example: "openssl crl -in revocation.crl -text -noout"
71 | },
72 | {
73 | id: "ssl-11",
74 | command: "openssl enc -aes-256-cbc -in [archivo]",
75 | description: "Encripta un archivo usando AES",
76 | category: "openssl",
77 | example: "openssl enc -aes-256-cbc -in plaintext.txt -out encrypted.bin"
78 | },
79 | {
80 | id: "ssl-12",
81 | command: "openssl rand -out [archivo] [bytes]",
82 | description: "Genera bytes aleatorios",
83 | category: "openssl",
84 | example: "openssl rand -out random.bin 32"
85 | },
86 | {
87 | id: "ssl-13",
88 | command: "openssl dgst -sha256 [archivo]",
89 | description: "Calcula el hash de un archivo",
90 | category: "openssl",
91 | example: "openssl dgst -sha256 documento.pdf"
92 | },
93 | {
94 | id: "ssl-14",
95 | command: "openssl ca -in [csr] -out [cert]",
96 | description: "Firma un CSR como una CA",
97 | category: "openssl",
98 | example: "openssl ca -in request.csr -out signed.crt"
99 | },
100 | {
101 | id: "ssl-15",
102 | command: "openssl x509 -checkend [segundos]",
103 | description: "Verifica la fecha de vencimiento de un certificado",
104 | category: "openssl",
105 | example: "openssl x509 -in cert.pem -checkend 86400"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/postgresqlCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "pg-1",
4 | command: "\\l",
5 | description: "Lista todas las bases de datos",
6 | category: "postgresql",
7 | example: "\\l"
8 | },
9 | {
10 | id: "pg-2",
11 | command: "\\c [database]",
12 | description: "Conecta a una base de datos específica",
13 | category: "postgresql",
14 | example: "\\c mibasededatos"
15 | },
16 | {
17 | id: "pg-3",
18 | command: "\\dt",
19 | description: "Lista todas las tablas en la base de datos actual",
20 | category: "postgresql",
21 | example: "\\dt"
22 | },
23 | {
24 | id: "pg-4",
25 | command: "\\du",
26 | description: "Lista todos los usuarios y sus roles",
27 | category: "postgresql",
28 | example: "\\du"
29 | },
30 | {
31 | id: "pg-5",
32 | command: "CREATE DATABASE [nombre]",
33 | description: "Crea una nueva base de datos",
34 | category: "postgresql",
35 | example: "CREATE DATABASE mibasededatos;"
36 | },
37 | {
38 | id: "pg-6",
39 | command: "DROP DATABASE [nombre]",
40 | description: "Elimina una base de datos",
41 | category: "postgresql",
42 | example: "DROP DATABASE mibasededatos;"
43 | },
44 | {
45 | id: "pg-7",
46 | command: "CREATE USER [nombre] WITH PASSWORD '[contraseña]'",
47 | description: "Crea un nuevo usuario",
48 | category: "postgresql",
49 | example: "CREATE USER miusuario WITH PASSWORD 'micontraseña';"
50 | },
51 | {
52 | id: "pg-8",
53 | command: "GRANT [privilegios] ON [objeto] TO [usuario]",
54 | description: "Otorga privilegios a un usuario",
55 | category: "postgresql",
56 | example: "GRANT ALL PRIVILEGES ON DATABASE mibasededatos TO miusuario;"
57 | },
58 | {
59 | id: "pg-9",
60 | command: "\\d [tabla]",
61 | description: "Describe la estructura de una tabla",
62 | category: "postgresql",
63 | example: "\\d mitabla"
64 | },
65 | {
66 | id: "pg-10",
67 | command: "CREATE INDEX [nombre] ON [tabla] ([columna])",
68 | description: "Crea un índice en una tabla",
69 | category: "postgresql",
70 | example: "CREATE INDEX idx_nombre ON usuarios (nombre);"
71 | },
72 | {
73 | id: "pg-11",
74 | command: "VACUUM [tabla]",
75 | description: "Limpia y optimiza una tabla",
76 | category: "postgresql",
77 | example: "VACUUM ANALYZE mitabla;"
78 | },
79 | {
80 | id: "pg-12",
81 | command: "pg_dump -U [usuario] [database] > [archivo]",
82 | description: "Respalda una base de datos",
83 | category: "postgresql",
84 | example: "pg_dump -U postgres mibasededatos > respaldo.sql"
85 | },
86 | {
87 | id: "pg-13",
88 | command: "psql -U [usuario] -d [database] -f [archivo]",
89 | description: "Restaura una base de datos desde un archivo",
90 | category: "postgresql",
91 | example: "psql -U postgres -d mibasededatos -f respaldo.sql"
92 | },
93 | {
94 | id: "pg-14",
95 | command: "ALTER USER [usuario] WITH PASSWORD '[nueva_contraseña]'",
96 | description: "Cambia la contraseña de un usuario",
97 | category: "postgresql",
98 | example: "ALTER USER miusuario WITH PASSWORD 'nueva_contraseña';"
99 | },
100 | {
101 | id: "pg-15",
102 | command: "\\timing",
103 | description: "Activa/desactiva el tiempo de ejecución de consultas",
104 | category: "postgresql",
105 | example: "\\timing"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/powershellCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "ps-1",
4 | command: "Get-Process",
5 | description: "Lista todos los procesos en ejecución",
6 | category: "powershell",
7 | example: "Get-Process | Where-Object {$_.CPU -gt 100}"
8 | },
9 | {
10 | id: "ps-2",
11 | command: "Get-Service",
12 | description: "Lista todos los servicios del sistema",
13 | category: "powershell",
14 | example: "Get-Service | Where-Object {$_.Status -eq 'Running'}"
15 | },
16 | {
17 | id: "ps-3",
18 | command: "Start-Service",
19 | description: "Inicia un servicio Windows",
20 | category: "powershell",
21 | example: "Start-Service -Name 'wuauserv'"
22 | },
23 | {
24 | id: "ps-4",
25 | command: "Get-ChildItem",
26 | description: "Lista archivos y carpetas (equivalente a dir/ls)",
27 | category: "powershell",
28 | example: "Get-ChildItem -Path C:\\ -Recurse -Filter *.txt"
29 | },
30 | {
31 | id: "ps-5",
32 | command: "New-Item",
33 | description: "Crea nuevos archivos o carpetas",
34 | category: "powershell",
35 | example: "New-Item -Path 'C:\\temp' -ItemType Directory"
36 | },
37 | {
38 | id: "ps-6",
39 | command: "Copy-Item",
40 | description: "Copia archivos y carpetas",
41 | category: "powershell",
42 | example: "Copy-Item 'C:\\origen' 'D:\\destino' -Recurse"
43 | },
44 | {
45 | id: "ps-7",
46 | command: "Remove-Item",
47 | description: "Elimina archivos y carpetas",
48 | category: "powershell",
49 | example: "Remove-Item 'C:\\temp\\*' -Recurse -Force"
50 | },
51 | {
52 | id: "ps-8",
53 | command: "Get-Content",
54 | description: "Muestra el contenido de un archivo",
55 | category: "powershell",
56 | example: "Get-Content log.txt -Tail 10"
57 | },
58 | {
59 | id: "ps-9",
60 | command: "Set-Content",
61 | description: "Escribe contenido en un archivo",
62 | category: "powershell",
63 | example: "Set-Content -Path file.txt -Value 'Nuevo contenido'"
64 | },
65 | {
66 | id: "ps-10",
67 | command: "Get-EventLog",
68 | description: "Obtiene eventos del registro de Windows",
69 | category: "powershell",
70 | example: "Get-EventLog -LogName System -Newest 10"
71 | },
72 | {
73 | id: "ps-11",
74 | command: "Invoke-RestMethod",
75 | description: "Realiza peticiones HTTP/REST",
76 | category: "powershell",
77 | example: "Invoke-RestMethod -Uri 'https://api.ejemplo.com/datos'"
78 | },
79 | {
80 | id: "ps-12",
81 | command: "Get-WmiObject",
82 | description: "Obtiene información WMI del sistema",
83 | category: "powershell",
84 | example: "Get-WmiObject -Class Win32_LogicalDisk"
85 | },
86 | {
87 | id: "ps-13",
88 | command: "Test-Connection",
89 | description: "Comprueba la conectividad de red",
90 | category: "powershell",
91 | example: "Test-Connection -ComputerName 'servidor01' -Count 4"
92 | },
93 | {
94 | id: "ps-14",
95 | command: "Get-NetAdapter",
96 | description: "Muestra información de adaptadores de red",
97 | category: "powershell",
98 | example: "Get-NetAdapter | Where-Object Status -eq 'Up'"
99 | },
100 | {
101 | id: "ps-15",
102 | command: "Export-Csv",
103 | description: "Exporta datos a archivo CSV",
104 | category: "powershell",
105 | example: "Get-Process | Export-Csv procesos.csv"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/pythonCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "python-1",
4 | command: "python -m venv [nombre]",
5 | description: "Crea un entorno virtual",
6 | category: "python",
7 | example: "python -m venv mi_entorno"
8 | },
9 | {
10 | id: "python-2",
11 | command: "source [entorno]/bin/activate",
12 | description: "Activa un entorno virtual en Unix/macOS",
13 | category: "python",
14 | example: "source mi_entorno/bin/activate"
15 | },
16 | {
17 | id: "python-3",
18 | command: "[entorno]\\Scripts\\activate.bat",
19 | description: "Activa un entorno virtual en Windows",
20 | category: "python",
21 | example: "mi_entorno\\Scripts\\activate.bat"
22 | },
23 | {
24 | id: "python-4",
25 | command: "pip install [paquete]",
26 | description: "Instala un paquete Python",
27 | category: "python",
28 | example: "pip install requests"
29 | },
30 | {
31 | id: "python-5",
32 | command: "pip freeze > requirements.txt",
33 | description: "Guarda las dependencias en un archivo",
34 | category: "python",
35 | example: "pip freeze > requirements.txt"
36 | },
37 | {
38 | id: "python-6",
39 | command: "pip install -r requirements.txt",
40 | description: "Instala dependencias desde un archivo",
41 | category: "python",
42 | example: "pip install -r requirements.txt"
43 | },
44 | {
45 | id: "python-7",
46 | command: "python [archivo].py",
47 | description: "Ejecuta un script Python",
48 | category: "python",
49 | example: "python script.py"
50 | },
51 | {
52 | id: "python-8",
53 | command: "python -m pip install --upgrade pip",
54 | description: "Actualiza pip a la última versión",
55 | category: "python",
56 | example: "python -m pip install --upgrade pip"
57 | },
58 | {
59 | id: "python-9",
60 | command: "python -m pytest",
61 | description: "Ejecuta tests con pytest",
62 | category: "python",
63 | example: "python -m pytest tests/"
64 | },
65 | {
66 | id: "python-10",
67 | command: "python -m http.server",
68 | description: "Inicia un servidor web simple",
69 | category: "python",
70 | example: "python -m http.server 8000"
71 | },
72 | {
73 | id: "python-11",
74 | command: "python manage.py runserver",
75 | description: "Inicia el servidor de desarrollo Django",
76 | category: "python",
77 | example: "python manage.py runserver 0.0.0.0:8000"
78 | },
79 | {
80 | id: "python-12",
81 | command: "python manage.py makemigrations",
82 | description: "Crea migraciones en Django",
83 | category: "python",
84 | example: "python manage.py makemigrations"
85 | },
86 | {
87 | id: "python-13",
88 | command: "python manage.py migrate",
89 | description: "Aplica migraciones en Django",
90 | category: "python",
91 | example: "python manage.py migrate"
92 | },
93 | {
94 | id: "python-14",
95 | command: "python -m pip install -e .",
96 | description: "Instala un paquete en modo desarrollo",
97 | category: "python",
98 | example: "python -m pip install -e ."
99 | },
100 | {
101 | id: "python-15",
102 | command: "python -c \"comando\"",
103 | description: "Ejecuta código Python desde la línea de comandos",
104 | category: "python",
105 | example: "python -c \"import sys; print(sys.version)\""
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/data/sshCommands.js:
--------------------------------------------------------------------------------
1 | export const commands = [
2 | {
3 | id: "ssh-1",
4 | command: "ssh-keygen -t ed25519",
5 | description: "Genera un nuevo par de claves SSH usando Ed25519",
6 | category: "ssh",
7 | example: "ssh-keygen -t ed25519 -C \"email@ejemplo.com\""
8 | },
9 | {
10 | id: "ssh-2",
11 | command: "ssh-copy-id usuario@host",
12 | description: "Copia la clave pública al servidor remoto",
13 | category: "ssh",
14 | example: "ssh-copy-id -i ~/.ssh/id_ed25519.pub usuario@servidor"
15 | },
16 | {
17 | id: "ssh-3",
18 | command: "ssh -p [puerto] usuario@host",
19 | description: "Conecta a un servidor usando un puerto específico",
20 | category: "ssh",
21 | example: "ssh -p 2222 usuario@servidor"
22 | },
23 | {
24 | id: "ssh-4",
25 | command: "scp [origen] [destino]",
26 | description: "Copia archivos de forma segura entre hosts",
27 | category: "ssh",
28 | example: "scp archivo.txt usuario@servidor:/ruta/destino/"
29 | },
30 | {
31 | id: "ssh-5",
32 | command: "ssh-add [clave]",
33 | description: "Añade una clave privada al agente SSH",
34 | category: "ssh",
35 | example: "ssh-add ~/.ssh/id_ed25519"
36 | },
37 | {
38 | id: "ssh-6",
39 | command: "ssh -L [puerto-local]:[host]:[puerto-remoto]",
40 | description: "Crea un túnel SSH para reenvío de puertos local",
41 | category: "ssh",
42 | example: "ssh -L 8080:localhost:80 usuario@servidor"
43 | },
44 | {
45 | id: "ssh-7",
46 | command: "ssh-keyscan [host]",
47 | description: "Obtiene las claves públicas de un host",
48 | category: "ssh",
49 | example: "ssh-keyscan github.com >> ~/.ssh/known_hosts"
50 | },
51 | {
52 | id: "ssh-8",
53 | command: "ssh -R [puerto-remoto]:[host]:[puerto-local]",
54 | description: "Crea un túnel SSH para reenvío de puertos remoto",
55 | category: "ssh",
56 | example: "ssh -R 8080:localhost:80 usuario@servidor"
57 | },
58 | {
59 | id: "ssh-9",
60 | command: "sftp usuario@host",
61 | description: "Inicia una sesión SFTP con un servidor remoto",
62 | category: "ssh",
63 | example: "sftp usuario@servidor"
64 | },
65 | {
66 | id: "ssh-10",
67 | command: "ssh-agent bash",
68 | description: "Inicia el agente SSH en el shell actual",
69 | category: "ssh",
70 | example: "eval $(ssh-agent -s)"
71 | },
72 | {
73 | id: "ssh-11",
74 | command: "ssh-keygen -R [host]",
75 | description: "Elimina una entrada del archivo known_hosts",
76 | category: "ssh",
77 | example: "ssh-keygen -R servidor.ejemplo.com"
78 | },
79 | {
80 | id: "ssh-12",
81 | command: "ssh -i [clave] usuario@host",
82 | description: "Conecta usando una clave privada específica",
83 | category: "ssh",
84 | example: "ssh -i ~/.ssh/mi_clave usuario@servidor"
85 | },
86 | {
87 | id: "ssh-13",
88 | command: "ssh -X usuario@host",
89 | description: "Habilita el reenvío X11 para aplicaciones gráficas",
90 | category: "ssh",
91 | example: "ssh -X usuario@servidor"
92 | },
93 | {
94 | id: "ssh-14",
95 | command: "ssh -f -N [comando-tunel]",
96 | description: "Ejecuta un túnel SSH en segundo plano",
97 | category: "ssh",
98 | example: "ssh -f -N -L 8080:localhost:80 usuario@servidor"
99 | },
100 | {
101 | id: "ssh-15",
102 | command: "ssh-keygen -lf [clave]",
103 | description: "Muestra la huella digital de una clave SSH",
104 | category: "ssh",
105 | example: "ssh-keygen -lf ~/.ssh/id_ed25519.pub"
106 | }
107 | ];
--------------------------------------------------------------------------------
/src/main.jsx:
--------------------------------------------------------------------------------
1 | import { StrictMode } from "react";
2 | import { createRoot } from "react-dom/client";
3 | import "./styles/index.css";
4 | import App from "./App";
5 |
6 | createRoot(document.getElementById("root")).render(
7 |
8 |
9 |
10 | );
--------------------------------------------------------------------------------
/src/pages/ApacheCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/apacheCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const ApacheCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos Apache
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default ApacheCommands;
--------------------------------------------------------------------------------
/src/pages/Dashboard.jsx:
--------------------------------------------------------------------------------
1 | // src/pages/Dashboard.jsx
2 | import React, { useState, useEffect } from 'react';
3 | import CommandList from '../components/CommandList';
4 | import SearchBar from '../components/SearchBar';
5 | import CategoryFilter from '../components/CategoryFilter';
6 | import { commands } from '../data/commands';
7 | import { useTheme } from '../context/ThemeContext';
8 |
9 | const Dashboard = () => {
10 | const [searchTerm, setSearchTerm] = useState('');
11 | const [selectedCategory, setSelectedCategory] = useState('all');
12 | const [filteredCommands, setFilteredCommands] = useState(commands);
13 | const { isDark } = useTheme();
14 |
15 | useEffect(() => {
16 | const filtered = commands.filter(command => {
17 | const matchesSearch = command.command.toLowerCase().includes(searchTerm.toLowerCase()) ||
18 | command.description.toLowerCase().includes(searchTerm.toLowerCase());
19 | const matchesCategory = selectedCategory === 'all' || command.category === selectedCategory;
20 | return matchesSearch && matchesCategory;
21 | });
22 | setFilteredCommands(filtered);
23 | }, [searchTerm, selectedCategory]);
24 |
25 | return (
26 |
27 |
28 |
29 |
33 |
34 |
39 |
40 | );
41 | };
42 |
43 | export default Dashboard;
--------------------------------------------------------------------------------
/src/pages/DatabaseCommands.jsx:
--------------------------------------------------------------------------------
1 | import CommandList from '../components/CommandList';
2 | import { commands } from '../data/databaseCommands';
3 |
4 | const DatabaseCommands = () => {
5 | return (
6 |
7 |
Comandos de Base de Datos
8 |
9 |
10 | );
11 | };
12 |
13 | export default DatabaseCommands;
--------------------------------------------------------------------------------
/src/pages/DockerCommands.jsx:
--------------------------------------------------------------------------------
1 | import CommandList from '../components/CommandList';
2 | import { commands } from '../data/dockerCommands';
3 |
4 | const DockerCommands = () => {
5 | return (
6 |
7 |
Comandos Docker
8 |
9 |
10 | );
11 | };
12 |
13 | export default DockerCommands;
--------------------------------------------------------------------------------
/src/pages/GitCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/gitCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const GitCommands = () => {
7 | const { isDark } = useTheme();
8 |
9 | return (
10 |
11 |
12 | Comandos Git
13 |
14 |
15 |
16 | );
17 | };
18 |
19 | export default GitCommands;
--------------------------------------------------------------------------------
/src/pages/LetsEncryptCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/letsencryptCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const LetsEncryptCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos Let's Encrypt
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default LetsEncryptCommands;
--------------------------------------------------------------------------------
/src/pages/LinuxCommands.jsx:
--------------------------------------------------------------------------------
1 | import CommandList from '../components/CommandList';
2 | import { commands } from '../data/linuxCommands';
3 |
4 | const LinuxCommands = () => {
5 | return (
6 |
7 |
Comandos Linux
8 |
9 |
10 | );
11 | };
12 |
13 | export default LinuxCommands;
--------------------------------------------------------------------------------
/src/pages/NginxCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/nginxCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const NginxCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos Nginx
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default NginxCommands;
--------------------------------------------------------------------------------
/src/pages/OpenSSLCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/opensslCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const OpenSSLCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos OpenSSL
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default OpenSSLCommands;
--------------------------------------------------------------------------------
/src/pages/PostgreSQLCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/postgresqlCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const PostgreSQLCommands = () => {
7 | const { isDark } = useTheme();
8 |
9 | return (
10 |
11 |
12 | Comandos PostgreSQL
13 |
14 |
15 |
16 | );
17 | };
18 |
19 | export default PostgreSQLCommands;
--------------------------------------------------------------------------------
/src/pages/PowerShellCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/powershellCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const PowerShellCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos PowerShell
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default PowerShellCommands;
--------------------------------------------------------------------------------
/src/pages/PythonCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/pythonCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const PythonCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos Python
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default PythonCommands;
--------------------------------------------------------------------------------
/src/pages/SSHCommands.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CommandList from '../components/CommandList';
3 | import { commands } from '../data/sshCommands';
4 | import { useTheme } from '../context/ThemeContext';
5 |
6 | const SSHCommands = () => {
7 | const { isDark } = useTheme();
8 | return (
9 |
10 |
11 | Comandos SSH Avanzados
12 |
13 |
14 |
15 | );
16 | };
17 |
18 | export default SSHCommands;
--------------------------------------------------------------------------------
/src/styles/index.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 | .sidebar {
6 | @apply fixed top-0 left-0 h-screen w-64
7 | bg-gray-100 dark:bg-gray-900
8 | shadow-lg z-50
9 | overflow-y-auto;
10 | }
11 |
12 | .nav-link {
13 | @apply flex items-center px-4 py-3
14 | text-gray-700 dark:text-gray-200
15 | hover:bg-gray-200 dark:hover:bg-gray-800
16 | rounded-lg mx-2 transition-colors;
17 | }
18 |
19 | .nav-link.active {
20 | @apply bg-indigo-600 text-white;
21 | }
22 |
23 | .nav-link-icon {
24 | @apply h-5 w-5 mr-3 transition-colors
25 | text-gray-500 dark:text-gray-400;
26 | }
27 |
28 | @layer components {
29 | .sidebar {
30 | @apply fixed lg:static top-0 left-0 h-screen w-64
31 | bg-gray-100 dark:bg-gray-900
32 | shadow-lg z-50;
33 | }
34 |
35 | .nav-link {
36 | @apply flex items-center px-4 py-3
37 | text-gray-700 dark:text-gray-300
38 | hover:bg-gray-200 dark:hover:bg-gray-800
39 | rounded-lg mx-2 transition-colors;
40 | }
41 |
42 | .nav-link.active {
43 | @apply bg-indigo-600 text-white;
44 | }
45 | }
46 |
47 | @layer utilities {
48 | .scrollbar-thin {
49 | scrollbar-width: thin;
50 | }
51 |
52 | .scrollbar-thumb-gray-400::-webkit-scrollbar-thumb {
53 | background-color: #9CA3AF;
54 | border-radius: 6px;
55 | }
56 |
57 | .scrollbar-thumb-gray-600::-webkit-scrollbar-thumb {
58 | background-color: #4B5563;
59 | border-radius: 6px;
60 | }
61 |
62 | .scrollbar-track-transparent::-webkit-scrollbar-track {
63 | background-color: transparent;
64 | }
65 |
66 | ::-webkit-scrollbar {
67 | width: 6px;
68 | height: 6px;
69 | }
70 | }
--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
1 | /** @type {import('tailwindcss').Config} */
2 | export default {
3 | content: [
4 | "./index.html",
5 | "./src/**/*.{js,ts,jsx,tsx}",
6 | ],
7 | darkMode: 'class',
8 | theme: {
9 | extend: {
10 | colors: {
11 | git: "#F05032",
12 | linux: "#FCC624",
13 | python: "#3776AB",
14 | docker: "#2496ED",
15 | powershell: "#5391FE",
16 | postgresql: "#336791",
17 | apache: "#D22128",
18 | nginx: "#009639",
19 | openssl: "#721412",
20 | letsencrypt: "#2C3C3D",
21 | ssh: "#231F20",
22 | dark: {
23 | bg: '#1a1a1a',
24 | card: '#2d2d2d',
25 | text: '#e5e5e5'
26 | }
27 | },
28 | animation: {
29 | 'fade-in': 'fadeIn 0.5s ease-in-out',
30 | 'slide-in': 'slideIn 0.3s ease-out',
31 | },
32 | keyframes: {
33 | fadeIn: {
34 | '0%': { opacity: '0' },
35 | '100%': { opacity: '1' },
36 | },
37 | slideIn: {
38 | '0%': { transform: 'translateX(-100%)' },
39 | '100%': { transform: 'translateX(0)' },
40 | }
41 | }
42 | },
43 | },
44 | plugins: [],
45 | }
--------------------------------------------------------------------------------
/vite.config.js:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vite'
2 | import react from '@vitejs/plugin-react'
3 |
4 | // https://vite.dev/config/
5 | export default defineConfig({
6 | plugins: [react()],
7 | })
8 |
--------------------------------------------------------------------------------