2270 palabras
11 minutos
Extensiones de código VS

Descripción general#

Explore una colección seleccionada de extensiones esenciales de VS Code diseñadas para aumentar la productividad y mejorar las habilidades en varios dominios de desarrollo. Estas extensiones están agrupadas por categorías para facilitar la navegación.


Código limpio y refactorización#

TIP

Mantenga un código limpio y fácil de mantener con estas extensiones, que ofrecen herramientas para refactorización, métricas y comentarios mejorados. :::- Métricas de código: muestra la complejidad del código directamente en la barra de estado, lo que ayuda en el análisis de mantenibilidad.

  • Abracadabra, Refactor This: Automatiza tareas de refactorización como cambiar el nombre de símbolos o extraer variables en JavaScript/TypeScript.
  • Hocus Pocus: Simplifica la creación de funciones, variables, clases o cambios de casos a partir del uso.
  • SonarLint: destaca errores y problemas de seguridad en su código con sugerencias prácticas.
  • ESLint: integra ESLint para identificar y solucionar problemas en el código JavaScript/TypeScript.
  • Mejores comentarios: mejora la legibilidad de los comentarios con etiquetas codificadas por colores.
  • Documentar esto: Genera automáticamente comentarios JSDoc para funciones y clases.
  • Corrector ortográfico de código: Detecta errores ortográficos en tu código, ofreciendo correcciones.
  • Visual Studio IntelliCode: IntelliSense con tecnología de inteligencia artificial que proporciona sugerencias contextuales.
  • TODO destacado: realiza un seguimiento de TODOS y anotaciones para garantizar que no se pase nada por alto.

Fragmentos de código#

IMPORTANT

Los fragmentos predefinidos ahorran tiempo y reducen las tareas repetitivas en su flujo de trabajo. :::- Fragmentos de código JavaScript (ES6): fragmentos para el desarrollo moderno de JavaScript/TypeScript.

  • ES7 React/Redux/GraphQL/React-Native Snippets: mejora la productividad en los ecosistemas React y Redux.
  • Vue 2/3 Snippets: proporciona fragmentos útiles para Vue.js.
  • Angular 10 Snippets: fragmentos de Angular esenciales para componentes, servicios y más.
  • Fragmentos de código de Reactjs: adaptados para el desarrollo de React en la sintaxis de ES6/ES7.
  • Bootstrap & Font Awesome Snippets: fragmentos para un estilo rápido con Bootstrap y Font Awesome.
  • Fragmentos de prueba unitaria de Angular Jasmine: Acelera las pruebas unitarias en Angular con Jasmine.
  • Node Snippets: Fragmentos para un desarrollo eficiente de Node.js.

Base de datos#

NOTE

Administre y consulte bases de datos directamente desde VS Code con estas poderosas extensiones. :::- SQL Server (mssql): trabaje sin problemas con bases de datos de SQL Server y Azure.

  • MySQL: Administre bases de datos MySQL con facilidad.
  • PostgreSQL: soporte sólido para bases de datos PostgreSQL.
  • MongoDB: Simplifica la gestión de colecciones y documentos de MongoDB.
  • SQLTools: se conecta a múltiples bases de datos SQL y ofrece funciones de administración avanzadas.

Temas y estilo#

TIP

Mejore su entorno de codificación con temas y herramientas para la personalización visual. :::- Tema Winter Is Coming: un tema inspirado en Juego de Tronos.

  • One Dark Pro: Basado en el popular tema One Dark de Atom.
  • Noctis: Ofrece temas claros y oscuros equilibrados.
  • Material Theme: lleva el diseño de materiales de Google a VS Code.
  • Tema de Drácula: un elegante tema oscuro con colores vibrantes.
  • Iconos de código VS: iconos personalizables para un mejor reconocimiento de archivos.
  • Más bonito: automatiza el formato del código para lograr un estilo coherente.
  • Embellecer: Formatos HTML, CSS, JavaScript y JSON.
  • Peacock: Diferencia los espacios de trabajo con colores únicos.

Control de fuente#

IMPORTANT

Mejore su flujo de trabajo y colaboración de Git directamente desde el editor. :::- GitLens: herramientas avanzadas de Git, que incluyen gestión de culpa, historial y alijo.

  • Historial de Git: visualiza y explora el historial de archivos o ramas.
  • CodeStream: colabora con los miembros del equipo en revisiones y problemas de código.

Depuración#

WARNING

Simplifique la depuración para evitar errores costosos con estas herramientas. :::- Depurador para Chrome: depura JavaScript ejecutándose en Chrome.

  • Depurador para Firefox: depura aplicaciones web en Firefox.
  • Depurador para Node: depura eficazmente aplicaciones Node.js.

Utilidades#

TIP

Estas utilidades agilizan las tareas repetitivas y simplifican la codificación. :::- Polacode: genera hermosas instantáneas de tu código.

  • Servidor en vivo: inicia un servidor local con recarga en vivo.
  • Costo de importación: muestra el tamaño de importación en línea para JavaScript/TypeScript.
  • Contador de códigos VS: cuenta líneas, palabras y caracteres en archivos o espacios de trabajo.
  • Sincronización de configuración: sincroniza la configuración de VS Code en todos los dispositivos.
  • Configuración del editor: aplica estilos de codificación consistentes en todos los editores.

Mapas de teclas#

NOTE

Realice una transición sencilla a VS Code con combinaciones de teclas familiares de sus editores preferidos. :::- Visual Studio: imita las combinaciones de teclas de Visual Studio.

  • Atom: Para entusiastas del editor Atom.
  • Sublime Text: adapta los atajos de Sublime Text.
  • JetBrains IDE: para usuarios de JetBrains que realizan la transición a VS Code.

Herramientas de desarrollo de IA#

IMPORTANT

Aproveche la IA para mejorar la eficiencia y la inteligencia de la codificación. :::- GitHub Copilot: herramienta de finalización de código impulsada por IA desarrollada por GitHub y OpenAI, que ayuda a los usuarios a completar automáticamente fragmentos de código y funciones. oaicite:0

  • Tabnine: asistente de codificación de IA que ofrece finalización de código y un chat impulsado por IA, compatible con más de 80 lenguajes y marcos de programación. oaicite:1
  • Cursor: entorno de desarrollo integrado impulsado por IA que proporciona funciones como generación de código, autocompletado inteligente y comprensión de la base de código. oaicite:2

Desarrollo front-end#

TIP

Mejore su flujo de trabajo de desarrollo front-end con estas extensiones. :::- Live Sass Compiler: compila archivos Sass o SCSS en CSS en tiempo real.

  • Compatibilidad con HTML CSS: proporciona finalización de nombre de clase CSS para HTML.
  • Path Intellisense: Autocompleta los nombres de archivos en tu código.
  • CSS Peek: permite echar un vistazo a CSS ID y cadenas de clase como definiciones.
  • Vista previa de imagen: muestra vistas previas de imágenes en el margen lateral y al pasar el mouse.

Desarrollo de back-end#

NOTE

Optimice el desarrollo back-end con estas herramientas esenciales. :::- Docker: agrega resaltado de sintaxis, comandos, sugerencias de desplazamiento y linting para archivos Dockerfile y docker-compose.

  • Cliente REST: permite enviar solicitudes HTTP y ver respuestas directamente en VS Code.
  • Swagger Viewer: proporciona una vista previa de los archivos Swagger y OpenAPI.
  • npm: gestiona scripts npm con facilidad.
  • YAML: agrega compatibilidad con el lenguaje YAML con compatibilidad integrada con la sintaxis de Kubernetes.

Ingeniería de redes#

IMPORTANT

Equípese con herramientas diseñadas para tareas de ingeniería de redes. :::- Cliente REST Le permite enviar solicitudes HTTP y ver respuestas directamente desde el editor. Ideal para probar API sin salir de VS Code.

  • Resaltado de sintaxis de Wireshark Proporciona resaltado de sintaxis para archivos de captura de Wireshark, lo que facilita el análisis del tráfico de red.
  • Soporte de lenguaje Nmap Agrega resaltado de sintaxis para scripts de Nmap, lo que le ayuda a analizar las vulnerabilidades y configuraciones de la red.
  • Convertidor de rizos Convierte los comandos cURL en solicitudes HTTP, lo que facilita la prueba de API directamente dentro de VS Code.
  • Cliente Telnet Proporciona un cliente Telnet basado en terminal para la resolución de problemas de la red y la comunicación con el servidor remoto.
  • SSHFS Monta servidores remotos a través de SSH y proporciona acceso a sus sistemas de archivos directamente desde VS Code para una administración más sencilla.

Usuarios de Vim#

TIP

Haga que su experiencia VS Code se parezca más a Vim con estas extensiones. :::- Vim Aporta combinaciones de teclas y funcionalidades de Vim a VS Code, lo que le permite utilizar su entorno Vim familiar dentro del editor.

  • VsCodio Ofrece una extensión inspirada en Vim que brinda un entorno minimalista, altamente personalizable y extensible.
  • EasyMotion para VSCode Permite una navegación rápida de archivos resaltando las posiciones de destino, imitando el complemento EasyMotion para Vim.
  • Vimium para Código VS Le permite navegar por VS Code con atajos de teclado, muy parecido a Vimium para navegadores.
  • Vim NERDTree Incorpora el potente explorador de archivos NERDTree a VS Code, lo que permite la navegación y gestión de archivos mediante combinaciones de teclas de Vim.

Programación de bajo nivel y desarrollo integrado#

NOTE

Extensiones para trabajar con ensamblaje, C y sistemas integrados. :::- Paquete de extensión C/C++ Un conjunto completo de herramientas para el desarrollo de C y C++, que incluye IntelliSense, depuración y navegación de código.

  • Plataforma IO IDE Un entorno de desarrollo completo para sistemas integrados, compatible con una amplia gama de microcontroladores y placas de desarrollo.
  • Resaltado de sintaxis del ensamblado ARM Agrega resaltado de sintaxis para el código ensamblador ARM, lo que ayuda a visualizar y comprender el código de bajo nivel más fácilmente.
  • Ensamblaje x86 y x86_64 Proporciona soporte de sintaxis para lenguaje ensamblador x86, ideal para programadores de bajo nivel e ingeniería inversa.
  • Editor hexadecimal Le permite ver y editar datos binarios sin procesar, lo que lo hace invaluable para trabajar con firmware y estructuras de archivos de bajo nivel.
  • Soporte AVR Brinda soporte para la programación de microcontroladores AVR, incluido resaltado de sintaxis, fragmentos de código y más.
  • Analizador de óxido Una extensión de programación de Rust que brinda soporte para completar código, documentación en línea y herramientas de refactorización.
  • MicroPython Agrega soporte para el desarrollo de MicroPython, incluida la administración de archivos y la carga de código a dispositivos directamente desde VS Code.

Ciberseguridad e ingeniería inversa#

WARNING

Analice las vulnerabilidades del código, realice análisis estáticos y explore herramientas de ingeniería inversa. :::- Binwalk Una herramienta para analizar imágenes de firmware, que le permite extraer y aplicar ingeniería inversa a códigos y archivos integrados.

  • Extensión Ghidra Integra el marco de ingeniería inversa de Ghidra en VS Code, lo que le permite analizar binarios y código desensamblado.
  • Reglas YARA Proporciona resaltado de sintaxis y escaneo de archivos basado en reglas para análisis y detección de malware con YARA.
  • Vista previa de expresiones regulares Visualiza expresiones regulares y sus coincidencias en tiempo real, lo que resulta útil para ingeniería inversa y análisis de código.
  • Verificación de dependencia de OWASP Analiza su proyecto en busca de vulnerabilidades conocidas en dependencias basadas en la base de datos de vulnerabilidades OWASP.
  • Explorar la búsqueda en la base de datos Le permite buscar rápidamente exploits conocidos en la base de datos de exploits directamente desde VS Code.
  • Integración de Burp Suite Integra Burp Suite para un escaneo mejorado de vulnerabilidades web, proporcionando un flujo de trabajo de prueba más fluido.
  • Ayudante de Metasploit Una integración útil para interactuar con Metasploit, haciendo que las pruebas de penetración sean más eficientes.

Desarrollo de IA y aprendizaje automático#

IMPORTANT

Mejore los flujos de trabajo de IA y ML directamente dentro de VS Code. :::- Jupyter Agrega compatibilidad con Jupyter Notebooks, lo que permite codificación interactiva, análisis de datos y experimentos de aprendizaje automático dentro de VS Code.

  • Python Esencial para el desarrollo de Python, incluidas funciones como IntelliSense, linting y depuración, que son cruciales para los flujos de trabajo de IA y ML.
  • Ayudante de pandas Proporciona acceso rápido a comandos y operaciones comunes de Pandas, lo que hace que la manipulación y el análisis de datos sean más eficientes.
  • Fragmentos de PyTorch Ofrece fragmentos para el desarrollo de PyTorch, lo que le ayuda a crear rápidamente modelos de aprendizaje profundo y entrenar redes neuronales.
  • Fragmentos de TensorFlow Proporciona fragmentos específicos de TensorFlow para optimizar el aprendizaje automático y la creación de modelos de aprendizaje profundo.
  • MLFlujo Una herramienta integral para administrar modelos de aprendizaje automático, que proporciona capacidades de control de versiones, empaquetado e implementación dentro de VS Code.
  • Visor de modelos ONNX Ayuda a ver e inspeccionar modelos ONNX (Open Neural Network Exchange), lo que facilita la implementación de modelos de IA en todos los marcos.

Nube y DevOps#

TIP

Optimice el desarrollo en la nube y los flujos de trabajo de DevOps. :::- Terraforma Facilita el desarrollo y gestión de infraestructura como código utilizando Terraform, facilitando la gestión de recursos en la nube.

  • Kit de herramientas de AWS Integra los servicios de AWS con VS Code, lo que le permite administrar e implementar recursos y aplicaciones en la nube directamente desde el editor.
  • Herramientas de Azure Proporciona integración con los servicios de Microsoft Azure, lo que le permite implementar y administrar recursos dentro del entorno de la nube.
  • Kubernetes Proporciona compatibilidad con Kubernetes, lo que le permite administrar clústeres, pods y contenedores dentro de VS Code.
  • Acoplador Facilita la creación, gestión e implementación de contenedores, lo que facilita un flujo de trabajo de desarrollo en contenedores optimizado.
  • Acciones de GitHub Proporciona una interfaz para administrar y monitorear las acciones de GitHub, lo que hace que la integración y la implementación continuas sean más fáciles de manejar.
  • Soporte de archivos Jenkins Ofrece resaltado de sintaxis y fragmentos para trabajar con scripts de canalización de Jenkins directamente desde VS Code.
  • Ansible Integra Ansible para automatizar la gestión de la infraestructura, lo que facilita la gestión de la configuración y las implementaciones.

Rendimiento y creación de perfiles#

WARNING

Analice y optimice el rendimiento del código con estas herramientas. :::- Perfilador de Flamegraph Visualiza el consumo de CPU y memoria, lo que le ayuda a identificar cuellos de botella en el rendimiento de sus aplicaciones.

  • Visor de instantáneas del montón Ayuda a analizar el uso de la memoria y encontrar pérdidas de memoria mediante la visualización de instantáneas del montón.
  • Perfiles de Python Proporciona herramientas de creación de perfiles de rendimiento para Python, que le ayudan a identificar código lento y optimizar algoritmos.
  • Integración de Chrome DevTools Le permite utilizar Chrome DevTools directamente desde VS Code, lo que proporciona potentes herramientas de creación de perfiles y depuración para el desarrollo web.
  • Perfiles de Node.js Proporciona herramientas de creación de perfiles para aplicaciones Node.js, lo que le ayuda a optimizar el rendimiento del lado del servidor.
  • Ir al perfilador Ayuda a identificar problemas de rendimiento en aplicaciones Go al visualizar el uso de la CPU, la asignación de memoria y las gorutinas.

Impulsores de productividad varios#

IMPORTANT

Herramientas adicionales para hacer que su flujo de trabajo de desarrollo sea más fluido. :::- Gerente de Proyecto Le ayuda a organizar y cambiar entre múltiples proyectos de forma rápida y eficiente.

  • Rastreador de tiempo Realiza un seguimiento de cuánto tiempo dedicas a diferentes tareas y proyectos, lo que te ayuda a administrar tu flujo de trabajo y aumentar la productividad.
  • Hora del código Realiza un seguimiento de tu actividad de codificación y productividad, proporcionando información sobre la eficiencia con la que estás trabajando.
  • Marcadores Agrega una función de marcador a su editor, lo que le permite marcar líneas de código importantes para facilitar la navegación.
  • Pergamino adhesivo Mantiene visibles los encabezados y las secciones importantes de su código a medida que se desplaza, lo que facilita la navegación en archivos grandes.
  • Rebaja todo en uno Mejora la edición de rebajas al proporcionar funciones como vista previa, tabla de contenido y formato automático.

Extensiones de código VS
https://banije.vercel.app/es/posts/vscode_extensions/
Autor
ibra-kdbra
Publicado el
2024-01-17
Licencia
CC BY-NC-SA 4.0