¡No pierdas tu tiempo! Necesitas esta configuración para VSCode

midulive
10 Jul 202408:36

Summary

TLDRThe video script discusses updates in Visual Studio Code, particularly focusing on the version 1.910 release. It highlights a new experimental feature, the SCM (Source Control Management) history graph, which was previously only available through extensions like Git Graph. The presenter also mentions the decline of Git Graph due to lack of updates and speculates on the reasons behind its integration into VS Code. Additionally, the script covers customizable tab labels for better file identification and grouping, a feature that enhances the user experience, especially for complex projects. The presenter compares the development pace of VS Code with other editors like Sublime Text and anticipates future developments in the coding editor landscape.

Takeaways

  • 🌟 Visual Studio Code has released version 1.910 with new features, including an experimental Git history graph.
  • 🔍 The Git history graph was previously available only through extensions like Git Graph, which is still recommended for its advanced features.
  • 📈 The new Git history graph in VS Code allows users to see changes in a visual format, enhancing the user experience.
  • 🔧 Users can enable or disable the experimental Git history graph feature based on their preference.
  • 📚 Git Graph, a popular extension with 8 million installations, has not been updated for three years, prompting its integration into VS Code.
  • 🎨 Custom tab labels in VS Code have been enhanced, allowing for more flexibility in displaying file information.
  • 📁 Users can now customize the display of file names and extensions in the workbench editor, adding tags or even emojis.
  • 🖌️ Custom levels patterns allow for more detailed customization of how file paths are displayed in the editor.
  • 📚 The ability to group custom tab labels has been added, providing more information and better organization of files.
  • 📈 Negative indices are now supported in custom labels, offering more control over what is displayed in the file tabs.
  • 🚀 Sublime Text, another popular code editor, has been slower in updates compared to VS Code, with its last major update being in August 2023.

Q & A

  • What is the latest update in Visual Studio Code?

    -The latest update in Visual Studio Code is version 1.910, which includes new features such as an experimental SCM (Source Control Management) history graph for Git.

  • What is the SCM history graph in Visual Studio Code and why is it significant?

    -The SCM history graph is a feature that visualizes the changes in Git repositories. It was previously available only through extensions like Git Graph, but now it's being integrated into Visual Studio Code, making it more accessible and potentially replacing the need for separate extensions.

  • Is the SCM history graph feature fully functional or still in experimental phase?

    -The SCM history graph is still in the experimental phase, which means it might not be fully stable or feature-complete.

  • What is Git Graph and why was it popular?

    -Git Graph is a popular extension for Visual Studio Code that provides a visual representation of Git repositories. It was widely used due to its ability to display commit history and branches in a graphical format, making it easier to understand the project's history.

  • Why might Visual Studio Code be integrating the SCM history graph instead of relying on Git Graph?

    -Visual Studio Code might be integrating the SCM history graph to provide a more integrated and seamless experience for users, potentially eliminating the need for third-party extensions like Git Graph, which has not been updated for a long time.

  • What is the status of Git Graph in terms of updates and popularity?

    -Git Graph has not been updated for over three years and has a significant user base with 8 million installations, making it one of the most installed extensions in Visual Studio Code.

  • Can users still use Git Graph if they prefer it over the new SCM history graph?

    -Yes, users can continue using Git Graph if they prefer it. The new SCM history graph is optional and users can choose to activate or deactivate it based on their preference.

  • What is the 'velada del año' project mentioned in the script?

    -The 'velada del año' project is a web project mentioned in the script, but the specific details about the project are not provided in the transcript.

  • What is the new feature in Visual Studio Code that allows customizing tab labels?

    -The new feature allows users to customize the labels on tabs in the workbench editor. Users can define custom patterns and labels to better organize and identify files in the editor.

  • How can users customize the tab labels in Visual Studio Code?

    -Users can customize tab labels by setting 'workbench.editor.labelCustomization' in the settings. They can define patterns to match specific file paths and set custom labels, such as file names, extensions, or even emojis.

  • What is the significance of the ability to group custom tab labels?

    -Grouping custom tab labels provides more flexibility and organization in the editor. It allows users to categorize and access files more efficiently, especially in large projects with many files.

Outlines

00:00

🌐 New Features in Visual Studio Code

The speaker discusses updates in Visual Studio Code, particularly the version 1.910 release. They highlight the new experimental feature for showing the Git history graph, which was previously only available through extensions like Git Graph. The speaker notes that while Git Graph is more powerful, the built-in feature is a welcome addition, especially considering Git Graph hasn't been updated in three years. They also mention that this feature is optional and users can choose to use it or not. The speaker compares this to other editors like WebStorm and emphasizes that having a feature in another editor doesn't diminish its value in Visual Studio Code. Additionally, they talk about customizing tab labels in the workspace to better organize and identify files based on their folder structure.

05:01

📚 Customizing Workspace and File Identification in Visual Studio Code

The speaker continues to explore Visual Studio Code's customization options, focusing on how to better identify and organize files within the workspace. They demonstrate how to add custom labels to tabs, such as showing the directory name or using custom patterns to display file names and extensions. The speaker also discusses the flexibility in defining these labels, including the ability to use negative indices to exclude parts of the file name. They provide examples of how this can be used to enhance the visibility of file types, such as marking files within the 'types' folder or those related to the API. The speaker concludes by noting the value of these customizations in large projects, such as those using Next.js or Astro, and compares the development pace of Sublime Text with Visual Studio Code, highlighting the latter's more active community and extension ecosystem.

Mindmap

Keywords

💡Visual Studio Code

Visual Studio Code is a popular, free, open-source code editor developed by Microsoft. It supports a wide range of programming languages and is known for its robust ecosystem of extensions. In the video, the speaker discusses updates to Visual Studio Code, highlighting new features and their impact on the user experience.

💡Git

Git is a version control system used for tracking changes in source code during software development. It is a fundamental tool in modern software development workflows. The script mentions a new feature in Visual Studio Code that allows users to visualize Git history, which was previously only available through extensions like Git Graph.

💡Git Graph

Git Graph is a popular extension for Visual Studio Code that provides a visual representation of Git repositories. It helps developers understand the history and structure of their codebase. The speaker mentions that this extension is still more powerful than the new built-in feature in Visual Studio Code, despite the latter being a significant addition.

💡Experimental Features

Experimental features in software refer to new functionalities that are still in development and not yet fully stable or complete. The script discusses an experimental feature in Visual Studio Code that shows the history graph for Git repositories, indicating that users can try it out but should expect some potential issues or limitations.

💡Extensions

Extensions in the context of Visual Studio Code are additional software components that enhance the editor's functionality. The speaker talks about the use of extensions like Git Graph and how they can be replaced or complemented by new built-in features in the editor.

💡SCM (Source Control Management)

Source Control Management (SCM) refers to the management of changes to the source code of a project. In Visual Studio Code, SCM features help developers manage their code revisions and history. The script mentions an experimental SCM feature for showing the history graph, which is a significant update for developers.

💡Custom Tab Labels

Custom Tab Labels in Visual Studio Code allow users to modify how file tabs are displayed in the editor. The script discusses a new feature that lets users customize the labels with more flexibility, including adding tags, file names, extensions, or even emojis, to better organize and identify their files.

💡File Organization

File organization in a code editor involves how files are displayed and managed within the interface. The video script talks about new ways to organize files in Visual Studio Code, such as showing custom labels or grouping them based on their location in the project directory.

💡Web Development

Web development encompasses the building and maintaining of websites. The speaker mentions a project called 'la velada del año' (the party of the year), which is likely a web development project. The context suggests that the updates discussed in the video are particularly relevant for web developers.

💡Version Control

Version control is the management of changes to documents, programs, or other information stored as computer files. It is crucial in software development for tracking revisions and managing collaborative work. The script discusses how Visual Studio Code's new features can improve the experience of working with version control systems like Git.

💡Editor Customization

Editor customization refers to the ability to modify the behavior and appearance of a code editor to suit individual preferences or project needs. The video script highlights new customization options in Visual Studio Code, such as custom tab labels and file organization, which can enhance productivity and user experience.

Highlights

Visual Studio Code has released version 1.910 with new features.

A new experimental feature is the Git history graph, which was previously only available through an extension.

The Git history graph can be activated with the 'scm experimental show history Graph' setting.

The Git Graph extension is still recommended for more powerful features, despite the new built-in feature.

Git Graph has not been updated for three years, which might be the reason for its integration into Visual Studio Code.

Git Graph is one of the most installed extensions in Visual Studio Code with 8 million installations.

Users can choose to continue using Git Graph or try the new built-in feature.

The new feature allows users to see both the Git history graph and the files side by side.

WebStorm has had similar features for years, indicating that new features in Visual Studio Code are not always groundbreaking.

GitKraken is a free application for open-source projects and has its own Visual Studio Code extension.

GitKraken is praised for its aesthetics and functionality, but some users prefer other tools like Fork.

Custom tab labels can now be more flexible, allowing for negative indices and more patterns.

Users can now group custom tab labels for better organization.

The new custom levels allow for more detailed and specific labeling of files in the workspace.

Sublime Text is mentioned as a fast editor but with a slower evolution compared to Visual Studio Code.

Sublime Text's updates have been infrequent, with a significant gap between version 3 and 4.

Sublime Text requires a paid license, which might affect its adoption compared to free alternatives.

Z is highlighted as the next editor to watch, suggesting it might become a significant competitor.

Transcripts

play00:00

tenemos novedades de visual Studio code

play00:02

que estoy intentando entrar en la página

play00:04

de la velada del año y el proyecto que

play00:05

tengo es la velada del ano

play00:08

web Ay Dios ha salido la versión

play00:13

1.910 y entre las cositas nuevas que hay

play00:16

hay un par de cosas que llaman bastante

play00:18

la atención que te voy a comentar porque

play00:20

tienes que activar o probar y una es

play00:23

esta gráfica de los cambios en git

play00:27

fijaos que ahora podéis activar está en

play00:29

experimental todavía pero esto

play00:31

Normalmente se hacía con una extensión y

play00:33

ahora tenéis la oportunidad de activar

play00:35

este scm experimental show history Graph

play00:38

podéis verlo aquí lo

play01:00

con una extensión por ejemplo una

play01:01

extensión que se utilizaba que podéis

play01:03

seguir utilizando si no os convence como

play01:04

está hecho es git Graph lo que pasa es

play01:07

que git Graph todavía está mejor git

play01:09

graf es como más potente y fijaos que

play01:12

teníamos como un montón de cosas veis

play01:13

aquí que salen las gráficas las líneas y

play01:16

tal git graft todavía hace más cosas Yo

play01:18

creo que pronto para eliminarla lo que

play01:20

pasa es que no se actualizaba fijaos que

play01:22

el último comit es de hace 3 años de

play01:25

hecho yo creo que esta es la razón por

play01:27

lo que la gente de visual Studio code lo

play01:30

han añadido en el editor porque fijaos

play01:32

que es que git graft tiene 8 millones de

play01:34

instalaciones es una de las extensiones

play01:36

más instaladas de visual Studio code y

play01:38

el hecho de que esté abandonada pues es

play01:40

una pena porque era tremenda la podéis

play01:43

seguir utilizando de hecho eh No hay

play01:44

ningún tipo de problema o al contrario

play01:46

los han contratado Ojalá no lo creo pero

play01:48

ojalá Igualmente es opcional eh que veo

play01:51

aquí Alexito dice no me gusta bueno no

play01:53

pasa nada si no te gusta no te preocupes

play01:55

porque lo puedes echar para atrás lo

play01:56

puedes activar o Desactivar Habrá gente

play01:58

que sí que le guste esta forma de ver

play02:00

los cambios está bastante bien Esto no

play02:01

significa que dejéis de ver los archivos

play02:03

eh importante los archivos los seguís

play02:05

viendo esto es que podéis ver la Gráfica

play02:07

con los cambios pero también veis los

play02:08

archivos eh están justamente al lado Así

play02:10

que nada ahora bien hay gente que se

play02:12

ponía Pero esto lo tiene git graf lo

play02:14

puse el otro día aquí aquí lo puse no

play02:16

los que usamos webstorm ya esto existía

play02:18

en el sst hace años qué paciencia hay

play02:20

que tener paciencia y qué más da y qué

play02:24

más da Es que es que es como es como

play02:27

vamos a ver vamos a ver que algo ya

play02:29

exista en otro sitio no significa que no

play02:32

sea un buen añadido porque hay gente que

play02:34

a lo mejor no qui utilizar sst Además

play02:36

vamos a ver sst es una aplicación

play02:38

separada al editor es que no tiene

play02:40

sentido compararlo no tiene sentido

play02:45

compararlo poco vinagre eh hace enojar

play02:47

nada no me enojo Pero me sorprende la

play02:49

verdad me sorprende el hecho de decir No

play02:51

es que esto ya estaba Y tal dices Bueno

play02:53

ya estaba ahí pero no estaba aquí por lo

play02:54

tanto pues ya está no git kracken

play02:56

también está super bien git kracken que

play02:58

es una aplicación que gratuita para

play03:00

proyectos de código abierto si no me

play03:02

equivoco y es muy bonita y sí ya estaba

play03:03

en G Kraken pero a lo mejor no quieres

play03:05

instalar ge Kraken y quieres tenerlo

play03:07

todo en el mismo editor Bueno pues ya

play03:08

está bien De hecho G Kraken también

play03:09

tiene una extensión de visual Studio

play03:11

code está muy chula G Kraken me gusta me

play03:13

gusta pero mira a m sst por ejemplo no

play03:15

toco ni con un palo no me gusta nada

play03:16

ssti Y mira que lo usé en su día pero me

play03:19

gustan más otras alternativas me gusta

play03:21

más fork y mira que es de pago fork pues

play03:23

me gusta más entonces no entiendo estas

play03:25

cosas No seáis vinagres hombre si algo

play03:27

nuevo aparece pues pues vamos a

play03:29

disfrutarlo ya está otra cosa nueva que

play03:32

hay no es nueva pero os voy a os voy a

play03:34

contar una cosa Mirad fijaos en el

play03:35

proyecto de la velada en el proyecto de

play03:37

la velada cuando abrimos un archivo por

play03:40

ejemplo en pages vamos a abrir el 404

play03:44

qué ha pasado aquí Qué pasa aquí habéis

play03:46

visto esto de pages Por qué no aparece

play03:48

aquí en components vale veis que aquí

play03:50

solo aparece el nombre cómo he hecho Que

play03:52

aparezca ahí pages o lo que yo quiera

play03:54

bueno Esto no es una cosa que sea nueva

play03:56

pero es verdad que el otro día hab un

play03:57

tweet de la gente de bersel que lo

play04:00

explicaban y me pareció bastante bonito

play04:01

y os lo voy a enseñar Mirad aquí a ver

play04:04

si lo encuentro pages aquí vale esta

play04:06

opción la podéis Añadir para poner

play04:09

etiquetas las etiquetas que queráis las

play04:11

que queráis Mira workbench editor custom

play04:14

levels patterns y puedes decir mira los

play04:16

archivos que estén dentro de la carpeta

play04:18

types voy a hacer Que aparezca en la

play04:21

pestaña el nombre del archivo la

play04:23

extensión y ponga types que aquí además

play04:25

puedes poner types como que puedes poner

play04:27

lo que te dé la gana Podrías poner hasta

play04:28

un emoji eh A ver vamos a poner Azul Por

play04:30

ejemplo vamos a poner un emoji voy a

play04:32

poner la policía para esto y aquí en

play04:34

páginas vamos a poner unos libros vale

play04:36

por ejemplo pues esto lo podéis hacer y

play04:39

ahora va a detectar que los archivos que

play04:41

estén dentro de types lo voy a mostrar

play04:43

de esta forma si yo ahora voy a types

play04:45

que no tengo Vale ahora veo que no tengo

play04:47

Bueno pues voy a pages y voy a pages y

play04:49

abro el 404 fijaos cómo lo está poniendo

play04:51

lo interesante es que podéis hacerlo de

play04:53

cualquier forma o sea por ejemplo los

play04:54

que estén dentro de components pues

play04:56

podéis poner components pero podéis

play04:58

hacer aquí lo podéis poner antes lo

play05:00

podéis hacer después podéis hacer lo que

play05:02

queráis mira ahora en components si

play05:03

entramos en components veis ahora action

play05:05

asro gu components si preferís podéis

play05:08

hacer otra cosa por ejemplo podréis

play05:10

decir Que aparezca el dirname vale Y

play05:13

entonces ahora me te va a poner que es

play05:15

dentro de compones el archivo Astro lo

play05:17

podéis hacer al revés por ejemplo

play05:19

podríais hacer eh podéis hacer así que

play05:22

sea como simplificada la extensión Vale

play05:24

y veis aparece component podéis hacer lo

play05:26

que os dé la gana está super chulo y a

play05:29

además de esto y esta es la novedad de

play05:31

este año es que además ahora lo podéis

play05:33

agrupar el custom Tab labels este lo

play05:36

podéis agrupar y podéis tener un montón

play05:38

de más información ves cuando defines

play05:40

custom laves ahora tienen más

play05:42

flexibilidad para acceder a la extensión

play05:46

individual de cada archivo Entonces

play05:48

ahora puedes soportar también índices

play05:51

negativos Por ejemplo si por lo que sea

play05:53

no quieres Mostrar toda la extensión

play05:56

podrías hacer algo así imaginaos que

play05:59

veis que pone punto Astro yo que sé y no

play06:01

queréis enseñar la extensión Pues aquí

play06:03

en el xname este podemos hacer así vale

play06:07

en lugar de la extensión podemos hacer

play06:10

así podemos quitar el punto podemos

play06:12

hacer algo así y esto lo he puesto Ah lo

play06:14

he puesto en paches Vale pues vamos

play06:16

Bueno lo voy a hacer aquí también vale

play06:18

vamos a hacer así y podéis hacer así

play06:21

esto a ver es una tontería eh Pero bueno

play06:23

veis Ahí ahora pone Astro no sé qué

play06:25

podéis hacer 1 millones de cosas han

play06:26

añadido como las posibilidades de

play06:28

hacerlo todavía mejor e incluso el tener

play06:31

más patrones Así que echarle un vistazo

play06:33

pues se pueden hacer 1 millones de

play06:35

historias y creo que queda muy bonito

play06:37

especialmente para proyectos por ejemplo

play06:38

de nexts de Astro que por lo que por lo

play06:42

que sea pues queréis Mira por ejemplo

play06:44

aquí por ejemplo si quiero que los que

play06:46

estén dentro de Api Tengan algo especial

play06:48

Pese a que también son páginas a ver si

play06:51

esto a ver vamos a poner aquí que estos

play06:53

son components y tal si esto entro en

play06:55

Api por ejemplo Ah pues sí fijaos que

play06:59

cuanto más abajo está más relevancia

play07:01

tiene ves y ahí pues ya directamente

play07:03

tienes la información de que es parte de

play07:04

la Api está muy chulo me parece una

play07:06

novedad muy tremenda que al menos yo no

play07:08

tenía ni puñetera idea y que os puede

play07:10

ayudar a detectar mejor en la pestaña

play07:13

cómoo funciona cada cosa eso lo hacía ya

play07:14

nu emx Sí sí y los dinosaurios también

play07:17

lo hacía eh Qué pasó con Sublime Tex

play07:18

creo que ahí sigue el desarrollo de

play07:20

sublime Tex para el que no sepa es un

play07:22

editor de código va bastante bastante

play07:25

lento porque al final es un proyecto que

play07:27

no sé no sé si es un equipo no sé si es

play07:29

una persona no tengo ni idea aquí pone

play07:31

que es una empresa pero no sé si Cuánta

play07:33

gente trabaja en esta empresa la verdad

play07:35

Y sí que sé que han ido sacando nuevas

play07:37

versiones por ejemplo aquí tenéis la

play07:38

versión 4 y la sacaron el 24 de

play07:41

noviembre pero es difícil de saber si

play07:44

siguen activo o no Porque siempre las

play07:46

nuevas versiones han tardado mucho

play07:48

tiempo fijaos que desde la versión 3 a

play07:50

la cuatro pasaron meses fijaos aquí B

play07:53

4000 11 de noviembre del 2022 y la

play07:57

siguiente fue en agosto del 2023

play07:59

entonces Sublime es un editor muy rápido

play08:02

pero que digamos la velocidad de

play08:05

evolución no ha sido la misma que visual

play08:07

Studio code y por ejemplo todo el

play08:09

sistema de extensiones es mucho mucho

play08:12

mejor en visual Studio code tiene

play08:13

extensiones su lim tex pero no funciona

play08:16

igual de bien y también Es verdad que es

play08:18

de pago tienes que pagar una licencia

play08:20

entonces que lo tengáis en cuenta pero

play08:22

estaba muy chulo la verdad Ahora vamos a

play08:24

ver Z no Z será el próximo editor que yo

play08:27

creo que hay que estar pendiente a ver

play08:29

qué tal estaba guapo Sublime bueno

play08:30

Estaba y está lo que pasa es que ya os

play08:32

digo yo que se ha quedado un poco que le

play08:34

ha costado no le ha costado

Rate This

5.0 / 5 (0 votes)

Related Tags
Visual Studio CodeGit HistoryCustom TabsEditor UpdatesCode EnhancementsDeveloper ToolsSoftware DevelopmentVersion ControlGit GraphUser Interface