0GiS0 / gh-copilot-nodejs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

GitHub Copilot para los amantes de Nodejs 💚

Para poder ejecutar estas demos necesitas:

  • Docker 🐋 instalado en tu máquina.
  • La extensión Dev Containers 🛳️ en Visual Studio Code.
  • Clona este repo 👩‍💻
  • O también puedes ejecutarlo en GitHub Codespaces 🐈‍⬛ Echa un vistazo a este vídeo

Demos con Copilot Chat

  1. ¿Cómo puedo crear una API en Node.js? 🤔 (hazle caso 🫡)
  2. Si no tienes ni idea de Node.js también puedes hacerle preguntas como esta: ¿Qué frameworks hay en Node.js para crear APIs? 🤔
  3. /new crear una API con un CRUD de heroes en Node.js con Express.js Este comando hay que escribirlo a mano (no vale con copiarlo directamente desde aquí porque entonces no va a interpretar bien el comando /new) ¡Dile que si! 💍 4.@vscode para que te ayude con Visual Studio code. Con este comando puedes preguntarle a Copilot sobre Visual Studio Code. Por ejemplo: @vscode ¿Cómo puedo abrir un archivo en Visual Studio Code? 🤔 5.@workspace para preguntar sobre todo el workspace. Hasta ahora solo era posible hablar con Copilot sobre el archivo en el que estás trabajando. Ahora puedes preguntarle sobre todo el workspace.

Demos guiadas a través del propio archivo

  1. Abre el archivo llamado ghcopilot-web/server.js
  2. Dentro de este pulsa enter justo después del comentario donde se explica que se va a crear un servidor web.
  3. Copilot te sugerirá el código en gris y si pulsas la tecla tabulador lo escribirá por ti.

  1. Con Control + Intro puedes ver todas las sugerencias.

Demos con GitHub Copilot Labs

Importante: Esta extensión está deprecada y ya no se va a actualizar. Es previa a GitHub Copilot Chat.

Puedes conseguir acceso a esta extensión a través de este enlace.

GitHub Copilot labs es una extensión que puedes instalar también en tu Visual Studio Code para probar nuevas ideas que se están desarrollando alrededor de GitHub Copilot.

En el directorio llamado labs tienes varios ejemplos que te van a permitir jugar con cada una de las secciones de esta extensión.

Explicar código

Un ejemplo que puedes utilizar es labs/explain-code-demo.js. Solamente tienes que seleccionar la parte del código que quieres que te explique y hacer clic en el botón Explain Code de la extensión.

Language translation

Este mismo ejemplo puedes utilizarlo para que lo traduzca a otro lenguaje. Por ejemplo, puedes seleccionar de nuevo el código y elegir Python.

Brushes

Se trata de la botonera que tiene diferentes opciones preconstruídas:

  1. READABLE: Te permite convertir el código en un formato más legible.

Abre el archivo labs/brushes-readable.js y haz clic en el botón READABLE. Verás como te cambia el código.

  1. ADD TYPES: Te permite añadir tipos a tu código.

Abre el archivo labs/brushes-add-types.ts y haz clic en el botón ADD TYPES. Verás como te añade los tipos.

  1. FIX BUGS: Te permite arreglar los bugs que encuentre en tu código.

Abre el archivo llamado labs/brushes-fix-bug.js y selecciona desde la línea 30 a la 40. Ahora pulsa el botón FIX BUGS y verás como te arregla el código.

  1. DEBUG: Te permite añadir console.log para debugar tu código.

Abre el archivo labs/brushes-debug.js y haz clic en el botón DEBUG. Verás como te añade los console.log.

  1. CLEANUP: Te permite limpiar tu código.

Abre el archivo labs/brushes-cleanup.js y haz clic en el botón CLEANUP. Verás como te limpia el código.

  1. LIST STEPS: Te permite listar los pasos que ha seguido para llegar a ese código.

Abre el archivo labs/explain-code-demo.js, selecciona todo el código y pulsa el botón. Comprobarás que te añade comentarios explicando el código.

  1. MAKE ROBUST: Te permite hacer tu código más robusto.

  2. CHUNK: Te permite dividir tu código en trozos más pequeños.

  3. DOCUMENT: Te permite documentar tu código.

  4. CUSTOMIZE: Te permite elegir el prompt.

Puedes decirle cosas como: Pon este código en una función, o pon este código en un bucle.

Test generation

Esta opción te permite generar tests para tu código.

Reescribir a través de la bombilla 💡

Cuando estés escribiendo código, si ves que la bombilla 💡 se enciende, puedes hacer clic en ella y te ofrecerá ayuda.

Sugerencias de commits

Ahora puedes pedirle a GitHub Copilot que te sugiera un comentario para el commit que vas a hacer, en base a los cambios que has hecho en el código.

Más información sobre GitHub Copilot

About


Languages

Language:JavaScript 68.6%Language:Dockerfile 29.2%Language:TypeScript 2.2%