Configuraciones en VSCode para el desarrollo de aplicaciones

- Andrés Cruz

Como desarrollador, tener las herramientas adecuadas puede marcar la diferencia en su experiencia de codificación. Visual Studio Code, comúnmente conocido como VSCode, es uno de los editores de código más utilizados por los desarrolladores de todo el mundo. Su versatilidad y la amplia gama de extensiones disponibles en el mercado son sólo algunas de las razones por las que es tan popular. Ya sea que sea un desarrollador experimentado o recién esté comenzando, es esencial configurar correctamente VSCode. Pero antes de sumergirte en la exploración de sus funciones avanzadas, es esencial entender bien los conceptos básicos: los temas de color, las fuentes y otras configuraciones cruciales. En este blog, compartiré mi configuración de VSCode, incluidos algunos de los temas de color, fuentes y extensiones que han mejorado significativamente mi experiencia de codificación.

Temas de color: tu toque personal

El primer paso para configurar su entorno VSCode es elegir un tema de color que se adapte a su estilo. Un buen tema de color puede tener un gran impacto en la forma en que percibe su código, haciéndolo más fácil de leer y más agradable estéticamente. VSCode ofrece una amplia gama de temas de color, para que pueda encontrar fácilmente uno que se ajuste a sus preferencias.

Transforme su entorno de codificación en un espacio de trabajo visualmente impresionante y fácil de leer con mis tres temas favoritos de VSCode Color. Uno de mis favoritos personales es el tema "Celestial". Este tema oscuro proporciona una apariencia elegante y elegante, lo que lo hace agradable a la vista incluso después de horas de codificación. Los colores brillantes y vibrantes utilizados en el tema facilitan la distinción entre los diferentes elementos de su código.

Si a alguien no le gusta ese tema negro, aquí hay otro gran tema de color oscuro que es "One Dark Pro", que tiene una combinación de colores vibrantes y llamativos, lo que hace que sea más fácil concentrarse en su código durante períodos prolongados. Con sus colores llamativos y contrastantes y su diseño moderno, One Dark Pro se está convirtiendo rápidamente en el favorito entre los programadores de todo el mundo.

Por último, pero no menos importante, el tercer tema de color es "Drácula", que le dará un tema gris que se adaptará a la codificación. A la mayoría de los programadores les encanta trabajar con este tema.

El tema "Luz solarizada" proporciona una apariencia limpia y nítida si prefiere un tema más claro. Y para aquellos que desean una apariencia de diseño de materiales moderna, el “Tema Material” es la elección perfecta. Aquí hay otra mención especial que a la mayoría de los programadores les encanta el "Tema GitHub".

Hay otra extensión llamada CelestialDracula que tiene un tema de color celestial pero tiene fuentes algo brillantes. Intenta divertirte un poco.

Fuentes:
Otro aspecto crítico de la configuración de VSCode es la fuente. La fuente que elijas puede tener un impacto significativo en la legibilidad de tu código, especialmente si pasas mucho tiempo frente a la pantalla. Desea elegir una fuente que sea agradable a la vista y que haga que su código se vea claro y nítido.

Una de mis fuentes favoritas es "JetBrains Mono", un tipo de letra monoespaciado diseñado para desarrolladores y programación por JetBrains. JetBrains Mono fue diseñado para facilitar a los desarrolladores la lectura y escritura de código, haciéndolo más legible y eficiente para las tareas de programación. La fuente tiene un diseño limpio y minimalista, distinguiendo claramente entre caracteres y letras y números bien espaciados. Lo diseñaron para que fuera altamente legible, incluso en tamaños de fuente pequeños y lo optimizaron para código de programación.

La siguiente fuente es “Fira Code”. Es una fuente monoespaciada que incluye ligaduras de programación, lo que facilita la distinción entre caracteres como “=" y "==". Esta fuente tiene un aspecto limpio y moderno y hace que su código luzca bien organizado.

“Courier New” es otra opción de fuente popular que existe desde hace tiempo y que ofrece un aspecto clásico de la vieja escuela. Y si buscas una fuente con un poco de personalidad.

Extensiones

  • El mercado de extensiones de VSCode es uno de sus puntos de venta más importantes. Las extensiones le permiten agregar funciones adicionales a su editor de código, haciéndolo más eficiente y versátil. Con miles de extensiones disponibles, puede resultar abrumador saber por dónde empezar. Pero no te preocupes, ¡te tengo cubierto!
  • Code Runner: la extensión Code Runner en Visual Studio Code es un salvavidas para los desarrolladores que necesitan probar y ejecutar rápidamente fragmentos de código sin salir del editor de código. Es una forma extremadamente rápida y eficiente de ejecutar su código y ver los resultados, sin tener que cambiar al terminal ni a ninguna otra herramienta externa. Esta extensión admite una amplia gama de lenguajes de programación, incluidos C, C++, Java, JavaScript, PHP, Python y más. Con su ejecución ultrarrápida, puede probar sus fragmentos de código, depurar problemas y verificar el resultado con facilidad.
    Error Lens: Error Lens es una poderosa extensión de VSCode que facilita la detección y corrección de errores en su código. Resalta las líneas problemáticas con subrayados y muestra descripciones de errores en el margen del editor. La extensión admite múltiples lenguajes de programación, por lo que puede usarla sin importar lo que esté codificando. Con Error Lens, puede identificar y solucionar problemas fácilmente, simplificando su flujo de trabajo y aumentando la productividad.

Otra extensión como esta da un error que indica un error diferente en el número de línea de las extensiones es "Error Gutter"

  • Extensión Chat GPT: Chat GPT es una extensión VSCode que proporciona una integración perfecta del potente modelo de lenguaje GPT-3 de OpenAI en su entorno de codificación. Con Chat GPT, puede acceder fácilmente a capacidades lingüísticas avanzadas impulsadas por IA, como finalización de código, sugerencias y más. Esta extensión puede ayudarlo a codificar de manera más rápida, inteligente y eficiente al brindar sugerencias y automatizar tareas repetitivas.
  • Sourcery: Sourcery ayuda a los desarrolladores a escribir código de alta calidad y sin errores al proporcionar generación de código en tiempo real y sugerencias de código inteligente. Agiliza tu flujo de trabajo y te ahorra tiempo al automatizar tareas de codificación repetitivas, liberándote para concentrarte en cosas más importantes.
  • SonarLint: SonarLint destaca errores y vulnerabilidades de seguridad a medida que escribe código, con una guía de solución clara para que pueda solucionarlos incluso antes de que yo envíe el código.
  • SonarLint en VSCode admite el análisis de C, C++, HTML, Java, JavaScript, PHP, Python y TypeScript.
  • Material Icon Theme: Material Icon Theme agrega íconos a la exploración de archivos y tipos de archivos, lo que facilita la identificación y navegación por el código. Con más de 5 millones de descargas, esta extensión tiene un diseño hermoso y consistente que sigue las pautas de diseño de materiales de Google. Proporciona una apariencia moderna y visualmente atractiva a su código, lo que hace que sea más fácil trabajar con él y más agradable de ver.
  • Prettier: la extensión Prettier formatea su código, haciéndolo más fácil de leer y mantener. Es especialmente útil cuando se trabaja con un equipo, ya que garantiza que el código de todos tenga el formato coherente, independientemente de sus preferencias personales.
  • GitLens: la extensión GitLens es un salvavidas para quienes trabajan con Git. Le permite ver las anotaciones de culpa de Git y otra información de Git directamente en su código, lo que facilita el seguimiento de los cambios y la colaboración con otros.
  • Bracket Pair Colorizer: La extensión Bracket Pair Colorizer es una gran herramienta para mejorar la legibilidad de su código. Colorea los corchetes, lo que facilita la combinación de corchetes de apertura y cierre y mantiene el código organizado.
  • GitHub Copilot: esta es una extensión muy útil para aumentar su productividad. No es necesario explicar más esta extensión.
  • La configuración adecuada para su entorno VSCode puede tener un gran impacto en su experiencia de codificación. Los temas de color, fuentes y extensiones que elijas pueden ayudarte a codificar de manera más eficiente y efectiva, y hacer que el tiempo que pasas frente a la pantalla sea mucho más agradable. Así que tómate el tiempo para explorar tus opciones y elegir las herramientas que mejor funcionen para ti. Dígale adiós a la programación aburrida y mundana y dé la bienvenida a una experiencia más agradable y productiva.

Artículo original:

https://levelup.gitconnected.com/my-vscode-setup-helps-me-be-more-productive-401337512167

Andrés Cruz

Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz en Udemy

Acepto recibir anuncios de interes sobre este Blog.