Creación de una Extensión de VS Code con Integración de DeepSeek R1
En este artículo, exploraremos cómo construir una extensión de VS Code desde cero, integrando DeepSeek R1, un modelo de razonamiento de código abierto y de bajo costo, en nuestro editor para crear un asistente de IA personalizado.
Introducción a DeepSeek R1
DeepSeek R1 es un potente modelo de IA que ha ganado popularidad debido a su impresionante rendimiento y su naturaleza de código abierto. Sin embargo, el uso de la interfaz de usuario web viene con una advertencia: tus peticiones, pulsaciones de teclas y datos se envían a China. Para evitar esto, podemos ejecutar el modelo localmente, eliminando la necesidad de una conexión a Internet.
Running DeepSeek R1 locally allows for absolute freedom
Generación de un Proyecto y Construcción de la Extensión
Para empezar a construir nuestra extensión, necesitamos generar un proyecto utilizando la plantilla de inicio oficial de VS Code. Ejecutar el comando npx
nos guiará a través de una serie de preguntas, donde podemos ceñirnos a las opciones predeterminadas.
Una vez que se genera el proyecto, podemos encontrar el archivo extension.ts
, que importa el objeto global VS Code. Este objeto proporciona acceso a toda la API de VS Code, lo que nos permite personalizar el editor.
Personalización de la Extensión
Podemos empezar a personalizar nuestra extensión registrando un comando. En este ejemplo, crearemos un comando llamado "hom" que muestra un mensaje de error cuando se ejecuta.
Registering a command is straightforward
Prueba y Depuración de la Extensión
Para probar y depurar nuestra extensión, podemos utilizar el depurador. Cuando ejecutamos el depurador, se abrirá una nueva ventana de VS Code con nuestra extensión instalada. A continuación, podemos abrir la paleta de comandos y ejecutar nuestro comando para ver el mensaje de error.
Testing the extension is an essential step
Integración de DeepSeek R1 en la Extensión
Para integrar DeepSeek R1 en nuestra extensión, utilizaremos una herramienta llamada Ollama. Ollama nos permite descargar y ejecutar modelos de IA de código abierto, incluido DeepSeek R1.
Ollama makes it easy to run DeepSeek R1 locally
Creación de un Panel para el Diálogo de Chat
Crearemos un panel para contener el diálogo de chat, lo que nos permitirá interactuar con DeepSeek R1 directamente en el editor.
Creating a panel for the chat dialogue
Definición del HTML para el Diálogo de Chat
Definiremos el HTML para el diálogo de chat, que incluirá un área de texto y un botón. El código JavaScript dentro del HTML gestionará la interacción con DeepSeek R1.
Defining the HTML for the chat dialogue
Escucha de Mensajes y Transmisión de la Respuesta
Escucharemos los mensajes del usuario y transmitiremos la respuesta de DeepSeek R1. Esto nos permitirá mostrar la respuesta en tiempo real, frase por frase.
Listening for messages and streaming the response
Conclusión
En este artículo, hemos aprendido a construir una extensión de VS Code desde cero, integrando DeepSeek R1 en nuestro editor para crear un asistente de IA personalizado. Hemos cubierto el proceso de generación de un proyecto, la personalización de la extensión, las pruebas y la depuración, la integración de DeepSeek R1, la creación de un panel para el diálogo de chat, la definición del HTML y la escucha de mensajes y la transmisión de la respuesta.
Con este conocimiento, ahora puedes construir tu propio IDE personalizado impulsado por IA desde cero. Si quieres profundizar y ser realmente bueno en la programación mientras apoyas mi trabajo, considera la posibilidad de actualizar a una membresía pro en Fireship.io. Tendrás acceso a todo tipo de cursos basados en proyectos diferentes, y lo más importante, construirás una base para entender qué demonios están haciendo realmente los dioses chinos de la IA cuando escriben tu código por ti. Gracias por leer, ¡y nos vemos en el próximo!