Extensiones o plugins imprescindibles para visual studio code

Extensiones o plugins imprescindibles para visual studio code

En este articulo, se menciona como usar e instalar extensiones o plugins imprescindibles en visual studio code, ya que hasta la actualidad existen ciertas extensiones o plugins que facilita la escritura de código.

En los editores de texto como: Sublime Text o Atom, existen una infinidad de plugins para distintos lenguajes de programación, pero  visual studio code  no se queda atrás, se han implementado nuevos paquetes para su uso en el desarrollo de nuestros proyectos.

Como ya se ha dicho existen ciertos plugins que se usan a menudo en Sublime text, por la cual en los siguientes párrafos se listaran extensiones que tienen la misma funcionalidad que  en Sublime text, Atom y demás.

 AutoFileName y FileNameComplete

Se puede instalar uno de los extensiones, el cual permite vincular  archivos mediante la sugerencia al escribir la el atributo href de HTML o utilizando métodos como require_once de PHP y demás.

plugin-para-vincular-archivos-para-visual-studio-code

PHP Itellisense

Es una extensión analizador de el código fuente, que cumple las funciones de autocompletado, informador de errores, renombrado, formateo de código y demás.

PHP Itellisense Crane

Crane es un extensión que facilita la sugerencia de código en el lenguaje PHP y se puede trabajar en proyectos de cualquier tamaño.

plugin-para-sugerencia-de-codigo-para-php-vsc

TWIG pack

Extensión que permite generar varios lineas de etiquetas  HTML y otros mediante expresiones, su funcionalidad es igual que la de Emmet, donde nos permite agilizar la escritura de código HTML con un par de expresiones.

extesion-emmet-para-visual-studio-code

PHP Debug

PHP Debug es una extensión adaptador de VSC para la depuración de código PHP, las características mas destacadas son: depuración paso a paso, puntos de interrupción condicionales y de función, seguimientos de pila, variables alcance, Superglobales, constantes definidas por el usuario, consola de depuración y demás. Para que funcione PHP Debug, se debe tener instalado y configurado XDebug  que es una extensión para PHP.

extesion-php-xdebug-para-visual-studio-code

PHP Formatter

Es una extensión que facilita el formateo del estilo de escritura de código de las llaves, por la cual tan solo mediante la combinación de teclas podrá dar el formato que le guste.  para suso se debe instalar el paquete PHP-CS-Fixe ver el siguiente  este link para su configuracion.

HTML Class Suggestions

Plugin que ayuda a sugerir los atributos de clase HTML  a partir de los archivos CSS en el espacio de trabajo, ya que permite la aceleración de trabajo, sobre todo cuando usamos  framework de CSS como: Bootstrap, Foundation, Materialize y demás.

extension-para-segurencias-de-clases-para-html-css-visual-studio-code

jQuery Code Snippets

La mayoría  de los proyectos web están desarrollados con JQuery, sin lugar a dudas  jQuery Code Snippets  es una extensión que permite generar código JavaScript, tan solo escribir las letras ‘JQ’ le sugerirá más de 130 jQuery fragmentos de código. También existen para diferentes Framework como: Angularjs y otros, es solo cuestion de instalar y usar.

Live HTML Previewer

Esta extensión le permite previsualizar la escritura de código HTML,CSS  en tiempo real  en archivo que se esta trabajando.  Para usarlo presionar CTRL + SHITF +P y seleccionar-> show side preview  o simplemente presionar la combinaciones ctrl+ QS.

plugin-para-visualizar-en-tiempo-real-para-visual-studio-code

Auto Close Tag

Plugin que cumple la función de cerrar una etiqueta HTML al escribir  automáticamente.

Auto Rename Tag

Este plugin permite renombrar una etiqueta de apertura y de cierre de HTML y XML, para usar simplemente seleccione cuyo etiqueta y a reemplazar por otro.

plugin-para-renombrar-tag-de-html-para-visual-studio-code

CanIUse

Plugin que permite la comprobación de compatibilidad con HTML5, CSS3, SVG  para los navegadores, para su uso presionar las teclas CTRL+MAY+I) y  muestra la información sobre el término seleccionado en la barra de estado del editor de texto.

extension-para-validar-la-compatibilidad-de-propiedades-css-html-y-sgv

seti-icons y vscode-icons

Son plugins que permite mejorar el tema o interfaz  del explorador de archivos, en el cual asocia a cada tipo de archivo con un icono identificable. Para activar los iconos ir a –> Archivos -> Preferencia –>Tema de iconos de archivo.

temas-para-visual-studio-code

Personalmente tengo instalado extensiones o plugins imprescindibles para visual studio code que están en las lista de este articulo, si tiene mas curiosidad sobre otros plugins visitar la pagina oficial de plugins, si alguno de vosotros conoce una extensión puede comentar debajo de este articulo.

 

 

Comments

  1. By angelbello

    Responder

  2. By Javier

    Responder

  3. By Jonathan Milla

    Responder

  4. By Javier

    Responder

  5. By

    Responder

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.