{"id":232005,"date":"2023-01-13T15:23:00","date_gmt":"2023-01-13T12:23:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=232005"},"modified":"2022-11-10T07:12:20","modified_gmt":"2022-11-10T04:12:20","slug":"5-extensiones-utiles-para-vs-code","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/es\/5-extensiones-utiles-para-vs-code\/","title":{"rendered":"5 extensiones \u00fatiles para VS Code"},"content":{"rendered":"

El \u00e9xito de VS Code y su r\u00e1pida adopci\u00f3n por parte de la comunidad de desarrolladores no solo se debe al hecho de que es un editor muy competente con herramientas \u00fatiles listas para usar, sino tambi\u00e9n a la vibrante comunidad de usuarios que crean m\u00faltiples herramientas \u00fatiles para trabajar mejor con \u00e9l. Repasemos cinco extensiones de VS Code cuidadosamente seleccionadas para mejorar la velocidad y la eficiencia de nuestro flujo de trabajo.<\/p>\n

Cliente REST<\/h2>\n

https:\/\/marketplace.visualstudio.com\/items?itemName=waderyan.gitblame<\/a><\/p>\n

Despu\u00e9s de cambiar a VS Code desde PhpStorm, lo primero que extra\u00f1\u00e9 fue el cliente REST integrado que ten\u00eda PhpStorm donde pod\u00eda escribir solicitudes en texto sin formato. Afortunadamente, esta extensi\u00f3n le permite realizar solicitudes de API REST directamente desde un editor de VS Code y obtener la respuesta. Simplemente tiene que iniciar un archivo en blanco, agregar la solicitud all\u00ed, cambiar su idioma a "http" y obtendr\u00e1 un bot\u00f3n en la parte superior del archivo que dice ENVIAR SOLICITUD en el que har\u00e1 clic para enviar la solicitud REST API desde dentro C\u00f3digo VS.<\/p>\n

Culpa integrada de Git<\/h2>\n

https:\/\/marketplace.visualstudio.com\/items?itemName=waderyan.gitblame<\/a><\/p>\n<\/p>\n

Esta extensi\u00f3n le permite ver qui\u00e9n comprometi\u00f3 qu\u00e9 en cada l\u00ednea de su editor. Si bien la extensi\u00f3n de Git Lens es m\u00e1s omnipresente, prefiero Git Blame porque no me gusta tener los mensajes de confirmaci\u00f3n, incluso si est\u00e1n difuminados, mezclados con mi c\u00f3digo como lo hace Git Lens. Esta extensi\u00f3n mostrar\u00e1 el confirmador en la barra de estado en la parte inferior, y cuando haga clic en \u00e9l, mostrar\u00e1 el mensaje de confirmaci\u00f3n con un enlace para saltar a la confirmaci\u00f3n en GitHub. Aqu\u00ed est\u00e1 mi propia captura de pantalla que muestra el enlace:<\/p>\n

\"5<\/a><\/p>\n

Colorizador de par de corchetes<\/h2>\n

https:\/\/marketplace.visualstudio.com\/items?itemName=CoenraadS.bracket-pair-colorizer-2<\/a><\/p>\n

\"5<\/a><\/p>\n

Es f\u00e1cil perderse en el c\u00f3digo tratando de averiguar qu\u00e9 par\u00e9ntesis coincide con cu\u00e1l. Esta extensi\u00f3n mostrar\u00e1 cada nivel de par\u00e9ntesis en un color diferente e incluso dibujar\u00e1 una l\u00ednea desde el par\u00e9ntesis de apertura hasta el de cierre para que siempre est\u00e9 al tanto del contexto en el que est\u00e1 trabajando.<\/p>\n

Resaltado de la sintaxis de JavaScript de Babel<\/h2>\n

https:\/\/marketplace.visualstudio.com\/items?itemName=mgmcdermott.vscode-language-babel<\/a><\/p>\n

\"5<\/a><\/p>\n

Esta extensi\u00f3n no solo resaltar\u00e1 las funciones de ES6 o ES7, sino que tambi\u00e9n resaltar\u00e1 correctamente el c\u00f3digo React, la sintaxis de GraphQL e incluso CSS en JS al estilo StyledComponents.<\/p>\n

Tema de color de VS Code<\/h2>\n

https:\/\/marketplace.visualstudio.com\/items?itemName=akamud.vscode-theme-onedark<\/a><\/p>\n

\"5<\/a><\/p>\n

\u00bfNo son dif\u00edciles de encontrar esquemas de color para el editor que se adapten perfectamente a nuestro gusto? Una vez que encontremos uno, no lo dejaremos ir hasta que aparezca uno mejor. El esquema de color que estoy usando actualmente y que me parece muy bueno es este, Atom One Dark, y combina bien con el tema del \u00edcono de Seti incluido en VS Code.<\/p>\n

Tu turno<\/h2>\n

\u00bfAlguna extensi\u00f3n que ames y quieras expresar p\u00fablicamente? \u00bfConoce uno similar a los que se muestran aqu\u00ed? \u00bfQuiz\u00e1s uno que hayas desarrollado? \u00a1H\u00e1zmelo saber en los comentarios!<\/p>\n

Fuente de grabaci\u00f3n: startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"

Cinco extensiones cuidadosamente seleccionadas para VS Code que mejorar\u00e1n la velocidad y la eficiencia de su flujo de trabajo.<\/p>\n","protected":false},"author":1,"featured_media":157430,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[892,716,914,790],"tags":[1172],"class_list":["post-232005","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codigo","category-desarrollador","category-otro","category-visual-studio-code-2","tag-affiai-es"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts\/232005","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/comments?post=232005"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts\/232005\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/media\/157430"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/media?parent=232005"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/categories?post=232005"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/tags?post=232005"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}