Transcripciones
1. Bienvenido a VS Code 101: un hermoso editor de códigos: Bienvenido a VS Code 101. Vamos a estar configurando el código VS para que se parezca mucho al mío, y se vea un poco mejor que el aspecto del código VS predeterminado. Vamos a repasar cosas como tu exploración, tus extensiones, cómo encontrar archivos, atajos aquí, cómo seleccionar código en múltiples spots y editarlo en tres lugares a la vez. Vamos a hablar de diferentes atajos. Cómo puedes acelerar tu tiempo, cómo puedes buscar a través de archivos, cómo puedes buscar a través de todo tu proyecto. Cuatro, por ejemplo, la palabra cliente, y aparece aquí, aquí, aquí y aquí. Y mira a través de todos tus diferentes archivos, no solo de un archivo a la vez y un montón de atajos de eficiencia
diferentes que uso hasta incluir pero no limitado a, tu terminal, cambiar tus tipos de archivos, diferentes extensiones usando tu Explorer, búsqueda
globalizada, y mucho, mucho más. Y al final de este curso, lo que vas a hacer es configurar tu VS Code para que se parezca mucho al mío. Y ese va a ser tu proyecto final. Hola, soy Caleb Italian y he estado enseñando a la gente cómo codificar es desde alrededor de 2012. He usado todo tipo de editores diferentes, incluyendo sublime VS Code, Bloc de notas Plus, Plus nano vim. Esos son editores de línea de comando y así sucesivamente y así sucesivamente. Me gusta mucho VS Code. Y en todos mis cursos me ves usar código VS en estos días. Y te voy a mostrar exactamente cómo lo consigo, configuración, qué extensiones uso, y los atajos que tiendo a usar. Entonces, ya sea que estés usando Windows, Mac o Linux, este curso va a ser para ti si
quieres usar el código VS ahora no tienes que usar el código VS. Puedes usar cualquier otro editor de texto, pero me gusta usar VS Code. Y en todos mis cursos vas a estar viendo el US VS Code. Gracias por afinarte y te veré adentro.
2. Cómo instalar un nuevo tema: Bienvenido a una hermosa instalación de código VS. Y entonces esto es lo que uso en casi todos mis cursos y he tenido miles de personas ahora me preguntan, Caleb, ¿qué tema usas un plugin para usar? Y me imaginé que sólo haría un curso al respecto porque tengo mucha gente haciendo esta pregunta y lleva mucho tiempo contestar esa pregunta una y otra vez cada día. Entonces lo primero es lo primero, sigamos adelante y abrimos VS Code. Si no tienes código VS, asegúrate de descargarlo y luego abre VS Code. Y así acabo de abrir VSCO y no hay nada aquí en este momento. Y entonces lo que quiero hacer es ir a View y luego extensiones. Entonces estoy en un Mac. Esto podría verse ligeramente diferente para ti si estás en Windows, pero va a verse muy, muy similar independientemente. Y así estas son todas mis extensiones que
tengo aquí dentro y pasaré por algunas de ellas. Pero antes que nada, tu código VS probablemente no se parezca al mío. El mío tiene este bonito tema azulado a ella. Entonces lo que quieres hacer para que el tuyo se vea como el mío está en tus Extensiones, escribe tema de material. Y ve aquí. Y se puede ver que tengo tema material instalado. Y así vas a querer instalar esto. Podría pedirte que reinicies VS Code. Si lo hace, está bien. Simplemente reinicia VS Code. Vuelve a esta página y luego puedes ir a establecer tema de color y puedes hacer clic en SetColor tema aquí. Y puedes desplazarte por estos y puedes ver los diferentes temas de color que te da. Y así algunas de estas son un poco feas, en mi opinión, o demasiado brillantes, eso es demasiado brillante para mis ojos. Por ejemplo. En realidad no me gusta este. A lo mejor sí. Y si lo haces, está bien. No tiene que VSCO no tiene que parecerse exactamente a la mía, pero la mía está configurada para usar Material. Tema, océano de alto contraste. Entonces no esta normal de aquí, sino la de alto contraste. Por lo que puedes ver algunos de los oscuros son un poco más oscuros. Entonces una vez que sigas adelante y pongas esa puesta en marcha en la siguiente lección te voy a mostrar es cómo puedo conseguir esta pequeña llama. En realidad eso no aparece realmente en la primera línea, pero esta pequeña llama, cada vez que escribo se pone un poco de llama arriba. Te voy a mostrar exactamente cómo lo habilito.
3. Cómo añadir íconos de temas: Muy bien, en el último video ahí dije que te iba a mostrar cómo configuré esta cosa de la llama. A algunas personas les gusta, a otras no. Si no te gusta, puedes simplemente saltarte. Pero en realidad lo que voy a hacer es que voy a secuestrar es menos de n
Voy a hablar de mis iconos. Y así tengo un simpático ícono aquí. Y si solo abro un nuevo proyecto, abramos este proyecto llamado vigilante. Y lo que tengo aquí está a la izquierda. Y si hago eso solo un toque más grande aquí para que podamos verlo. Debido a, debido a hacer extensión Python se actualizó. Enfriar, fresco, fresco, fresco. Entonces tengo estos bonitos iconos a la izquierda aquí. Y si tengo un archivo JS muestra un bonito archivo JS y
tengo un archivo HTML muestra bonito icono de archivo HTML. Muestra todo tipo de cosas aquí dentro. Y así la forma en que lo hago es en mis extensiones, puedo ir a iconos temáticos del material del MIT. Y así si solo instalas los iconos de Material Theme, set file icon theme, esto solo debería funcionar justo fuera de la caja para ello. Ya sabes, si esto no lo hace, es posible que solo necesites desplazarte aquí abajo y ver algunas de las instalaciones Introducción. ¿ Qué estamos viendo aquí? ¿ Tenemos algo útil? Sí, activa tu tema. Y luego se puede escribir tema de icono. Entonces si golpeo Command Shift P o si estás en Windows control shift P o Linux control shift P. Y entonces solo escriba Icon Theme. Puedo elegir Archivo Icon Theme. Y puedes elegir cuál quieres aquí. Y eventualmente cambiará. Si tal vez si hago esto, esto va a cambiar. Sí, esto cambia. Y para mí. Y entonces lo que me gusta hacer es que me gusta mi tema de material estándar, iconos, océano, y eso solo viene con este tema. Simplemente me gusta eso. Entonces si no tienes los iconos, quizá
quieras conseguir algunos iconos. Los iconos se ven bien.
4. Extensas populares para utilizar: Está bien. Hablemos de extensiones. Y tengo muchas extensiones instaladas. En realidad, revisé mi lista de extensiones y desinstalé un montón de ellas porque simplemente ya no las estaba usando. Y así vamos a seguir adelante y hacer esto un poco más grande para que podamos ver este bonito ícono aquí. Deshacernos de ese punto. Y así en primer lugar, uso corrector ortográfico codificado. Esto es realmente útil si solo estás tratando de escribir comentarios en tu código. Y no quieres hacer errores tipográficos, sobre todo si tienes un flujo de trabajo moderno en tu empresa o la futura empresa en la que vas a trabajar. Alguien va a revisar tu código y decir en realidad tienes un error tipográfico aquí y es sólo un dolor ellos. Pero para hacerlo, corrector ortográfico de
código me ayuda a asegurarme de que eso es básicamente que no tengo errores tipográficos. Ahora no es perfecto, pero funciona bastante bien. Código Python, yo ordeno, esto es para ordenar automáticamente mi importación. Entonces si me acerco a ver y me desplazo hasta la parte superior, esto podría importar automáticamente no son importadas, pero ordeno todos estos por defecto y no tengo que preocuparme por escribir estos en orden. Simplemente lo hace por mí. Tema material comunitario sin embargo ya repasamos eso o lo hicimos quizá no lo hicimos. Está bien. Entonces no creo que lo hiciéramos. Entonces, quizá hablemos de eso realmente rápido. Tema material. ¿ Dónde estás tema material? No uso la última versión porque no me gusta la última versión. me gusta una versión más antigua, solo me da colores más bonitos, creo que sí en lugar de usar rosa, usa amarillo. A mí me gusta el amarillo sólo porque está un poco más en mi cara. Es posible que necesites si quieres revertir a una versión anterior, usar tema de material comunitario. Yo uso esta cosa llamada Django templando. Por lo que siempre que estés trabajando en él, un archivo HTML de punto, puedes cambiar automáticamente ese archivo HTML de punto a un archivo HTML de Django. Y solo te da buena sintaxis resaltando. Dot n v es para variables de entorno solo te da resaltado de
sintaxis para variables de entorno. Editor config es realmente agradable. Entonces, si tienes un nuevo proyecto y solo lo clonas desde GitHub por ejemplo, podrías tener un archivo de configuración de punto Editor. Y así si dice que tus archivos JavaScript deberían tener cuatro espacios en lugar de dos espacios, básicamente
leerá esa regla y la honrará por ti. Entonces cada vez que golpees tab va a hacer dos espacios, son cuatro espacios o lo que sea que se configure en esa configuración del editor. Y para que no tengas que preocuparte por escribir diferentes códigos de diferentes personas o tener diferente sangría o espaciado. Si escribes Python, solo funciona automáticamente. Yo uso la gramática Lee, la extensión no oficial solo para ayudarme con algo de mi ortografía otra vez, sólo porque decenas de miles de palabras al día, probablemente cuando empiezas a hacer mucha codificación. Y solo quieres asegurarte de que estás escribiendo cosas que no tienen errores tipográficos que parecen algo inteligentes. Sólo porque al final del día podrías tener un poco de fatiga cerebral y Graham realmente te puede ayudar con ese cuaderno de Júpiter. En realidad no uso esto, pero sí creo que viene con el paquete Python estos días para VS Code. Y así si quisieras ejecutar jupyter dentro del código VS, absolutamente
podrías hacer eso. Yo no hago eso. Yo uso Júpiter fuera del código
VS sólo porque me gusta la experiencia completa. Pero absolutamente puedes hacer eso. Y si eres nuevo en Júpiter, te recomendaría usarlo. Dentro del código VS, es
realmente, muy bonito. Vista previa de rebajas. Esto solo me permite escribir markdown para que me guste si estoy trabajando en un repositorio git y estoy escribiendo un archivo Léame dot AMD. Y quiero ver si he cometido algún error o quiero ver si se ve medio decente, entonces podría simplemente previsualizar mi rebaja y todas las instrucciones están aquí también para ver cómo realmente hacer que esto funcione para ti. ¿Dónde estás aquí? A diez a la o, es la primera. Me salto justo más allá, comando K Y luego V, o control k Y luego V.
Y abre una vista previa a un lado, lo cual es realmente bonito y se desplaza a medida que se desplaza hacia abajo su código fuente también. Cosa material, hablamos de eso, material a las micras, hablamos de eso, modo de potencia. Este es realmente bonito. De verdad, de verdad me gusta esto. Sé que a algunas personas les disgustó absolutamente este. Entonces lo voy a hacer aquí es sólo cerrar un montón de estos. Y te voy a mostrar un modo de poder es. Entonces si abro este archivo aquí llamado vigilante, y solo hago un poco de mecanografía. Se puede ver esa pequeña llama por encima de mis letras y se puede hacer esa diferencia. E no tiene que ser una llama A veces, creo que todavía tenemos una explosión puesta aquí. Puedes ir por los ajustes y hacerlo como un jag de explosión o algo así. Eso es muy divertido. Puedes hacerlo realmente grande, puedes hacerlo realmente pequeño, alto, personalmente, gusta sólo porque, me dice dónde estoy escribiendo, ¿dónde estoy? Y sólo me da a mis ojos un poco de algo extra para meterme en buscarlo. También es bueno, creo que para muchos de mis alumnos que son como, oh, bueno, veo toda esta página de texto aquí. ¿ Dónde exactamente está escribiendo Caleb? Y así solo puedo hacer esto y es otra cosa
para que mis alumnos también echen un vistazo. Por lo que realmente, realmente me gusta el modo de poder. Pero sé que alrededor del 1% de las personas que miran mis cursos absolutamente no les gusta. Piensan que es demasiado distraído. Pero eso es sólo 1%. Y el modo de poder, creo, es muy divertido. Utilizo formateador de código más bonito. Ocasionalmente. Tiendo a usar esto en la línea de comandos un poco más de lo que uso en el código VS. Pero también puedes usar una extensión de formato de código más bonita. Y uso la extensión Python bastante fuerte porque soy desarrollador de Python. Y así vas a querer conseguir esto y sí, es de Microsoft. Si crees que Microsoft es una empresa de chatarra, bueno, en realidad hacen algunas cosas bastante buenas en estos días. Si eras un gran fan de Microsoft, entonces te va a encantar esto. Pero Microsoft hace VS Code y hizo la extensión Python y es realmente, muy buena. Y se puede ver que tiene más de 30 millones de descargas. La vista previa del rst se parece mucho a la vista previa de rebajas. Simplemente me ayuda con archivos RST para hacer árbol es realmente agradable. Entonces si abro los vigilantes dot py y escribo algo como signo numérica de tarea a hacer, haz una cosa. Simplemente lo resalta para mí. Entonces es más fácil de ver. Entonces si alguien más escribe una tarea pendiente en su código y estoy mirando su código, puedo ver fácilmente lo que eso haría se supone que es, y simplemente sobresale un poco más. Entonces me dice lo que posiblemente falta. Soporte de archivo vagabundo. Esto es sólo para que dot vaguer y archivos sean vagabundos o dot-dot-dot archivo vagabundo. Pero los archivos vagabundos, tipo de archivo tendrán algún tipo de resaltado de sintaxis. En realidad ya no uso esto. Entonces lo que voy a hacer es simplemente desinstalarlo. Ya no necesito eso. Y Jan ny arrow, esta es una complicada. No tengo ni idea de cómo deletrearlo, pero esto es bastante bueno. Ahora esto viene justo de Sublime. Y Scott ladra ha sido una persona con la que en realidad sé que solía trabajar. Portó esto de Sublime a VS Code. Y básicamente lo que hace es que te permite tomar pequeños atajos. Entonces, ya sabes, cuando tienes un nuevo archivo aquí, y vamos a cambiar esto a un archivo HTML de punto. Puedo escribir HTML. Colón cinco, hit tab y hace un montón de cosas aquí. Si cambio esto a una plantilla de Django, puedo escribir block, hit tab y automáticamente crea las cosas de plantillas para mí. Entonces eso es realmente, muy bonito. En realidad no uses demasiado esto. Lo uso para algunos de los atajos como como bloque o algunas de las etiquetas de plantilla. Pero es realmente, realmente poderoso y hay muchas cosas diferentes que puedes hacer aquí. Entonces esas son todas las extensiones que tiendo a usar a diario. A veces instalaré la extensión Docker, a veces simplemente la quitaré porque no la he usado en un tiempo. Las extensiones van y vienen. Pero estos son los primarios que tiendo a usar más o menos a diario.
5. Cómo uso personalmente el código VS: De acuerdo, vamos a dar un pequeño paseo rápido y ver cómo podemos utilizar VS Code. Ahora en realidad no uso VS Code a su máxima capacidad. Hay muchas cosas que el código VS puede hacer, y simplemente no lo necesito, así que no hago muchas cosas, pero te voy a mostrar exactamente cómo uso el código VS. Por lo que antes que nada, puedes ir a Ver e ir a tu explorador. Y si no tienes algo como esto, lo que puedes hacer es ir al archivo abierto y puedes abrir una carpeta completa. Entonces en lugar de solo seleccionar un archivo, lo que puedes hacer es no seleccionar nada y simplemente decir abrir esa carpeta entera. Y eso abrirá esta explora de la izquierda para ti. Y lo que esto hace es que te permite ver qué archivos hay a la izquierda dentro de esa carpeta. Aquí arriba, puedes crear un nuevo archivo si lo deseas. Puedes crear una carpeta nueva si quieres o,
o lo que suelo hacer es hacer clic derecho y voy a Nuevo Archivo. Y luego puedo escribir como nombre de
carpeta, nombre de carpeta barra, y eso creará automáticamente una carpeta para mí, nuevo archivo, 2.txt. Y esto crea nombre de carpeta con un nuevo archivo llamado TXT ahí dentro. Se puede eliminar. Por lo que solo puede hacer clic derecho y eliminarlo, o simplemente puede seleccionar un archivo. Entonces vamos a seleccionar nuevo archivo y golpear comando eliminar o controlar eliminar si estás en Windows, creo. Y lo borrará para ti también. Y si alguna vez quise cambiar el nombre de un archivo, pero podría hacer es solo hacer clic en uno de estos archivos. Y en lugar de estar enfocado aquí, estoy enfocado a la izquierda. Y simplemente puedo pulsar Enter y cambiar el nombre de este archivo. Cambiar el nombre de este archivo, pulsar enter de nuevo, y se le renombra. Y eso sólo me permite no tener que usar tanto mi ratón. Puedes refrescar tu Explorador. Honestamente nunca he necesitado hacer esto, ni una sola vez. Y si tienes carpetas abiertas, puedes derrumbarlas. Entonces sigamos adelante y creemos una nueva carpeta con un archivo llamado test.txt. A ver que aquí está abierto. A la izquierda. Si terminas trabajando en un proyecto más grande, podrías tener como 405060 carpetas y podrían terminar siendo abiertas si quieres cerrarlas todas, solo
hago clic que colapsa automáticamente todas por mí. Sigamos adelante y eliminemos eso. En la siguiente lección, echemos un vistazo a algunos de los atajos de archivos que me gusta usar mucho.
6. Movimiento a partir de Código VS: De acuerdo, entonces tengo algo de código aquí, y esto es solo algún código de código abierto que escribí sobre Navidad de 2020, solo para asegurarme de que un sitio web esté
funcionando 24-7 y comprueba cada sitio web una vez al minuto. Por lo que tengo un archivo de Python aquí y se puede ver mi bonito icono allí desde mi extensión de iconos de tema material. Si alguna vez quisieras, podrías bajar hasta abajo, abajo a la derecha. Y puedes cambiar el espaciado para usar ya sea espacios o pestañas depende de tu proyecto python. Pero la mayoría, la mayoría de los proyectos de Python usan para espacios. Y cada vez que golpeas tabulador, simplemente crea automáticamente esos espacios de poro para ti. Entonces si voy aquí abajo, no hay nada ahí. Si golpeo Tab 1234 y crea para mí espacios a la vez. Puedes cambiar el archivo haciendo clic en este python aquí abajo o en cualquier extensión que diga. Si estás usando un archivo HTML, va a decir HTML, o puedes cambiar lo que quieras que sea aquí. Entonces en lugar de Python, si dijera, oh, esto en realidad no es Python, esto en realidad es Java. Cambiará parte de la sintaxis para mí. Y esto es realmente genial para no escribir Java. Por lo que dice que quieres instalar la extensión recomendada para Java. Yo no, así que sólo voy a ignorar eso y voy a volver a poner esto a Python. Y eso me da un bonito resaltado de sintaxis basado en el lenguaje o scripting, lenguaje de
scripting que estoy escribiendo como HTML, CSS, JavaScript, Python, Django, cetera. Ahora yo personalmente, no uso mi terminal dentro del código VS con demasiada frecuencia, aunque definitivamente puedes. Entonces si vas a ver, entonces puedes bajar a la terminal. Tienes acceso a tu línea de comando aquí mismo. Entonces puedo hacer ls dash LA, o si estás en Windows, creo que solo es DIR. Entonces ls dash LA me muestra todos mis archivos y todas las cosas buenas ahí dentro. También puedes tener múltiples terminales aquí dentro. Si lo deseabas, puedes dividir tu terminal, puedes agregar una terminal, puedes eliminar una terminal. Esto es básicamente lo mismo que abrir comando o terminal en tu comando de computadora si estás en la terminal de Windows, si estás en una Mac, o bash, si estás en Linux, me olvidé de Linux. Sí, si estás en Linux, podría ser bash. Puedes hacerlo a pantalla completa si lo quisieras. ¿ A quién sigue mostrando tu expediente a la izquierda? Y puedes cerrarlo si quieres. Entonces no tiendo a usar eso con demasiada frecuencia, pero sí tiendo a usar eso cuando estoy grabando videos solo para que pueda golpear, por ejemplo, control tilde. Ese es el número al lado del signo uno, este pequeñito de ahí, ese icono raro o un personaje. Grabaré muchos videos con el terminal justo dentro del código VS. Entonces no tengo que voltear entre demasiados, demasiados programas. Pero de vez en cuando, simplemente no quiero, y en realidad quiero voltear entre los programas porque me gusta usar un terminal de varilla fuera de VS Code y me da un poco más de control. Y así puedo personalizar eso también. Pero para ti si solo lo quieres todo en una sola vista, lo que puedes hacer es simplemente ir a View terminal y puedes tener tu línea de comandos a tu disposición mientras escribes tu código. En el siguiente video te voy a mostrar algunos de los atajos que uso.
7. Atajos: De acuerdo, entonces lo que estoy editando un archivo, te darás cuenta en muchos de mis videos, realidad no uso tanto mi ratón. Y lo bonito de eso es que solo puedo mantener mis manos en mi teclado y no tengo que moverme. Entonces lo primero es que uso mucho mis teclas de flecha. Arriba y abajo, izquierda y derecha. Cuando estoy en una nueva línea en un Mac, al
menos golpeo comando y puedo ir a la izquierda o a la derecha y sólo me lleva a cualquiera de los extremos de esa línea. Eso sólo me permite encontrar, no bien, sino colocar mi cursor en algún lugar más cerca de donde quiero que esté. Entonces si quería cambiar esta r por aquí en lugar de presionar y sostener mi flecha y luego seleccionarla, lo que podría hacer es que puedo ir por aquí y luego puedo golpear opción izquierda, izquierda, izquierda. Y esto mueve palabra por palabra. Y eso es mucho más rápido que tener que hacer esto, sólo esperando que se vaya desde la izquierda. O si ya estoy en el extremo derecho, presionándolo y sosteniéndolo justo a la izquierda, izquierda, izquierda, izquierda o Shift escribe para seleccionar un personaje o una serie de caracteres, y entonces puedes eliminarlo si lo quisieras. Ahora hay mucha sangría en Python y HTML, y JavaScript, y PHP en CSS
y prácticamente todos los lenguajes de programación y lenguajes de scripting por ahí. Y así a veces se quiere poder sangrar y salir guaridas con bastante rapidez. Entonces lo que me gusta hacer aquí es en mi Mac, golpeo comando y luego uno de los símbolos. Entonces, ya sea ese o ese uno a uno de estos dos. Por lo que comando izquierda corchete densa. Comando, corchete derecho en denso. Y solo puedes seguir haciendo esto una y otra vez. Y esencialmente esto solo te permite seleccionar un montón de texto y salir abollar o sangrar todo a la vez. Entonces lo que hice aquí fue ir a esta línea,
fui a la p, golpeé turno abajo,
abajo, hit command out bracket, mando en corchete, mando,
o corchete , mando en corchete. Ahora amigo windows, obviamente no tienes una tecla de comando. Es probable que sea control o alt para ti. En realidad no puedo recordar desde la parte superior de mi cabeza. No he estado en una máquina Windows en un poco, pero va a ser soporte controlado o soporte alt. Ahora otra cosa que me gusta hacer mucho es cuando estoy trabajando con múltiples piezas de código que son muy, muy, muy similares. Y quiero copiar y pegar un montón de cosas. Lo que puedes hacer es seleccionar todo esto. Y puedes hacer Control C o Comando C y luego solo lo copia. Y entonces puedes hacer el control V o el Comando V como inviolable. Y eso pega todo una y otra vez. Pero a veces quieres pegar una línea entera y en realidad no pego, copio y pego cosas individuales como esta con
demasiada frecuencia tiendo a copiar y pegar y toda la línea. Entonces lo que hago es no seleccionar nada aquí, y acabo de golpear Control C o Comando C. Y eso en secreto detrás de las escenas copia toda la línea. Y luego golpeó al Comando V o al control V como inviolable. Y solo puedes golpear pegar una y otra y otra vez. Y seleccionará todo ese espaciado más la nueva línea para ti. Entonces lo que puedo hacer es subir aquí fuera abolladura incidentalmente, y acabo de golpear Eliminar allá. Otra cosa que me gustaría hacer es cuando estoy en una línea, si quiero borrar toda la línea, sólo porque mis dedos tienden a desplazarse un poco más
hacia el lado izquierdo de mi teclado. Voy a presionar Command o Control X para eliminar una línea completa. Entonces digamos que aquí quería eliminar la línea 27. Simplemente puedo golpear Control X. No
tengo ningún personaje seleccionado. Si tú, si tienes un personaje seleccionado y lo borras, solo va a recortar ese texto. Entonces vamos a Controlar Z o Comando Z para deshacer y Controlar o Comando X. Y no tengamos nada destacado aquí, que es Control o Comando X en toda esta línea. Y corta toda esa línea. Y entonces puedo pegarlo una y otra vez. Una cosa más que realmente me gusta hacer es, ya
sabes, si estoy en una línea, si estoy en medio de una línea y quiero borrarla. Simplemente golpearé accidente de mando o control. Borra toda la línea para mí. Ocasionalmente no quiero hacer eso. Ocasionalmente quiero desplazar alt y luego seleccionar múltiples palabras. Y entonces solo puedo presionar borrar y eliminar todo de una vez. Y lo bueno de eso es que solo estás golpeando Shift Alt, izquierda, izquierda, izquierda, y eso lo elimina o selecciona todo. Y luego solo puedes eliminarlo. En lugar de hacer eliminar, eliminar, eliminar, eliminar, eliminar, eliminar, eliminar, eliminar, eliminar, eliminar, eliminar. Es sólo menos pulsaciones de teclado de esa manera. último pero no menos importante, pasé brevemente este control Z o Comando Z o Z, va a ser tu mejor amigo. Y esto simplemente deshace algo. Entonces si entré aquí y accidentalmente de alguna manera eliminé esto y no recuerdo lo que había en su file.js. No sé qué está pasando ahí. Siempre puedo golpear Command Z para deshacer mi último trabajo y puedes seguir haciendo eso una y otra vez. Entonces va a seguir pegando al Comando Z. Y ya puedes ver todas las cosas que he estado haciendo en este video. último pero no menos importante, a veces me gusta entrar en modo de pantalla dividida. Por lo que hago clic en este pequeño, este Split Editor. Y esto me permite, bueno, si abro otro archivo aquí, si abro n, Por
ejemplo, puedo cerrar eso hacia abajo y puedo tener mi archivo python a la izquierda, y puedo tener mi archivo dot M a la derecha. Entonces si estoy leyendo a través de este código y soy como el Twilio SID es la config. Twilio SID. Qué es lo que puedo mirar justo aquí, Twilio SID es AC y luego un puñado de estrellas. Y si alguna vez quieres cerrarla, puedes simplemente cerrar todos los archivos dentro de esa división y vuelve a la normalidad y puedes dividirte varias veces si quieres. Al igual que esto, eso se pone un poco duro. En realidad no me dividiría más de una vez sólo porque me gustan mucho los bienes raíces. No me gusta mi, mi editor luciendo demasiado lleno, sobre todo una vez que le agregas un terminal, empieza a parecer
que hay mucho ahí dentro.
8. Cómo gestionar tus archivos mientras: De acuerdo, echemos un vistazo a tratar con algunos nuevos archivos. Entonces, antes que nada, si abres un archivo por aquí, hay una forma más rápida de cerrarlo. Entonces, idealmente, no me gusta usar mi ratón
tanto como a mucha gente lo hace sólo porque usar tu ratón es, es lento. Tienes que hacerlo, tienes que ponerte la mano más. Tienes que moverlo y averiguar dónde está. Entonces tienes que lago realmente colocarlo aquí y creerlo o no, después de ocho horas de codificación todo el día, eso te puede quitar mucha energía cerebral. O lo que puedes hacer es en lugar de cerrarlo haciendo clic en esa X en tu comando o en tu teclado, puedes presionar Comando W o puedes subir a Archivo, Cerrar editor, cerrar ventana. Lo que quiero hacer es simplemente cerrar este archivo en particular. Entonces golpeé Command W, Podría ser control y W para ti si estás en Windows, acabo de golpear Command W, cierra ese archivo por mí. Puedes volver a abrir ese archivo, y puedo cerrarlo con Command W. Ahora si quiero buscar un archivo, puedo presionar Command P o controlar P. Y solo puedo escribir un nombre de archivo y esto solo me deja buscar cosas. Para que pudiera escribir un y digamos que quería buscar todos mis archivos Python. Podría escribir punto p y, y hace una búsqueda a través de todos mis archivos desde mis archivos Python, y simplemente puedo presionar enter y abre ese archivo. Entonces ahora no tengo que mirar por aquí porque esto lleva mucho tiempo. Yo, he visto nuevos desarrolladores pasar horas fuera de su día sólo mirando a través de archivos aquí,
especialmente en proyectos más grandes. Y son como, de acuerdo, ¿qué no hay en esta carpeta? tanto que vigilante a phi dot py, ¿está en otra carpeta? No, no está ahí dentro. ¿ Dónde está? Hay una forma más fácil de hacerlo. Puedes hacer una búsqueda global de archivos con Control o Command P, y solo escribes tu nombre de archivo o una parte parcial de tu nombre de archivo. Para que pudiera teclear reloj, y se encuentra vigilante dot pi para mí. Y eso va a liberar mucho de tu tiempo. Cuando estamos creando nuevos archivos. También podemos ir archivo nuevo. Y eso está bien. Pero esa es una especie de la forma lenta de hacerlo. Y de nuevo, eso es usar nuestro ratón, pero me gusta hacer es si vas al archivo, puedes ver archivo, nuevo archivo. Es solo Control o Command N. Espero que vuelva a ser control en Windows, ha pasado un poco desde que estoy en Windows. Pero Control N va a crear un nuevo archivo una y otra vez. Y podemos simplemente eliminarlos con Control o Command W. Ahora si quiero cambiar este archivo sin guardarlo, si digamos, digamos que tengo algo de HTML aquí. Este es un H1. Si no sabes qué es eso, está bien. Esto es solo HTML y todo es gris y no queremos que sea todo gris. Digamos que queremos algo de resaltado de sintaxis, que básicamente va a seleccionar esto y esto y hacer que el interior se vea como algo diferente. Podemos guardar esto como un HTML de punto. Entonces Archivo Guardar o comando S o Control S. Y eso va a salvar esto. Guardemos este archivo. O puedes bajar aquí, texto
plano, y puedes seleccionar tu archivo. De nuevo, puedes hacer esto con un atajo o simplemente
puedes ir directamente hacia abajo a la derecha. No es muy a menudo realmente vas a necesitar hacer eso con tu ratón. Ve hacia abajo a la derecha porque el código VS es
lo suficientemente inteligente como para detectar qué tipo de archivo quieres. Tan pronto como guardes esto como un archivo HTML de puntos, automáticamente
lo establecerá como HTML de punto.
9. Diferentes "vistas" en el código VS: De acuerdo, hablemos de puntos de vista. Entonces si subimos aquí, podemos ir a ver y podemos ver todo tipo de cosas diferentes aquí dentro. Ahora, honestamente no uso demasiado de esto. Realmente solo uso la búsqueda y extensiones de Explorer en su mayor parte. Entonces esta es mi pequeña barra lateral aquí. Y yo puedo deshacerme de esto. Simplemente chasquearlo cerrado. Y puedo ir a File y decir explorer, y eso abre eso. También hay atajos para esto. Entonces si quieres abrir tu explorador para mí, es turno de comando E y eso simplemente lo abre. Entonces si vuelvo a cerrar esto, pon mi ratón justo en el medio para que lo sepas, no estoy haciendo nada. Comando Turno E, sólo lo abre para mí. También hay extensiones de las que hablamos al principio mismo de esta lista, módulo o curso
VS Code o un tutorial. Y hay terminal. Ahora hay un montón de otras cosas aquí y
puedes cambiar tu apariencia, tu diseño de editor. Ah, una cosa que me gusta hacer con mi apariencia es que me gusta mostrar mi Sidebar y mi barra de estado, pero realmente no me gusta mostrar mi barra de actividades ni mi panel. Entonces si solo quieres ver cómo se ve esto, es solo tu panel ahí abajo y
ahí es donde puedes ver como tu terminal y cosas así. No me gustan demasiadas cosas abiertas. Me gusta poder enfocarme en el código. Entonces si esto alguna vez se cierra y estás como, bueno, no sé a dónde fue eso. Siempre puedes ir a Ver extensiones o Búsqueda de Explorador. Hablaremos de búsqueda en el siguiente video. Yo solo tiendo a abrir explorer porque ahí es donde están la mayoría de mis archivos y eso es lo que quiero estar viendo ya que quería ver mis archivos a mi izquierda.
10. Búsqueda local y global: De acuerdo, así que vamos a cerrar este archivo y hablemos de búsqueda. Entonces si vamos a View Search o Command Shift F, Esto me va a dejar buscar algo aquí dentro. Y puedo buscar a través de todos mis archivos o un archivo individual. Entonces volvamos a nuestro explorador aquí. Y lo que puedo hacer es que si abro, miro tu punto py y pincho dentro de aquí, puedo golpear
Command F. Y esto sólo va a hacer una búsqueda regular de la palabra cliente. Y me muestra, aparece tres veces tu 123. Pero si golpeo Comando Shift después de Control Shift F, o simplemente entro aquí y voy a buscar. Puedes buscar contenido dentro de tu archivo. Entonces si tipeo en cliente, me
va a mostrar todas estas cosas diferentes cerca del phi hacer. Digamos que un. aparece con todo tipo de cosas aquí dentro. Y luego puedo usar archivos para excluir o archivos para incluir los archivos a incluir. Si quisiera incluir archivos dot py, podría hacer star dot py y archivos para excluir si
quería incluir todos los archivos Python excepto mi punto de agua pi, me pongo simplemente decir ignore watcher dot py y aparece, no aparece nada sin nada. También soporta read x, que tiendo a no usar con demasiada frecuencia, solo porque realmente no lo necesitas. Entonces si busco todas las instancias de la palabra print, puedo ver que la impresión aparece en mi proyecto a través de todos los archivos dos veces. Observación y contenido. Ahí es donde está. Observación y contenido. Si quiero ver en todas partes que estoy usando la palabra config, solo
puedo escribir config, y solo tengo un archivo aquí que está usando la palabra config, pero aparece cinco veces 12345. Y esa es una manera realmente buena de mirar a través de todos tus archivos para un texto en particular. Entonces de esta manera no estás pasando por todos los archivos. Comando F buscando una palabra, buscando una palabra, buscando una palabra. Y así asegúrese de utilizar la funcionalidad de búsqueda de la mejor manera posible. Te va a ahorrar mucho tiempo. Entonces recuerda cuando estás buscando en un archivo, solo mandas o controlas a F. Y eso buscará en la parte superior justo por aquí. Si estás buscando a través de todos tus archivos, es turno de comando después de Control Shift F. Y puedes buscar en todos tus archivos unas palabras en particular. Digamos que hash aparece con hash aquí en todas las diferentes instancias de donde se puede ver la palabra hash.
11. Typing en dos lugares a una vez: Está bien. Entonces me sale mucho esta pregunta. Casi tan a menudo como mató con fémur usando. Y esa pregunta es, ¿cómo escribo en múltiples lugares al mismo tiempo? Y así hay dos cosas que quiero cubrir en este video es, primero que nada, puedo hacer click en lago al final de esta línea y luego golpear Control y click. O si estás en Windows, probablemente sea alt click o control-click. Estoy en Mac, así que es comando click. Y creo que podría haber dicho control al principio, quise decir comando en Mac, es comando en Windows probablemente es control o alt. Y así solo hago click en todos estos diferentes spots. Y puedo escribir algo aquí. Y funciona exactamente de la misma manera que tu cursor regular. Para poder seleccionar todos estos todos a la vez, y puedo eliminarlos todos a la vez. Entonces eso es todo lo que hay para, eso requiere poco de práctica para llegar realmente bueno en ello. Tenía que saber que estás escribiendo lo mismo en dos spots diferentes. Pero esa es una manera realmente buena de acelerar tu tiempo cuando estás codificando. Otra cosa que la gente pregunta es, ¿cómo selecciono básicamente la siguiente ocurrencia? Y así si escribo la palabra config y digamos que tenía un tipografía aquí. Así que solo seleccionemos todos estos y solo comando clicé en esos. Y si escribo es igual a, nota que eso no es lo que quiero hacer. Deshacer. Y si es así, digamos que tenía un tipografía ahí dentro y quería cambiar todos estos. Yo puedo seleccionar ese primero y se puede ver que estos otros están seleccionados. Puedo ir a Selección. Agrega siguiente ocurrencia, que para mí es Comando D. Y que así como esa siguiente ocurrencia, lo
puedo volver a hacer, agrega esa siguiente ocurrencia. Entonces no tengo que hacer doble clic en este comando o control o alt, hacer doble clic en esa misma cosa, hacer doble clic en eso. Lo que puede hacer es simplemente hacer doble clic en éste. Y si conozco el siguiente es el que quiero Comando D o Control D o L D, dependiendo de tu configuración. Y luego vuelvo a hacer Comando D y seleccionarlos todos. Y lo que puedo hacer es simplemente eliminar eso y escribir config en los tres spots al mismo tiempo.
12. TU PROYECTO: Está bien. Entonces nos repasamos mucho. Siéntete libre de robar prácticamente cualquier cosa que esté usando. Todo lo que estoy usando es completamente gratuito. No estoy usando ninguna fuente de fantasía ni nada por el estilo. Simplemente me encontré con un bonito tema que me gustó mucho que al parecer a mucha otra gente le gusta. Entonces lo que me gustaría que hicieras por tu proyecto es configurar tu VS Code para que se parezca al mío. Y quiero que me muestres qué extensiones tienes instaladas. Entonces si hago esto más grande, podemos ver que estos pequeños iconos aparecen. Por lo que deberías estar usando un tema diferente, no el predeterminado de VS Code, sino un tema diferente. Estoy usando tema material, puedes usar cualquier otro tema que te guste. Oye, si quieres copiarme por completo, Eso es totalmente ALK. Y luego solo quiero que hagas una captura de pantalla de tu código VS siendo abierto. No tiene que tener ningún código abierto. No digamos eso. No tiene que tener ningún código abierto. Y sólo muéstrame qué tipo de extensiones pasas ahí. Te recomendaría encarecidamente que llegues al menos a la extensión Python. Si quieres un poco de diversión. La extensión del modo de potencia, la extensión del tema del material y los iconos del tema del material, la extensión. ¿ Y qué más para empezar? A lo mejor el tema material de la comunidad si quieres usar ese también. Y eso es todo. Eso es todo lo que realmente necesitas al principio. O tal vez para hacer árbol. Esta es una divertida. A mí me gusta mucho ese. Así que adelante e instala un nuevo tema y las extensiones que quieras, luego tomar una captura de pantalla de tu Código VS y compártelo con la clase abajo. Y quería ver qué has configurado y cómo estás usando VS Code. Y puede ser completamente diferente. Podrías estar usando diferentes extensiones. Podrías estar usando un tema diferente, o podría ser exactamente el mismo. Se puede simplemente copiar literalmente todo lo que tengo. Eso también está bien. Pero asegúrate de tomar una captura de pantalla de tu código VS con tus extensiones abiertas. Toma una captura de pantalla de todo el asunto y compártelo con la clase abajo. Gracias por ver esto. Yo he estado Caleb contando a tu instructor. Vas a ver un montón de contenido diferente de mí. Y esta es la configuración exacta que uso.
Kalob Taulien, Web Development Teacher
