OpenWebinars

Inteligencia Artificial

ChatGPT en VSCode: Mejora tu flujo de desarrollo

¿Lidiando con errores de código y bloqueos mentales mientras programas? La integración de ChatGPT en VSCode puede ofrecerte una solución a tus problemas. Descubre cómo esta integración de IA puede actuar como tu asistente de programación, proporcionándote consejos útiles y orientación en tiempo real.

Jorge López Blasco

Jorge López Blasco

Experto en Cloud Computing, Machine Learning y Big Data.

Lectura 12 minutos

Publicado el 11 de agosto de 2023

Compartir

Introducción

En este artículo te guiaremos hacia una nueva dimensión de productividad, en la que te presentaremos dos herramientas, cuyo uso conjunto, seguramente te dejarán perplejo: ChatGPT y VSCode.

Imagina contar con un compañero de inteligencia artificial como ChatGPT, ese modelo generativo de OpenAI que, según dicen, tiene todo el poder en el procesamiento de lenguaje natural para ofrecerte respuestas coherentes y contextualmente relevantes.

¿Suena a ciencia ficción?

Bueno, no te preocupes, porque en el otro extremo está VSCode, el editor de código más querido y versátil del momento. Supuestamente, ofrece un entorno flexible y extensible para tu desarrollo de software.

Dejando de lado la broma, en este artículo te mostraremos cómo fusionar estas dos herramientas de manera sensata para mejorar tu flujo de desarrollo.

Además exploraremos la integración de ChatGPT en VSCode y descubriremos los beneficios reales, las consideraciones y las limitaciones de esta combinación tecnológica. Para finalizar, te daremos consejos prácticos para aumentar tu productividad, ejemplos reales de uso y recursos adicionales para sacar el máximo provecho de esta poderosa combinación.

Así que, si estás preparado para adentrarte en este peculiar y sorprendente viaje, acompáñanos en el emocionante mundo de ChatGPT en VSCode. ¡Es hora de mejorar tu flujo de desarrollo!

Conceptos previos

Antes de sumergirnos en los detalles, es importante comprender los conceptos clave relacionados con ChatGPT y VSCode

Qué es ChatGPT

En este apartado vamos a tratar una tecnología de la que probablemente no hayas oído hablad nunca, ¡se trata de ChatGPT!

Es broma, ¿quién no ha oído hablar de ChatGPT el último mes? ChatGPT ha inundado las redes, incluso los programas de televisión. Y es que ha supuesto un cambio muy revolucionario.

A mí personalmente me gusta compararlo con la aparición de los ordenadores. Antiguamente era extraño tener un ordenador en casa, solamente se utilizaban en las oficinas, pero hoy en día es lo más común. Con ChatGPT ocurre lo mismo, las inteligencias artificiales llevan años utilizándose en muchas industrias, pero ChatGPT nos ha abierto las puertas a muchos usuarios.

ChatGPT es un modelo de lenguaje basado en inteligencia artificial desarrollado por OpenAI. Utiliza técnicas de procesamiento de lenguaje natural y redes neuronales para generar respuestas coherentes y contextualmente relevantes a partir de las entradas de texto. Es una herramienta versátil que puede mejorar la productividad y la interacción en diversas áreas.

Si te apasionan las IAs generativas y quieres sumergirte más en el tema, puedes revisar este Webinar: Javi López y el futuro de las IAs generativas.

Qué es VSCode

Por otro lado, VSCode, abreviatura de Visual Studio Code, es un editor de código fuente desarrollado por Microsoft. Es conocido por ser uno de los editores de código más populares y ampliamente utilizados en la industria del desarrollo de software. VSCode es altamente valorado por su versatilidad, rendimiento y amplia gama de funcionalidades.

Una de las fortalezas principales de VSCode es su capacidad de extensibilidad. Con una amplia selección de extensiones disponibles, los usuarios pueden personalizar su experiencia de desarrollo con características adicionales, integración con tecnologías específicas y soporte para diferentes lenguajes de programación y marcos de trabajo.

En nuestro caso, hablaremos de la extensión de ChatGPT. Para aprender más sobre VS Code y las ventajas que ofrece te recomendamos que visites la siguiente publicación Qué es Visual Studio Code y qué ventajas ofrece.

Aprende a desarrollar algoritmos de Machine Learning
Conviértete en un profesional de Machine Learning. Domina las habilidades y herramientas necesarias para implementar algoritmos de aprendizaje automático y Deep Learning en Python.
Comenzar gratis ahora

Por qué usar ChatGPT en Visual Studio Code

Existen varias razones por las cuales puedes considerar usar ChatGPT en Visual Studio Code:

- Mejora de la productividad: Al integrar ChatGPT en VSCode, puedes acceder a respuestas rápidas y contextualmente relevantes mientras escribes código. Esto puede agilizar tu flujo de trabajo y ayudarte a encontrar soluciones y sugerencias rápidas sin tener que salir del entorno de desarrollo.

- Asistencia en la resolución de problemas: ChatGPT puede actuar como un asistente virtual para ayudarte a resolver problemas técnicos mientras trabajas en tus proyectos. Puedes obtener explicaciones, soluciones y orientación en tiempo real, lo que te permite superar obstáculos de manera más eficiente.

- Acceso a documentación relevante: El asistente puede proporcionar acceso rápido a documentación, recursos y ejemplos relevantes. Si necesitas información sobre una biblioteca o función específica, puedes obtener explicaciones detalladas y ejemplos prácticos sin tener que buscar en otra pestaña o ventana.

- Sugerencias de código inteligentes: La integración de ChatGPT en VSCode puede ofrecer sugerencias de código inteligentes basadas en el contexto actual. Esto te permite completar fragmentos de código, corregir errores comunes y agilizar la escritura de código de manera más eficiente.

Cómo integrar ChatGPT en VSCode

En esta sección te mostraré cómo utilizar ChatGPT dentro de Visual Studio Code mediante una sencilla extensión.

Con esta extensión, podrás generar código en cualquier lenguaje mediante una instrucción o un comando. En otras palabras, podrás indicarle a la extensión qué quieres lograr y la inteligencia artificial se encargará de escribir el código por ti.

Instalación de la extensión para VSCode

En primer lugar, abre Visual Studio Code y dirígete a la sección de extensiones. En la barra de búsqueda, introduce “CodeGPT” y procede a instalar la extensión.

Una vez instalada la extensión, debemos configurarla. Para ello, ve a la sección de ajustes en Visual Studio Code y selecciona “Settings”. Dentro de la sección de ajustes, busca la opción correspondiente a la extensión “CodeGPT”.

Configuración de la clave de API

Lo primero que debemos hacer es crear una clave de API que utilizaremos para conectar ChatGPT con Visual Studio Code. Sin esta clave, la extensión no funcionará. En el siguiente articulo podéis ver un ejemplo, en esta ocasión para sincronizarlo con Google Sheets y Excel Cómo integrar la API de OpenAI con Google Sheets y Excel.

Para crear la clave de API, haz clic en donde se indica “API Key” y serás redirigido a tu cuenta de OpenAI. Dirígete a la sección de “API Keys” y selecciona “Create New Secret Key”. Copia la clave generada y regresa a Visual Studio Code.

Ahora, presiona la tecla F1 y escribe CodeGPT: Set API. Selecciona esta opción y pega la clave de API. Presiona “Intro” para guardarla. Ahora estarás conectado a ChatGPT y podrás utilizarlo.

Configuración de la extensión ChatGPT

En primer lugar, debemos configurar algunos parámetros. Por ejemplo, estableceremos el número máximo de tokens generados por instrucción en 500. Puedes ajustar este valor según tus necesidades, pero ten en cuenta que se cobrará en función del número de tokens utilizados.

Aquí viene una parte importante: puedes seleccionar el modelo que prefieras en la opción “Code GPT model”. La mayoría de tutoriales y guías utilizan el modelo “Code Da Vinci 002”, pero personalmente no me ha funcionado correctamente.

A continuación, selecciona el idioma que deseas utilizar. La temperatura determina el nivel de creatividad en las respuestas generadas. Cuanto más alto sea el valor, más creativas serán las respuestas. Te recomiendo probar y ajustar este valor según tus necesidades.

Ahora que hemos instalado y configurado la extensión ChatGPT en Visual Studio Code, solo queda realizar algunos ejemplos para ver cómo funciona y aprovechar su potencial. Para utilizar ChatGPT, simplemente presiona F1 en la consola de Visual Studio Code.

Si la opción “Ask” no aparece, escribe ask code gpt, presiona “Intro” y aparecerá un cuadro de diálogo donde podrás ingresar tu instrucción. Por ejemplo, puedes pedirle que genere una galería de imágenes en HTML y CSS, y verás lo increíble que es: con una sola instrucción, se generará la galería completa con los estilos incluidos. Puedes copiar y pegar este código en tu página web y listo.

Beneficios de la integración

Por si todavía no te ha quedado claro que la integración de estos dos servicios es realmente potente y puede resultar muy interesante en muchas situaciones, en este apartado vamos a comentar los beneficios de la integración de ChatGPT con Visual Studio Code.

- Soporte multi lenguaje: ChatGPT puede generar código en varios lenguajes de programación, lo que te brinda flexibilidad para trabajar en diferentes proyectos y contextos. Puedes utilizarlo para escribir código en lenguajes como Python, JavaScript, HTML, CSS, PHP y muchos más.

- Automatización de la generación de código: La integración de ChatGPT permite generar automáticamente código a partir de instrucciones o comandos. Esto ahorra tiempo y esfuerzo al evitar la necesidad de escribir manualmente cada línea de código.

- Incremento de la productividad: Al tener la capacidad de generar rápidamente segmentos de código, los desarrolladores pueden aumentar su productividad y acelerar el proceso de desarrollo. Esto permite enfocarse en tareas más complejas y estratégicas.

- Exploración y experimentación: La integración de ChatGPT brinda la oportunidad de explorar diferentes enfoques y soluciones para un problema específico. Los desarrolladores pueden utilizarlo como una herramienta para generar ideas creativas y descubrir nuevas formas de abordar desafíos de programación.

Consideraciones y limitaciones de uso

Si bien la integración de ChatGPT en Visual Studio Code puede ser beneficiosa, también es importante tener en cuenta algunas consideraciones y limitaciones:

- Calidad y corrección del código generado: Aunque ChatGPT es capaz de generar código, no garantiza automáticamente la calidad, eficiencia o corrección del mismo. Es esencial revisar y validar el código generado para asegurarse de que cumple con los requisitos y estándares necesarios. Se comenta muy a menudo que estas tecnologías pueden suponer la desaparición de los programadores, pero ahora estos perfiles son más necesarios que nunca, ya que se tienen que convertir en los profesores de las IAs, mostrándoles las mejores prácticas y corrigiendo sus errores.

- Dependencia de la conexión a Internet: La integración requiere una conexión a Internet para comunicarse con los servidores de OpenAI. Si no hay una conexión estable o si los servidores están inactivos, la generación de código no será posible.

- Limitaciones del modelo de lenguaje: Los modelos de lenguaje tienen limitaciones en cuanto a su comprensión contextual y capacidad de respuesta. Puede haber situaciones en las que el modelo no comprenda correctamente una instrucción o genere código que no cumpla con las expectativas.

- Costos asociados: El uso de la generación de código con ChatGPT implica el consumo de tokens, y OpenAI cobra por el uso de su API. Es importante tener en cuenta los costos asociados y comprender cómo se calculan para evitar sorpresas inesperadas en la facturación.

Consejos para maximizar la productividad

Esta herramienta es muy potente, prácticamente cualquier persona sería capaz de programar con su ayuda, pero nosotros ya sabemos programar. En esta sección vamos a mostrarte como puedes maximizar tu productividad y obtener mejores resultados.

- Sé claro y conciso: Al formular tus preguntas o solicitudes, sé claro y conciso en lo que estás buscando. Esto ayuda a obtener respuestas más precisas y reduce el tiempo necesario para obtener la información deseada. Es una IA, ni tiene sentimientos, ni le gusta que nos vayamos por las ramas.

- Divide tareas complejas: Si tienes una tarea compleja o un problema que resolver, divídelo en partes más pequeñas y aborda cada parte por separado. Puedes realizar varias consultas o solicitar información paso a paso, lo que facilita el seguimiento y la gestión de la información.

- Experimenta con diferentes comandos o consultas: Si no obtienes la respuesta que estás buscando o si la respuesta no es lo suficientemente precisa, intenta reformular tu pregunta o probar diferentes enfoques para obtener la información que necesitas.

- Aprovecha el contexto y la capacidad de seguimiento: Si estás trabajando en una sesión continua con el modelo, puedes utilizar la capacidad de contexto para recordar y referenciar información previa. Esto puede ser útil para dar seguimiento a las conversaciones y evitar tener que repetir la información.

Casos de uso y ejemplos prácticos

A continuación, os presentamos algunos casos de uso y ejemplos prácticos que pueden surgir de la integración:

- Generación de código repetitivo: Utiliza ChatGPT para generar código repetitivo, como la creación de estructuras de bucles, configuraciones básicas o funciones comunes. Esto te ahorrará tiempo y esfuerzo al evitar la escritura manual repetitiva. Esta es una de sus principales aplicaciones, y con el tiempo puede aprender incluso de como programamos nosotros y ajustarse a nuestro estilo propio.

- Prototipado rápido: Utiliza prototipos rápidos de funcionalidades o características en tu proyecto. Puedes proporcionar instrucciones sobre qué quieres lograr y obtener una base de código que puedas ajustar y refinar posteriormente. Puede ser una buena forma de romper el hielo, y no enfrentarte al lienzo en blanco, de esta forma partes de una base que tan solo tienes que editar y ajustar a tus necesidades.

- Exploración de soluciones alternativas: Experimenta con él para explorar diferentes enfoques y soluciones a un problema en particular. Puedes proporcionar instrucciones sobre diferentes enfoques y ver cómo se generan diferentes soluciones de código. Sería como una lluvia de ideas, y te podría ayudar a plantear otras opciones que quizá sean más óptimas.

- Aprendizaje y práctica de nuevos lenguajes: Si estás aprendiendo un nuevo lenguaje de programación, puedes utilizar ChatGPT para generar código en ese lenguaje. Esto te ayudará a familiarizarte con la sintaxis y las estructuras del lenguaje mientras trabajas en proyectos reales.

Mejora las habilidades de tus analistas de datos
En OpenWebinars lograrás que tu equipo se mantenga a la vanguardia en las últimas tecnologías para implementar y crear algoritmos de Machine Learning.
Solicitar más información

Otras extensiones basadas en IA

Con las nuevas herramientas de IA generativa revolucionando el desarrollo de software, ahora hay más de 400 extensiones con IA en el Visual Studio Code Marketplace. En este apartado te vamos a presentar algunas de ellas que pueden resultarte interesantes:

IntelliCode

IntelliCode mejora las capacidades de autocompletado de código de IntelliSense de varias formas. Mientras que IntelliSense utiliza simplemente el contexto del código del proyecto para sus recomendaciones, IntelliCode escanea miles de repositorios de código abierto en GitHub para encontrar los fragmentos de código más propensos a ser utilizados y los coloca en la parte superior de la lista de recomendaciones.

También puede realizar autocompletado de código de línea completa, a diferencia de IntelliSense.

Además, las capacidades de IntelliCode se están expandiendo continuamente, ganando recientemente la capacidad de proporcionar ejemplos de código de API instantáneos a través de la funcionalidad de vista previa introducida en una versión preliminar de Visual Studio 2022 17.6 en febrero.

Esta herramienta gratuita funciona con TypeScript/JavaScript, Python, Java y T-SQL.

GitHub Copilot

Esta IA revolucionó el espacio del desarrollo de software en 2021 cuando debutó con modelos avanzados de lenguaje de máquina creados por el socio de Microsoft, OpenAI, la compañía detrás de ChatGPT.

Además de la funcionalidad de autocompletado de código requerida, puede convertir comentarios en código, crear pruebas unitarias, crear consultas SQL y más. Funciona con cualquier lenguaje, incluyendo Java, PHP, Python, JavaScript, Ruby, Go, C# y C++.

Sin embargo, no es gratuito, aunque viene con una prueba gratuita. Se lanzó al público en general en junio de 2022 a $10 al mes para.

Blackbox

Esta herramienta gratuita se estrenó en septiembre del año pasado, proporcionando funcionalidad de autocompletado de código.

Funciona con más de 20 lenguajes de programación, incluyendo: Python, Java, C y C++, C#, JavaScript, SQL, PHP, Go, TypeScript, Kotlin, MATLAB, R, Swift, Rust, Ruby, Dart y Scala.

La extensión proporciona búsqueda de repositorios y búsqueda de código, y esta última se extiende a Jupyter Lab y Jupyter Notebooks, con autocompletado también disponible para esos populares proyectos basados en Python.

Conclusiones

En este artículo, descubrimos cómo la combinación de ChatGPT y Visual Studio puede mejorar tu flujo de desarrollo de software. ChatGPT es una poderosa IA generativa que ofrece respuestas coherentes y relevantes, mientras que VSCode es un editor de código versátil y popular.

Al integrar ChatGPT en VSCode, obtendrás beneficios como mayor productividad, asistencia en la resolución de problemas, acceso rápido a documentación relevante y sugerencias de código inteligentes. Además, puedes automatizar la generación de código, explorar soluciones alternativas y practicar nuevos lenguajes.

Es importante tener en cuenta algunas consideraciones, como validar la calidad del código generado y la dependencia de la conexión a Internet. Además, debes tener en cuenta los costos asociados al uso de la API de OpenAI. Para maximizar la productividad, sé claro en tus preguntas, divide tareas complejas, experimenta con diferentes comandos y aprovecha el contexto. También te recomendamos otras extensiones basadas en IA, como IntelliCode y GitHub Copilot.

Para aquellos que buscáis mejorar vuestras habilidades y aprender más sobre Inteligencia Artificual y Machine Learning, os recomendamos la suscripción al Plan Profesional de OpenWebinars, con el que empezarás tus primeros 15 días gratis y acceder a una amplia variedad de formaciones relacionadas con esta y muchas otras interesantes temáticas.

Si vuestras necesidades son mejorar las habilidades y conocimientos de vuestros equipo, entonces nuestra recomendación es que solicitéis ya una demostración gratuita de OpenWebinars, en la que podréis comprobar todo lo que te ofrecemos en cuanto a la formación de equipos.

En resumen, la integración de ChatGPT y VSCode es una poderosa herramienta que impulsa tu productividad y creatividad en el desarrollo de software. ¡Descubre cómo esta combinación puede llevar tu flujo de trabajo a nuevos niveles!

Bombilla

Lo que deberías recordar de ChatGPT en VSCode

  • ChatGPT y VSCode son herramientas poderosas para mejorar el flujo de desarrollo de software.
  • ChatGPT es un modelo generativo de IA que proporciona respuestas coherentes y relevantes.
  • VSCode es un editor de código versátil y popular con una interfaz personalizable y herramientas de depuración integradas.
  • La integración de ChatGPT en VSCode ofrece beneficios como mayor productividad, asistencia en la resolución de problemas, acceso rápido a documentación y sugerencias de código inteligentes.
  • Es importante considerar la calidad del código generado, la dependencia de la conexión a Internet y los costos asociados al uso de la API de OpenAI.
  • Se dan consejos para maximizar la productividad, como ser claro en las preguntas, dividir tareas complejas, experimentar con diferentes comandos y aprovechar el contexto.## Introducción
Compartir este post

También te puede interesar

Icono de la tecnología
Taller

Aumenta tu productividad con VSCode

Intermedio
41 min.

En este taller aprenderemos como aumentar la productividad del desarrollador mediante atajos de teclado y funciones del IDE...

Juan Manuel Pérez Toro
4.5