1. Introducción a Gemini CLI [0]

Gemini CLI es una herramienta de desarrollo de programación que ha cambiado la forma en que los desarrolladores interactúan con los chatbots de IA, ofreciendo acceso a todo el código de un proyecto para generar resultados más precisos.

1.1. ¿Qué es Gemini CLI y por qué es popular? [0]

  1. Gemini CLI se lanzó el mes pasado y ha revolucionado el sector del desarrollo de la programación porque cambia el concepto tradicional de cómo se utilizan los chatbots de IA [0].
    1. Aunque el concepto de Gemini CLI no es nuevo, ya se había visto en la nube, pero la nube era muy cara y menos accesible para principiantes [0].
    2. Gemini CLI permite enviar siete solicitudes por hora y 1000 solicitudes al día, lo que significa que la mayoría de las tareas se pueden realizar de forma gratuita, lo que lo hace muy popular [0].
  2. A diferencia de los chatbots tradicionales como ChatGPT, Claude, Gemini o Perplexity, que solo dan sugerencias basadas en el código o la instrucción que se les da, Gemini CLI tiene acceso completo al proyecto en el que se trabaja [0].
    1. Gemini CLI comprende la estructura del proyecto, los archivos y todos los detalles, lo que le permite dar resultados mucho más precisos y mejorar el flujo de trabajo [0].
    2. Anteriormente, las sugerencias de ChatGPT a menudo no funcionaban en los proyectos y requerían mucho tiempo de depuración, pero Gemini CLI, al tener el contexto completo, ofrece mejores resultados [0].

2. Configuración e instalación de Gemini CLI [1]

La instalación de Gemini CLI implica la creación de una carpeta de proyecto, la verificación de la versión de Node.js y la ejecución de comandos para instalar la herramienta.

2.1. Preparación del entorno de desarrollo [1]

  1. El primer paso es crear una carpeta en el escritorio de la computadora, por ejemplo, llamada "Learning CLI", para mantener el proyecto organizado [1].
    1. Esta carpeta se abre en un editor de código como VS Code, lo que ayuda a organizar todos los archivos del proyecto [1].
  2. Es necesario asegurarse de que Node.js versión 18 o superior esté instalado en la computadora [1].
    1. Para verificar la versión de Node.js, se abre la terminal (en VS Code o la terminal del sistema) y se escribe node -v [1].
    2. Si Node.js no está instalado o la versión es anterior a la 18, se debe descargar la versión LTS (Long Term Support) desde el sitio web de Node.js e instalarla como cualquier otro software [1].
    3. Después de la instalación, es recomendable reiniciar la terminal o el editor de código para que los cambios surtan efecto [1].

2.2. Instalación de Gemini CLI [1]

  1. Una vez que Node.js está configurado, se instala Gemini CLI usando npm (Node Package Manager) [1].
    1. En la terminal, se escribe npm install -g google-gemini-cli o npm install -g @google/gemini-cli [1].
    2. Se debe confirmar la instalación escribiendo "Y" cuando se le pregunte "¿Desea continuar?" [1].
  2. Después de la instalación, se debe autenticar Gemini CLI con una cuenta de Google personal [1].
    1. Esto se hace siguiendo las instrucciones en la terminal, que generalmente implican iniciar sesión en una cuenta de Google en el navegador [1].
    2. La autenticación permite hasta 60 solicitudes de modelo por minuto y 1000 solicitudes por día en la versión gratuita [1].
    3. Para aumentar los límites o usar modelos específicos, se puede generar una clave API desde Google AI Studio [1].
  3. Gemini CLI también permite crear un archivo gemini.md para personalizar las instrucciones, similar a cómo se configuran las acciones en ChatGPT para obtener mejores resultados [1].

3. Creación de un sitio web de portafolio con Gemini CLI [1]

Gemini CLI puede generar un sitio web de portafolio completo, incluyendo estructura, diseño y contenido, basándose en instrucciones simples.

3.1. Generación inicial del sitio web [1]

  1. Después de la configuración, se puede empezar a interactuar con Gemini CLI escribiendo un mensaje en la terminal [1].
    1. Por ejemplo, se puede pedir: "Quiero crear un sitio web de portafolio usando HTML, CSS, JavaScript y Tailwind CSS" [1].
    2. Gemini CLI responderá con un plan, incluyendo la pila de tecnología (HTML5, CSS, JavaScript) y la estructura del sitio web (encabezado, héroe, acerca de, habilidades, proyectos, contacto, pie de página) [4].
    3. Aunque no se especificaron las secciones, Gemini CLI las infiere basándose en las secciones comunes de los sitios web de portafolio [6].
  2. Gemini CLI generará un diseño limpio, moderno y responsivo, utilizando texto e imágenes de marcador de posición que se pueden reemplazar fácilmente [8].
    1. Se debe permitir que Gemini CLI escriba los archivos cuando lo solicite, preferiblemente seleccionando "Permitir siempre" para evitar confirmaciones repetidas [8].
    2. Gemini CLI creará archivos HTML, CSS y JavaScript, y los integrará para formar el sitio web [8].
  3. Una vez que los archivos están listos, se puede abrir el archivo HTML en el navegador para ver el sitio web generado [8].
    1. El sitio web incluirá secciones como "Acerca de mí", "Habilidades", "Proyectos" y "Contacto" [8].
    2. Se puede personalizar el contenido editando directamente los archivos HTML [8].

3.2. Personalización y mejora del sitio web [8]

  1. Se pueden realizar mejoras en el sitio web, como añadir imágenes personalizadas [9].
    1. Se pueden descargar imágenes de sitios como Unsplash o Google Images y guardarlas en una carpeta llamada IMAGES dentro del directorio del proyecto [9].
    2. Luego, se le puede pedir a Gemini CLI que actualice el sitio web para incluir estas imágenes [10].
  2. Gemini CLI puede ayudar a mejorar la capacidad de respuesta móvil del sitio web [9].
    1. Se le puede indicar a Gemini CLI: "Este sitio web no es responsivo para móviles. Hazlo responsivo, y el menú móvil necesita ser un menú de hamburguesa para una animación interactiva" [9].
    2. Gemini CLI reescribirá el código HTML y JavaScript para implementar estas características [9].
  3. Se puede refinar el diseño de secciones específicas, como el área del héroe [10].
    1. Por ejemplo, se le puede pedir a Gemini CLI que haga el área del héroe más profesional y atractiva, tomando inspiración de las imágenes añadidas en la sección de proyectos [10].
    2. También se pueden renombrar los proyectos basándose en las imágenes [10].
    3. Gemini CLI actualizará el diseño y el contenido en tiempo real, lo que permite ver los cambios inmediatamente si se usa un servidor en vivo [10].
  4. Se pueden cambiar los colores y las fuentes del sitio web [11].
    1. Se le puede pedir a Gemini CLI que use una paleta de colores específica o un degradado oscuro [11].
    2. Para las fuentes, se pueden especificar fuentes de Google Fonts, como "Poppins" para el cuerpo del texto y "Playfair Display" para los encabezados, junto con el peso de la fuente [11].
    3. Gemini CLI actualizará automáticamente la configuración de Tailwind CSS y los estilos para aplicar las nuevas fuentes y colores [11].
  5. Gemini CLI también puede optimizar la capacidad de respuesta de áreas específicas, como el formulario de contacto [11].
    1. Si los campos del formulario están demasiado juntos en dispositivos móviles, se le puede pedir a Gemini CLI que los optimice para móviles [11].
    2. Gemini CLI ajustará el espaciado y el diseño para mejorar la experiencia del usuario en diferentes tamaños de pantalla [11].

4. Comparación de Gemini CLI con chatbots tradicionales y el futuro de la codificación [11]

Gemini CLI ofrece una ventaja significativa sobre los chatbots tradicionales al comprender el contexto completo del proyecto, lo que resalta la importancia de una base sólida en codificación para los desarrolladores.

4.1. Ventajas de Gemini CLI sobre los chatbots tradicionales [11]

  1. Anteriormente, al usar ChatGPT o cualquier otro chatbot, si uno se atascaba en una parte del código, la sugerencia no siempre era buena porque el chatbot no tenía acceso a todo el proyecto [11].
    1. Esto resultaba en problemas y mucho tiempo de depuración, ya que el chatbot no podía entender el contexto completo del proyecto [11].
  2. Con Gemini CLI, si algo no funciona, solo se necesita explicar el problema, y la herramienta lo corrige directamente [11].
    1. Por ejemplo, cuando se le dijo a Gemini CLI que los colores de Tailwind CSS no se aplicaban, sugirió reemplazar el enlace CDN, y funcionó [11].
    2. Si no gustaba una fuente, se le pedía que la cambiara, y lo hacía, incluso actualizando la configuración de Tailwind CSS automáticamente [11].
    3. Se le podía dar una imagen y pedirle que cambiara la paleta de colores basándose en ella, y lo hacía [11].
  3. Gemini CLI no solo da sugerencias, sino que realiza los cambios directamente en el código, lo que lo hace mucho más potente que los chatbots anteriores [11].

4.2. La importancia de una base sólida en codificación en la era de la IA [11]

  1. Aunque las herramientas de IA como Gemini CLI pueden generar sitios web completos con solo unas pocas instrucciones, la calidad de estos sitios web puede no cumplir con los estándares profesionales actuales [11].
    1. Un sitio web generado por IA en 2025 podría no ser adecuado para un portafolio profesional si se compara con las tendencias de diseño actuales en plataformas como ThemeForest [12].
  2. Para crear un sitio web de alta calidad con IA, se necesita una comprensión profunda de la codificación para dar instrucciones detalladas y precisas [12].
    1. Por ejemplo, para un menú de hamburguesa con una animación específica, se deben dar instrucciones muy detalladas, lo cual es difícil para alguien sin conocimientos técnicos [12].
  3. La IA no siempre puede resolver problemas complejos por sí misma; a veces, el desarrollador debe intervenir y corregir el código manualmente [12].
    1. Por ejemplo, cuando se le pidió a Gemini CLI que eliminara el espaciado excesivo alrededor de una imagen, no pudo hacerlo completamente, y el desarrollador tuvo que ajustarlo manualmente [12].
    2. Esto demuestra que una base sólida en codificación permite identificar y resolver problemas que la IA no puede manejar [12].
  4. Para mantener una carrera sostenible en el futuro, los desarrolladores deben fortalecer sus fundamentos de codificación y optimizar su proceso de aprendizaje [12].
    1. Es crucial no solo ver tutoriales, sino pausar, practicar el código y comprender los conceptos a fondo [12].
    2. Leer recursos como W3Schools y otros materiales ayuda a construir una base sólida [12].
    3. Los desarrolladores deben explorar las herramientas de IA, aprender ingeniería de prompts y entender cómo obtener los mejores resultados de ellas, pero siempre con una base técnica fuerte [12].