Extensiones de Visual Studio Code QUE DEBES INSTALAR ahora mismo
Вставка
- Опубліковано 4 тра 2020
- Visual Studio Code es uno de los editores de código más usados en el mundo y poco a poco ha sabido ganarse el cariño de los programadores. Como todo buen editor tiene una gran cantidad de extensiones que nos ayudan a trabajar en equipo, a escribir código mucho más rápido, etc. ¿Cuáles son esas extensiones que si o si debes tener instalado? En este video te los mostramos
Si eres estudiante de instituto, colegio o universidad, estudia en EDteam con 50% de descuento 👨🎓 bit.ly/3dmxdjm
🚀 Ayudamos a las personas a desarrollarse y alcanzar sus sueños con cursos de programación, diseño y emprendimiento online y en español.
#NuncaTeDetengas
- 🧑🎓👩🎓 ¿Eres estudiante? Postula a las becas de EDteam: edy.to/estudiantes-yt
- 🎁 ¡Accede a 9 cursos GRATIS de tecnología! edy.to/cursos-gratis-yt
- 🧑🏫 Dicta un curso en EDteam: edy.to/profesores-yt
- ⭐ Sube a premium y accede a cientos de cursos: edy.to/premium-yt
- 💻 Mira todos nuestros cursos en: edy.to/cursos-yt
-----
Síguenos en:
🔰 LinkedIn: edy.to/linkedin-yt
🔰 Instagram: edy.to/instagram-yt
🔰 TikTok: edy.to/tiktok-yt
Comienza a estudiar gratis programación y tecnología en EDteam 💻 edy.to/yt y *descubre porque en español nadie explica mejor*
3:54 Prettier - Formatear el código
5:29 Live Share - En tiempo real editar un mismo código con un compañero
6:32 Gitlens - Herramientas para trabajr con git
8:07 Editorconfig - Configurar un editor con un archivo
9:53 Polacode - Screenshot de una sección de código
10:30 Eslint - Linter para javascript.
12:39 Indent Rainbow - Colores en el indentado
13:47 Live Server - Servidor local
14:42 SVG - Gráficos hecho con códigos
gracias por el aporte
Heroe sin capa👍
xq esto es lo que hace un verdadero hombre.
Kappa sin heroe
@@jeancarlosluciano9211 Héroe sin tilde.
Gracias Alvaro! Soy una joven de apenas sesenta años y estoy aprendiendo programación gracias a tus videos claros, didácticos
y entradores. Soy profe de robótica y la programación nunca fue mi fuerte. Gracias a ti comprendo mas y me entusiasma estudiar. La pandemia a muchos les resulta pesado. Yo disfruto tus videos y aprendo.Gracias, gracias, gracias
Wow! 60 años y aprendiendo programación, es inspirador su caso.
@@flycrack ya esta corregido, gracias.
Gran ejemplo de que no importa la edad para aprender , nunca es tarde.
Hola Mirta de donde eres? somos colegas yo también soy prof. de robótica, tenemos un grupo de whasapp de robótica educativa, te puedo pasar el numero del administrador para que te agregue (pasame un correo)
No la conozco señorita pero mi respeto y admiración !,!, hechele y mucho éxito
Recomiendo también:
Error Lens: te muestra los errores dentro del mismo código no tienes que esperar alguna ventana flotante.
Import Cost: Cuando utilizas librerías y/o framework en import o require te dice cuando es el peso que estás agregando.
Debugger chrome o firefox: depende del navegador esto te ayuda hacer debugger de forma más fácil.
One Dark Pro: Es un tema chévere pero es más opcional si no les gusta los tema de vscode.
vscode-styled-component: si utilizas react y styled component te ayuda mucho para darle estructura.
Settings sync: sincronizar tus configuraciones de vscode en tantas máquinas que desees.
Breakpoint
Gracias!, me sirve
Gracias
gracias! one dark pro esta genial :D
Qué alegría saber que existen líderes como usted, apoyando la comunidad de programadores de latinoamerica. Años atrás hubiese querido tener la oportunidad de tener un mentor como vos lo eres para tantos hoy. Aunque llevo años de ser programador, siempre aprendo muchísimo con vos. Saludos desde Costa Rica.
Justo lo que necesitaba, mi dosis de EDteam diaria.
Buen contenido Álvaro, los conocí hace 2 semanas y ya me he visto muchos de sus videos, son de mucha ayuda.
me encanta como EDteam promociona su contenido con conocimiento útil y no con publicidad repetitiva.
Saludos, un hombre tan humilde, sencillo, y práctico en su labor. Vocación pedagógico.
Emilio Henry
Soy un amante de la programacion, la estudio de forma autodidacta y sus tutoriales han sido de gran ayuda para mi, gracias.
Muchas gracias, tome su clase de HTML y estoy trabajando con vs code para desarrollar la clase.
Excelente dato, recién me uno pero a ustedes, son los mejores.
Gracias EDteam !!!
Gracias Alvaro, realmente los contenidos de tu canal son extraordinarios. Saludos
Recomendaría tambien extensiones como:
-"Live Sass compiler",de Ritwick Dey, si es que estás trabajando con Sass en un rpoyecto Web.
-"Git Graph"para ver como van tus ramas con cada merge, commitss, y todos los procesos involucrados con las ramas, ver archivos cambiados en cada commit hecho y mucho mas, se puede ver como un complemento extra a Git Lens que ya se menciona en el video.
Wouuu me encanto el video, llevo tiempo buscando un video actualizado de extenciones de VSC y este video es como caido del cielo :D
te felicito porque explicas muy bien los temas, y no dejas dudas sobre el alcance de los temas
Extensiones "generalistas" que no dependan de un lenguaje, diría:
- Better Comments
- Color Highlight
- Path Autocomplete
- SonarLint
- Visual Studio IntelliCode
Y aunque al final no sé que tan usable o cómoda será, pero la indico, Peacock, si abrís varias instanacias de VSCode, se le puede dar a cada una un color
Sigo Aprendiendo cada dia + y +... Gracias por todo :) Lima -Perú
Si eres estudiante de instituto, colegio o universidad, estudia en EDteam con 50% de descuento y 👨🎓 #NoPierdasElAño ⭐ ed.team/premium.
¿Y si no soy estudiante? También tenemos un descuento especial para ti 🎉 bit.ly/2SJV3xo
Microsoft Visual Studio Code, lo mejor que pudo sacar Microsoft para dar un gran agregado al mundo del Desarrollo Web, aunque no solo sea para eso, pues se puede programar casi todos los lenguajes de programación, y hasta SQL Server se puede trabajar sin problema alguno.
Excelentes recomendaciones... ¡¡¡No conocía la de Rainbow!!! justo lo que necesitaba.
El descuento para estudiantes aplica para cualquier suscripción?
me interesan sus cursos pero no puedo pagarlo mensual ni semestral ni anualmente, veo que puedo comprar en especifico los cursos si compro individualmente por poco los cursos me daran un certificado de cada uno? si llego a tomar todos los de desarrollo movil con android me daran el certificado de la especialidad?
Disculpe mi ignorancia
Pero cual es el correo para comunicarme con ustedes?
El precio total de la suscripción es 680 ya viene con el descuento o cual sería el precio ?
Git graph también es útil para visualizar las ramas de un repositorio, commits y demás, es como git kraken pero hecha plugin.
No lo conocia, y esta muy genial !!! Gracias por el dato 👍🏻
@@carlosj.diazflores2999 Hola eso es dentro de vs code no?, no lo podria usar dentro de git bash no es asi?
GENIO!!! Que grandee! Te ganaste un subscriptor más, tus videos son lo más! Enserio, sigue así ;)
Te dejo tu merecido LIKE
Excelentes extensiones! Muchas gracias por toda la info!
Muy bien vídeo de verdad que hará si que seré un poco más rápido, Gracias Álvaro por tus motivaciones, enseñanza de verdad te lo agradezco, sigo tú curso de HTML en tu página y creeme que estoy aprendiendo bastante. Gracias Alvaro
Acepto que subestime el video antes de verlo, oro puro
que buen video, habia algunas extensiones que no conocia, "voy corriendo" a instalarlas
Excelente vídeo.!. Alvaro podrías hablar sobre PWA o Progressive Web App, sus características y vías para su desarrollo, ademas de su participación actual en el mundo laboral y en el desarrollo web, por favor.
Hola! Soy nuevo suscriptor aqui y me gustan los videos educativos me inspiran a seguir estudiando esta hermosa carrera aunque es dificil y lleva mucho sacrificio todo vale la pena asi que muchas gracias edteam!!
Tienes mucho talento pedagógico...he visto muchos videos...los tuyos son los mejores ....sigue así...saludos desde Bolivia.
Muchas gracias por compartir tus conocimientos. Recién empecé a probar VSC y me encantó!
Buen video *Muchas Gracias* por el contenido EDteam, saludos desde Honduras.
Bracket Pair Colorizer
Esta es buenísima a mi parecer se parece un poco a Indent Rainbow en su función.
Lo que hace esta extensión es colorear los (),{},[] dependiendo a quien pertenezca por ejm:
class hola{
constructor(){
}
}
Las llaves de la clase hola serán amarillos y los del constructor serán morados.
Tal vez a alguna persona no les cueste eso pero a otros principiantes tal vez si, además se ve mas bonito el código
Gracias hermano!
Soy el único que se sintió hipnotizado? Posta, voz de locutor. SALUDOS DESDE ARGENTINA
Las dos penultimas super buenas, ya mismo las instalo!
Eres un crack, ¡me ayudas a crecer!
Muchas gracias por el video, EDteam (Álvaro). Recién instalé VS Code y tengo que agregar esas extensiones que sugieres.
En los proyectos que estoy trabajando utilizo mucho PHP y he instalado unas extensiones (PHP Intellisense y PHP Live Server), pero no he encontrado cómo configurarlas. La primera es un lint, y la segunda me crea conflicto con el localhost. Ojalá alguien pudiera ayudarme a configurarlas, realmente me sería de mucha ayuda.
¡Sigan creciendo EDteam! Gracias por compartir conocimiento y ayudar a crear un mejor mundo mediante la educación.... NUNCA TE DETENGAS!!! APRENDE, APLICA, PRACTICA!!!
Para poder usar Live Server con PHP tienes que instalar adicionalmente la extension Live Server Web Extension (Chrome), aqui te dejo el link: chrome.google.com/webstore/detail/live-server-web-extension/fiegdmejfepffgpnejdinekhfieaogmj
Una vez instalado presiona el icono de la live server en chrome y configura de la siguiente manera:
1. Actual Server Address: la ruta donde tienes tu proyecto (localhost/carpeta_proyecto/)
2. Live Server Address: ruta por defecto que se muestra al ejecutar live server desde VS code (en mi caso es 127.0.0.1:5500/)
3. Activar la opción Live Reload
Ahora si desde VS Code, en tu proyecto PHP inicia Live Server, se abrirá una pagina con la ruta de live server por defecto (en mi caso 127.0.0.1:5500/), cambia esa direccion por la de tu proyecto (localhost/carpeta_proyecto/).
Hola queria agregar que tambien es muy util la extension de "Flutter" para desarrollos para equipos moviles que permite desarrollos para Android y IOS al mismo tiempo. Esta extension utiliza el lenguaje Dart que hay que instalar aparte.
Buen contenido y justo para prepararme para el inicio de mi curso de diseño Web y otras materias :D Saludos.
Muchísima gracias Excelentes vídeo, es de muchas ayuda. Bendiciones
Confirmo que _todas_ las 9 extensiones sugeridas en este video se pueden instalar en VSCodium (la versión completamente open-source de VSCode, ya que la versión que liberó hace poco Microsoft no es completamente libre). Eso sí, el marketplace de VSCodium tiene muchas menos ofertas, supongo qe por el hecho de qe supervisan qe las extensiones de su marketplace sean libres.
El único par de variantes fueron: En vez de Polacode fue CodeSnap (funcionalidad la misma con varias personalizaciones, incluso le dan un agradecimiento a Polacode, es de suponer que tiene alguna configuración adicional) y en vez de Live Share fue Code Together (dicen tener soporte multi-IDE o aunque alguno de los colaboradores lo haga desde un navegador)
Hay uno que me gusta y uso mucho se llama ** Flatland Monokai Theme ** Es el tema más bonito que he podido encontrar pruebenlo, Gracias EDteam !! Saludos desde Colombia.
Live Share! Andaba buscando algo así! Muchas gracias!
Seria interesante que incluyeran en este canal el formato podcast, una trasmision en vivo de aprox una hora, creo que le añadiria mas dinamismo a todos estos temas
Para cuando la segunda parte de las extensiones, me encanto la primer parte y casi puse todos los que recomendaste pero ya hace falta refrescar a los que pueden ser novedad, espero con ansias la segunda parte. Saludos.
Buen video edteam... podrían hacer un video mostrando cual es el proceso final del software después de creado? Y mostrar el proceso que se lleva tanto en un lenguaje interpretado como en uno compilado... como haces funcionar lo que haz escrito en otras terminales , hay un proceso de empaquetado ? Y si lo hay ... como es? Gracias
soy estudiante inicial de html . estoy viendo tus videos y son muy claros mil gracias por esta razon me atrvo a molestarte , gra cias por tener un metodo tan claro pa ra enseñarnos
Si quieres aprender más sobre HTML, ingresa a ed.team/cursos/html y empieza a estudiar 👋
Saludos Genial trabajo que hacen, cuidense mucho
Son tan variadas las recomendaciones que hacen los distintos canales que tengo una gran confusión...debería recomendar las básicas (temas de color, iconos, etc) y luego sugerir otras extensiones según el ambiente de desarrollo, unos lo hacen con php, otros con pythom otros php, etc...
Liveshare es muy completo, no hace falta usar zoom aparte, porque tiene sus extensiones para el chat dentro de liveshare aparte de poder hablar como si se tratase de una llamada de zoom también. Buscando live share les aparece "live share extension pack" ya les viene la extensión del chat, del audio y el propio liveshare. Además de que el host puede compartir su server, si es que trabajan con localhost o con uno de paga lo mismo, pueden acceder desde liveshare a el servidor y a la base de datos, hacer ediciones y demás y también se puede compartir una terminal
Excelente video y material!
Hola gracias por las sugerencias. La mayoría las conocía pero algunas no así que les daré un vistazo. Sobre las que que RECOMIENDO son:
*Bookmarks: Marcado de lineas para alguna observación posterior, y una rama para ver todos tus archivos marcados.
*css-minify: genera un archivo minificado de algún estilo css que tengamos.
*Color Manager: Permite ingresar el código de color que necesitamos en una hoja de estilos mediante un gráfico para mayor facilidad.
*TEMAS BONITOS: Horizon Theme, Night Owl, Noctis, Panda Theme.
Ojala venga la segunda parte, saludos!!
Buen vídeo con buen contenido acerca de VS Code
Muchas gracias por la información, me gusto mucho eso del concepto del Nuevo Microsoft, Saludos
Me encanta Visual Studio tambien!
muchas gracias por sus aportes profe
me encanta VS CODE, otros editores son buenos tambien, pero comparto tu opinion, el mejor editor
Excelente... buen aporte para utilidad de los iniciados en programación. Gracias Álvaro.
grandes videos soy un nuevo suscriptor recien hace como 1 mes y waooo me sorprende la calidad de sus videos y grandes enseñanzas , una consulta con que programa usas para grabarte y poner tus presentaciones?
santos avistamientos Alvaro, se te extrañaba en el canal, saludos
Extensión Comment Anchors, para poner anclas o secciones en los comentarios del código en su fase de desarrollo. Es bastante útil ya que resalta líneas determinadas que puedes encontrar fácilmente en el explorador de la extensión.
Existe otro tambien, CSS Peek, que ayuda a ver el codigo fuente de las hojas de estilo de tu proyecto y editarlo. Ayuda mucho. Un pequeño granito de arena. Saludos cordiales
Podrías hablar sobre los plugins que agregan snippets.
Tambien falto, a mi parecer, Project Manager y Setting Sync.
Excelente vídeo,!!! Sr. Alvaro podrías hablar un poco mas sobre Python por favor!!! sobre las App, sus características y vías para su desarrollo, además de su participación actual en el mundo laboral y en el desarrollo IA, soy un joven de 55 años
Recién estoy aprendiendo programación gracias a tus videos muy claros, muy didácticos, !!
Muchas gracias Alvaro por esta información que ayuda mucho para los que estamos en esto de la programada. Quería aprovechar para preguntarte si eres tan amable de compartir que equipo y software utilizas para realzar estos video en donde aparezcas tu y la pantalla. Muchas gracias de antemano, abrazo desde México!
Yo lo uso y es muy interesante.
buen video
Felicidades por el Video!
Muy buen video, saludos desde México!!!
Muchas gracias!
Excelente! Gracias!
Muchas gracias!!
excelente!! gracias por la info
muchas gracias por el video, una consulta, como se usa el Indent? Saludos
Me gustaron tus recomendaciones
tambien puedes instalar live share audio para hablar por ahi mediante llamada o live share chat para tener el propio chat dentro del editor, Muchas gracias por el vídeo no conocía live share, Un saludo
Justo estoy haciendo mis prácticas de sus cursos en VSCode
Hola una pregunta ...
Hay que instalar el programa antes de utilizar VScode?
Por ejemplo Python o JavaScript.
Gracias
@@andrescaleno4614 No para nada solo crea y guarda el archivo con la extensión del lenguaje.
Buenísimo, gracias. Acabo de instalar el VSC y todo lo necesario para comenzar a desarrollar en Flutter y quisiera conectar mi dispositivo Android (a través de USB o red) para poder probar las apps sin emulador. Me podrías echar una mano o referirme algún tuto. Mil gracias y saludos desde Tenerife.
Muchas gracias amigo :D
Excelentes videos Álvaro, por favor intenten resolver el problema de los pagos en Argentina, necesito renovar mi suscripción premium
muchas gracias por su video
Como dicen es el mejor editor y sigue mejorando, una opción que se viene es la sincronización con cuentas de correo algo súper esperado.
Ya se puede sincronizar con la extensión sync-setting con GitHub
Gracias Alvaro.
excelente, Álvaro es de mucha ayuda, saludos desde Colombia
Saludos desde EDteam 🤩
Ufff buenisimo, deberían hacer uno así con los plugins para atom
me gustaria que hicieran un video de como cargar extenciones de vhdl y hagan una simulacion ya que no he encontrado contenido de esto y creo que es algo util el trabajo con las cpld
Estimado Alvaro & Team,Gracias por la ayuda y enseñanza !!💻👍
Excelente saludos EDteam
Gracias me sirvio muchismo 👌Nuevo subcriptor!!!!
genial!! al live server le vendria genial un compilador de sass, pug, etc
Saludos, muy buenos sus videos y tips.
¿Siguen teniendo el descuento en sus cursos?
Amigos liveshare tiene opción de audio integrado, no hace faltar complementar con una app de llamadas
Muy buen aporte
Excelente video muchas gracias Alvaro
En lo personal me gusta la combinación, entre Visual Studio Code y Windows Subsystem Linux (Shell Ubuntu 18.04) con el complemento Remote-WSL
Gracias por el video...
La mejor extensión que he visto hasta el momento es tabnine
Estoy empezando con el visual studio code y me parece realmente bueno. las extensiones como liveserver, eslint, coderunner....
Estan muy bien. No sabia lo del svg en extension tiene muy buena pinta...
Soy mucho de corel draw, y tambien utilizo muchisimo inkscape...
Mi pregunta es.
Se podria diseñar un pagina web con inkscape y luego pasarla al visual studio code para ponerle etiquetas y demas ??
Live Share Audio agrega funcionalidades de voz a Visual Code, buena combinación para Live Share.
Suelo utilizar Sublimetext, y una característica que me gusta cuando doy mis clases es que puedo incrementar o reducir el tamaño de la letra con Ctrl+Rueda del mouse. Esta acción la intente hacer en VS Code pero resulta que también se amplió los botones laterales. Conoces de algún mecanismo para manipular el tamaño del texto rápidamente porq la verdad me atrae bastante este nuevo editor.
Gracias por compartir tu conocimiento 👍
Toca ir a la configuración y cambiar tamaño de fuente
Ctrl + Tecla + o Ctrl + Tecla -
Mi humilde recomendación
*Settings Sync:* _Sincroniza todas sus extensiones VScode, configuraciones, Snippets y Themes usando GitHub Gist._
marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync
*MySQL Client for vscode:*
marketplace.visualstudio.com/items?itemName=cweijan.vscode-mysql-client
*Kite Python Autocomplete:*
marketplace.visualstudio.com/items?itemName=kiteco.kite
genial justo lo que buscaba