Extensiones y personalización de Visual Studio Code

Les recomiendo la extensión Bracket Pair Colorizer, esta les pinta los brakets que abren y cierran funciones, así, pueden darse cuenta si les falta algo por cerrar.

Les dejo unos atajos de teclado para VS Code, que seguro les resultarán muy utiles 😄

Lista de extensiones recomendadas:

• Prettier: Mejora como se visualiza el código y ayuda a que sea más legible
• Color Highlight :Muestra los colores en .css para verlos.
• Live Server : Recarga de forma automática el navegador con los cambios que realicemos.
• Path Intellisense: Autocompleta rutas de archivos
• Auto Rename Tag: Permite actualizar al mismo tiempo una pareja de tags de html
• Material Icon Theme: Muestra iconos para identificar más fácil los tipos de archivo

Adicional a las que mencionó Celis:
Color Picker

CSS Flexbox Cheatsheet

CSS Grid Snippets

CSS to MDN

Git Cheatsheet

Git Graph

Polacode

TODO Highlight

Les recomiendo mucho usar una extensión de VS Code que se llama Settings Sync. Esta sirve para guardar de forma automática su configuración de VS Code en su cuenta de github, de esta forma pueden usar VS Code en diferentes computadoras sin tener que preocuparse de tener que actualizar su configuración en cada pc

1.25 velocidad perfecta

me gusta tener todo bien bonito así me da ganas de codear
![](

Yo estaba casado con Sublime Text, pero conocí a VSCode y la verdad por una cuestión técnica es el mejor editor y para el futuro de los desarrolladores es más cómodo, pero a veces regreso a sublime text, es como cuando terminas con ex porque solo es bonita y nada más, y conoces a alguien que tiene estudio, buena familia, te invita el helado, te rasca la espalda y se ve que juntos se puede comprar algo, pero tu siempre Ex estará buena y pecaras. (ojala que no).

Comparto las extensiones que más uso y que recomiendo:

• Bookmarks : Te permite dejar como separadores en tu código, por ejemplo para encontrar un código que dejaste para después más fácilmente (Crea una pestaña con todos los separadores que pusiste)

• Code Runner : Ejecutar directamente en la consola de VSC un código, Principalmente para JavaScript

• ** Elm Emmet ** : Te ayuda a escribir código HTML 1000 veces más rápido en una sola línea

• ** Google Fonts ** : Te permite importar fuentes directamente desde el navegador (Sea por link para HTML o import para CSS)

• ** WakaTime ** : Te permite obtener métricas de tu tiempo programando como: Porcentaje de lenguajes que más usaste en la semana, tiempo que estuviste programando, dispositivos, etc.

Jamás me faltara esta extensión en ningún entorno de trabajo nucna

Otra extensión que les recomiendo es: Settings Sync
Permite hacer un backup de nuestras extensiones instaladas y poder restaurar nuestra configuración en cualquier momento sin necesidad de volver a instalar una x una.

Además platzi tiene un blog de como poder configurar la extensión, aquí: https://platzi.com/tutoriales/1650-prework/4407-vs-code-extensions-backup/

Yo uso el theme Dracula Official

Yo vengo de haber tomado cursos de programación en diferentes lugares y nunca te enseñan a instalar todas estas valiosísimas extensiones que serán de gran ayuda. Gracias Platzi!

Unas buenas extensiones para VS Code son:
.

**- Bracket Pair Colorized 2**
Una extensión para colorear en pares los corchetes.
.


**- Highlight Matching Tag**
Destaca a juego las etiquetas de cierre y apertura.
.


**- Horizon Theme**
Un tema cálido para Visual Studio Code.
.


**- Kimbie Dark+**
El tema Kimbie Dark mejorado.
.


**- Vim**
Emulación de Vim para Visual Studio Code.
.


**- CSS Flexbox Cheatsheet**
Abre una hoja de referencia de flexbox directamente en VS Code.
.


**- CSS Navigation**
Permite ir a la definición de HTML a CSS.
.


**- Git Graph**
Abre una pestaña donde permite ver un gráfico de Git de su repositorio y realizar acciones de Git desde el gráfico.
.


**- HTML to CSS completion suggestions**
Proporciona sugerencias de finalización para clases e identificadores, desde documentos de marcado hasta hojas de estilo.
.


**- HTMLHint**
Integración de VS Code para HTMLHint: una herramienta de análisis de código estático para HTML.
.


**- Image preview**
Muestra la vista previa de la imagen en el margen y al pasar el mouse por encima.
.


**- Indent-rainbow**
Facilita la lectura de la identación del código.

hola! este es un pequeño resumen que hice!

Dos extensiones que también serán de muchísima utilidad serían GitLens y indent-rainbown. El primero les dará todas las herramientas de git para tener un mejor orden y llevar mejor el flujo de desarrollo, y el segundo es para orientarnos en las indentaciones y no confundirnos al indentar u ordenar nuestro código… Espero les sea de utilidad

😄

Comparto el resumen de la clase en PPT:

Slide 1:

Slide 2:

Slide 3:

Slide 4:

Slide 5:

Les recomiendo Git Graph. Ahorita no hemos visto mucho sobre Git, pero esta extension les servirá en un futuro.

Yo cuando instale Prettier no me estructuraba el código despues de guardar el archivo y no sabia por que D:
Vi este video y pude solucionarlo.
Se los dejo por si a alguien le pasa lo mismo!

Aparte de las extensiones que ya han comentado por aquí, éstas también les podrían servir:

• Turbo Console Log
  Esta extensión te permite que seleccionando tu variable y con un solo atajo de teclado, generes un línea de console.log con un mensaje significativo y más entendible a la hora de debuggear o examinar tus variables.

• Trailing Spaces
  Con esta extensión se resaltarán todos los espacios de más que se te pueden ir al final de una línea. Aunque también puedes habilitar esta funcionalidad directamente en las configuraciones de VSCode.

• Project Dashboard
  Te permite organizar tus proyectos por grupos en un dashboard visualmente simple y personalizable.

• Todo Tree
  Que filtra todos los comentarios que comiencen con TODO o con FIXME y los muestra en una vista de árbol, desde el que puedes acceder fácilmente a visualizar donde están tus pendientes.

• Better Comments
  Pinta de distintos colores tus comentarios según su tipo de acuerdo a como hayas empezado tu comentario, los categoriza en alertas, queries, TODO’s, importantes y puedes personalizar estas categorías o sus colores.

• CSS Peek
  Para que puedas echar un vistazo a los estilos CSS de cada clase, id o etiqueta HTML.

• Polacode
  Que genera bonitas screenshots de tu código.

https://platzi.com/blog/10-plugins-esenciales-para-vscode/

A partir de la version de vs code de agosto 2021 se integro la funcion bracket pair colorization la cual permite colorear parejas de parentesis, llaves y corchetes de esta forma el codigo es mas legible:

para activar esta opcion en vs code ir a manage (simbolo de engranaje) –> settings –> text editor –> activar bracket pair colorization:

Les recomiendo que utilicen Tabnine es una extension de VScode de una inteligencia artificial, que ayuda a predecir que vas a escribir, con el tiempo va aprendiendo y es muy bueno, sirve mucho para cuando haces algunas que tienen sintaxis muy similar o literalmente tiene que tener lo mismo pero cambiando algunas variables, aporta muchas cosas muy buenas, funciona de maravilla con JS y PHP por si alguien lo trabaja, incluso te recomienda funciones que no conocías pero ínsita a investigar en la documentación de cada lenguaje, porque muchas veces, tenemos una idea de hacer algo, pero no sabes como encontrar la función que lo haga o si quiera sabemos si existe y esto ayuda a ir encontrando funcionalidades que desconocemos algunos. espero les sirva mucho a las personas que lo instalen.

Las extensiones instaladas en esta clase son:

• Prettierr: mejora visual.
• Color highlight: muestra los colores usados en el código.
• Live server: para ver los cambios en tiempo real sin tener que estar actualizando el navegador.
• Path intellisense: ayuda a autocompletar rutas de archivos.
• Auto rename tag: cuando se renombra un tag actualiza el otro.
• Material icon theme: agrega paquete de iconos.

Les recomiendo instalen el tema monokai que proporciona una mejor visualización de los códigos, tiene una versiona light para el día y una versión dark para la noche.

les recomiendo esta extención para que puedan generar documentación para sus repositorios:
Markdown Preview Enhanced

Repaso de la clase

##Clase 2 – Extensiones y personalización de Visual Studio Code

** ¿Cuál es el atajo de teclado para abrir el menú de extensiones en VSC?**

• CRTL + Shift + I.

¿Cuál es el atajo de teclado para guardar un archivo en VSC?

• CRTL + S.

¿Para qué nos sirve la extensión Prettier?

• Nos ayuda a identar nuestro código para que sea más legible.

¿Para qué nos sirve la extensión Color Highlight?

• Esta extensión nos ayudara a detectar los coleres que vayamos implementando en nuestro sitio web. Esto lo hace dibujando un recuadro al código hexadecimal del mismo color que especificamos.

¿Para qué nos sirve Live Server?

• Esta extensión nos ayudara a actualizar automáticamente la página en donde estamos viendo cómo va quedando nuestro sitio web. Esto lo hacemos con el fin de no refrescar la página cada vez que hagamos un cambio en el código de manera manual.

¿Para qué nos sirve Path Intellisense?

• Esta extensión nos ayudara a autocompletar las rutas de los archivos que necesitemos en nuestro sitio web.

¿Para qué nos sirve la extensión Auto Rename Tag?

• Esta extensión nos ayuda a renombrar la pareja de una etiqueta cuando estemos cambiando estemos cambiando el nombre de una de las parejas.

¿Para qué nos sirve la extensión Icon Material Theme?

• Nos permite agregar un icono distintivo a los archivos para poder identificarnos.

Adicional uso también Peacock, la cual ayuda a diferenciar ventanas de diferentes workspaces de VS.

Otra extensión muy útil es Bracket Pair Colorizer 2, que pone diferentes colores a los brackets ayudando a diferenciarlos y a encontrar más rápido posibles brackets sueltos.

Hola devs, se las recomiendo, es brutal 👍

Error lens

Información resumida de esta clase
#EstudiantesDePlatzi

• Importante que tengamos en cuenta las buenas prácticas

• La extensión Prettier nos ayuda a ver la forma en la que se visualiza nuestro código y con el orden

• Color highlight me ayuda de manera visual saber que color estoy aplicando a mi página

• Live server me ayuda a poder ver los cambio de manera más rápida en nuestro proyecto

• Auto rename tag me ayuda con la edición rápida de las etiquetas

Les recomiendo la extensión Mithril Emmet, les ayuda a escribir más rápido el HTML, por ejemplo

#casa -> <div id="casa"></div>
.casa -> <div class="casa"></div>
ul>li*4>a -> <ul>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>

Es una extensión que agiliza el HTML en cantidades

Actualmente VSCode ya tiene la característica de Auto Rename Tag, la pueden habilitar aquí:

Bracket Pair Colorizer ya no es necesaria, se ha convertido una función nativa de VSCode.

Este videos de GNDX pueden configurar VS Code como él Plugins y Extensiones de Visual Studio Code para desarrollo web

😮Tema Platzi 💚

1.Prettler: Mejora la visualización de código
2.Color Highlight: Nos muestra los colores que elegimos al personalizar
3.Live Server: Refresca nuestro Cliente cada vez que ponemos código
**4.Path Intellinsense: **ayuda con la búsqueda de archivos para tu proyecto
**5.Auto Rename Tag: **Te ahorra tiempo al cambiar ambos nombres de un tag
6.Material Icon: Pones iconos bien bonitos para cada tecnología

en este repositorio encontraran mis configuraciones basicas para empezar con vs code
github.com/Andresdst/VisualStudioCode-conf-inicial

Les recomiendo INDENT-RAINBOW: Que es para que les marque una columna de color según la indentación de tu código.

Estas son las extensiones que fui instalando por recomendaciones en youtube y del canal de Oscar Barajas

Ya estamos 2022 y me di cuenta que la extension Bracket Pair Colorizer ya no está disponible para instalar en VSCode, y poniéndome a investigar esto se debe a que ya es nativo en VSCode!!! y las instrucciones estaban en la descripcion de esa extension jajaja… pero para usarlo tenemos que activarlo… como?
espero me entiendan jajajaj

1. control+shift+p
2. escribimos : settings.json
3. añadimos esto:
   “editor.bracketPairColorization.enabled”: true, “editor.guides.bracketPairs”:“active”
4. guardamos, reiniciamos y listo
   aqui tbien las imagenes
   
   
   
   

Ya tenía instalado “Material Icon Theme”. Es excelente, ayuda a identificar más facil todo. 😃

hay cosas que no entiendo pero me imagino que a medida que va avanzando los cursos mejor va entendiendo uno y familiarizando con la programación 😃

• Bueno así quedo mi VSCode después de algunas extensiones

Les dejo acá un mini resumen de las extensiones:

Prettier - Code formater
Mejora la forma en que se visualiza el código
(agrega espacios en donde haga falta, ayuda a reacomodar el codigo, etc).

Color Highlight
Agregar un recuadro alrededor del código hexadecimal en CSS el cual
muestra el color del mismo (previsualizacion).

Live Server
Actualiza automáticamente en el navegador los cambios guardados.

Path Intellisense
Autocompleta las rutas (esos significa ‘path’ en informática)…

Auto Rename Tag
Si haces un cambio en alguna pareja de tags, esta extensión autompleta los
cambios en el otro tag por ti.

Material Icon Theme
Agrega íconos a los archivos según su extensión, lo cual lo hace más visual.

SynthWave '84
Este es un tema retro que recomiendo.

Espero les haya servido;)

Corté con el curso acá. Cinco clases y todavía no hicimos nada salvo descargar cosas. Además es muy molesto escuchar el “desarrolladores y desarrolladoras” a cada rato. Iré por otro lado.

Dejo mi extensiones personales espero le pueda ayudar.

– Listado Para PHP –

• Laravel Extension Pack
• Laravel Blade Snippets
• Laravel 5 Snippets
• PHP Itellisense
• PHP Formatter
• PHP IntelliSense -> completa los path de los use
• PHP PHP Intelephense -> completa los path de los use
• Vetur -> Para ver las plantillas .VUE
• Beautify Blade

– **Listado Para Agilidad al codificar ** –

• AutoFileName
• FileNameComplete
• Auto Close Tag
• Auto Rename Tag
• seti-icons y vscode-icons
• Duplicate selection or line
• Git Graph
• Material Icon Theme
• Color Highlight
• Bracket Pair Colorizer
• Tailwind CSS IntelliSense
• shell-format
• HTML Snippets
• Salesforce Docum -> SFDoc -> Para documentar tu codigo
• CODESNAP -> Tomar Fotos de tu codigo
• • Live Server -

– Listado Para JS –

• indent-rainbow

• Color Highlight -

• Path Intellisense -

• Auto Rename Tag -

• Material Icon Theme -

• Prettier - Code formatter -

• vscode-icons -

• Bracket Pair Colorizer

• Babel

• npm intellinsense

• typeScript import

• Simple React Snippets

Las extensiones que se instalaron:

• Prettier: Nos ayuda a mejora la forma en la que se visualiza nuestro código, agregando espacios donde haga falta, reacomodando nuestro código, etc.

• Color Highlight: Te ayuda a visualizar los colores que se están poniendo al escribir código CSS.

• Live Server: Nos ayuda a montar un servidor de desarrollo local que al detectar cambios a nuestro código automáticamente refresca el navegador para visualizar esos cambios en el instante.

• Path Intellisense: Te ayuda a autocompletar las rutas hacia tus archivos para ponerlo correctamente.

• Auto Rename Tag: Cuando renombras una etiqueta de HTML de cualquiera de los dos lados (ya sea la de inicio o de cierre) automáticamente se modifica la otra.

• Material Icon Theme: Agrega una serie de iconos a Visual Studio Code lo que te facilita la visualización de archivos y saber de cual es su tipo.

Ya tenía todas las extensiones, son realmente útiles. Me encanta VSCode y la extensión Live server es la mejor de todas.

_Auto Close Tag _
excelente para cerrar automáticamente las etiquetas HTML

Que ganas de empezar a desarrollar ya

Ya quiero ver cómo quedan todas esas extensiones xD
Estoy mareada jajaj

Andromeda : Le da a tu código nuevos temas, con los cuales se vera mas bonitos, y facilidad para entenderlos

Les comparto una extension que les permite syncronizar sus extensiones descargadas en varios equipos Se llama Settings Sync les comaprto el video de como deben hacer el proceso https://www.youtube.com/watch?v=Gjgn0BThkII&t=440s&ab_channel=Skoy

Psdata: En caso tengas problemas al syncronizar luego de ello con gusto les indico como editar el archivo en GitHub para que funcione.

Se configuran los programas no sólo para que se vean bien, sino por su funcionalidad, que hace que todo fluya mucho mejor.

Extensiones recomendadas:
Prettier: Mejora como se visualiza el código y ayuda a que sea más legible
Color Highlight :Muestra los colores en .css para verlos encerrándolos para ver el color.
Live Server : Recarga de forma automática el navegador con los cambios que realicemos haciendo el trabajo mas ágil .
Path Intellisense: Autocompleta rutas de archivos
Auto Rename Tag: Permite actualizar al mismo tiempo una pareja de tags de HTML
Material Icon Theme: Muestra iconos para identificar más fácil los tipos de archivo

• Compañeros les dejo una lista de las extensiones que el profe recomienda, además de una recopilación de otras recomendaciones

1. TODO HIGHLIGHTING// Para ver en modo oscuro y claro VS
2. PRETTIER // Para ponerle más colores a VS
3. MATERIAL ICON THEME // Le pone un logito mini a el archivo de nuestro código
4. LIVE SERVER // Refresca nuestra página cada vez que hacemos un cambio
5. GIT GRAPH // Pone colores guía y permite poner etiquetas, entre otras cosas
6. AUTO RENAME TAG // Cambia la etiqueta secundaria automáticamente
7. PATH INTELLISENSE // Autocompleta rutas de archivos
8. COLOR HIGHLIGHTING// Muestra los colores en .css para verlos
9. COLOR PICKER // Permite seleccionar de una paleta de colores y nos pone el código

Espero les ea de ayuda

Instalamos las siguientes extensiones: (ctrl+shift+x)

• Prettier
• Color Highlight
• Live server
• Path Intellisense
• Auto Rename Tag
• Material Icon Theme

Yo les recomiendo synthwave 84. Pueden tener problemas al intentar instalarlo pero les recomiendo este post para resolverlo.

https://edgardorl.com/blog/how-to-install-synthwave-x-fluoromachine-theme-for-vs-code-on-macos-windows/

Extensiones de la clase:

• Prettierr: Acomoda el código para que sea más fácil leerlo.
• Color highlight: Muestra los colores que usas en tu código de manera visual.
• Live server: Refresca el navegador al modificar y guardar un archivo para ver los cambios.
• Path intellisense: Te ayuda completando el path de los archivos.
• Auto rename tag: Cuando modificas un tag, se modifica la contraparte en automatico.
• Material icon theme: Los archivos tiene iconos que indican de que son de manera visual.

Las extensiones que yo tengo de momento para VS son:

• Bracket Pair Colorizer
• Auto Close Tag
• Auto Rename Tag
• Better Comments
• CSS Peek
• GitLens — Git supercharged
• Html tag wrapper
• Live Server
• Material Icon Theme
• Open in browser
• Path Intellisense
• Prettier - Code formatter
• Spanish Language Pack for Visual Studio Code
• Vscode-icons

Me encanto la extensión de Auto Rename Tag, las demás están súper cool, gracias profe. La única que tenía era la de Material Icon Theme 🤭

Me motiva que dijeras: No te preocupes. Estoy empezando de 0, soy diseñadora gráfica y desconozco de programación, pero me llama la atención.

Les recomiendo utilizar la extensión vscode-icons, es parecida a Material Icon Theme, pero me parece que tiene un diseño más bonito.

Aquí les dejo una review:

Mi visual studio no me permitió hacer nada solo mostraba este mensaje: no ha abierto ni especificado una carpeta. Actualmente solo se buscan archivos abiertos. (En ingles) así que espero me ayuden. Pues no puedo avanzar.

Les dejo un sitio web donde recomienda mas extensiones para Visual Studio. Espero que lo encuentren util 😃
https://www.ponicode.com/blog/best-extensions-for-vs-code

Recomiendo indent-rainbow ayuda bastante a identar con colores

![](

Al instalar varias extensiones en Visual Studio Code, ¿no a lenta el rendimiento de la aplicación?

Para trabajar con Python estan son algunas de las extensiones que les puede servir:

1. Multi-command 2.Python-Vscode

🤩 Best VS Codes Extensions 🛠 Every Developers Should Use in 2020

Aquí te presento algunas extensiones populares para Visual Studio Code para el desarrollo web:

1. Live Server: permite lanzar un servidor local para visualizar tus cambios en tiempo real.

2. Prettier: formatea automáticamente tu código según un conjunto de reglas.

3. ESLint: detecta y corrige problemas de sintaxis y estilo en tu código JavaScript.

4. Auto Close Tag: agrega automáticamente las etiquetas de cierre en HTML y XML.

5. HTML CSS Support: agrega completado automático y resaltado de sintaxis para HTML y CSS.

6. IntelliSense for CSS class names: agrega autocompletado para nombres de clase CSS.

7. Path Intellisense: agrega autocompletado para nombres de archivos y rutas.

8. GitLens: proporciona una vista detallada de los cambios en tu código y colaboración con Git.

9. Live Sass Compiler: permite compilar y previsualizar archivos SASS o SCSS en tiempo real.

Es importante mencionar que estas extensiones son solo una pequeña muestra de las muchas disponibles, y que dependerá de tus necesidades y preferencias que escojas las que mejor se adapten a tu trabajo.

Visual Studio es lo mejor\

Gracias por todas las herramientas

VSCode + Atom One Dark = 😍

Excelentes extensiones, facilita todo.

Con la extensión Live Server al principio no podía descargarla luego me ha indicado descargar por medio de un archivo,guardar ese archivo y luego dar click para instalarla por medio de documentos.Logre instalarla 😃

La extensión Visual Studio Code habilita una opción de versión preliminar en directo para ver la página de contenido de los portales dentro de la interfaz de Visual Studio Code durante la experiencia de desarrollo. en la parte superior derecha cuando se abre un archivo HTML en modo de edición.

Les recomiendo también descargar Temas que cambian la apariencia de Visual Studio, por ejemplo existe uno oficial de GitHub

que buenos plugins

Me mataste con lo de material icon, esa mi biblia en el diseño ❤️

El funcionalidad del Bracket Pair Colorizer ahora se encuentra integrada en los settings del mismo visual, es por ello que la extensión ya no está disponible 👍🏼

Creo q bracket pair colorizer esta descontinuado, ya que no aparece en link de la web

ustedes son muy joevenes, pero alla lejos en los 90 no teniamos ides, por ende no teniamos extensiones… no teniamos internet y no teniamos electricidad (bueno, quiza exagero en eso ultimo), pero haciamos codigo igual, dijo el abuelo Simpson

Hola Ricardo, todas las extensiones que haz mencionado ya las tenía instaldas, aunque la última “material icons” no, pero tengo otra que es “vscode-icons” y me va genial. Recomiendo usar “Project Manajer” guarda tu proyecto dentro de VSCode como una extensión a la carpeta que contiene los archivos y así puede navegar en una lista de proyectos.

Live Server

Profe no pude evitar ver el launcher de Origin y el de Epic jaja

wow, soy novata en este curso, estoy desde cero y estoy maravillada con todo lo que estoy aprendiendo. perdida pero no me doy por vencida solo me preocupa que mi laptop no aguante todas las descargas.

No ha hablado de los casos en que tenemos windows anterior al 10

Les comparto mi lista de extensiones:

Excelente!!!

hola aguien sabe como aceder a las configuracions para que la linea se baje automaticamente y no se siga de largo!!!

Live server que buena extensión

Lista de Plugins (Y mis recomendaciones) :

• Prettier.
• Color Highlight.
• Live Server.
• Path Intellisense.
• Auto Rename Tag.
• Material Icon Theme.

Recomendaciones:

• Bracket Pair Colorizer.
• Settings Sync

Profesor disculpe sólo para despejar la duda, porque resalta un poco en algunos vídeos sobre desarrollo web, me genera duda porque estamos en la escuela de programación y desarrollo de software y pude notar que también hay otra escuela de desarrollo web, bueno obviamente soy nuevo aquí, y bueno este tipo de dudas ayudaría bastante resolverlas, porque dejaría de estar preguntándome si debería abandonar escuela e ir por la de desarrollo web

De verdad amo este curso!!! especificamente esta clase, antes de conocer a live server sufria de un inimaginable dolor de cabeza. Te amo Ricardo. Te amo Platzi.

Extensiones Instaladas
-Prettier - Code Formater
-Path Intellisense
-Material Icon Theme
-Live Server
-Color Highlight
-Auto Rename Tag