Aprende a relacionarte con el CLI y descubre todas las cosas que puedes hacer en este tutorial de introducción.
Descarga VS Code https://code.visualstudio.com/download
Cómprame un café https://www.buymeacoffee.com/javascriptes
——————-TRANSCRIPCIÓN——————
[Música] hola mi nombre es rey bienvenido hallaba script ecosistema y en este vídeo aprenderás a utilizar el cielo y comencemos y antes de continuar te recuerdo que puedes visitar javascript ese punto com para que mires este tutorial en escrito ahora comencemos con la pregunta que es el cielo el cielo y.
Son las palabras en inglés para command line interface o en español interfaz para línea de comando ok nos preguntamos cómo se instala el cielo pues la buena noticia es que el cielo ya viene instalado por defecto tanto en mac como en windows la interfaz sigue la y por defecto en mac se llama terminal y en windows command prompt ok en este.
Tutorial vamos a estar utilizando la mac tengo entendido que son bien similares aunque hay algunas cosas en las que difieren en este tutorial estaremos utilizando una mac y la pregunta para comenzar con el código es que se puede hacer con un cielo con un síguela y se pueden ser un sinnúmero de cosas pero hoy vamos a.
Estar en lo básico que es crear eliminar mover documentos usualmente como lo haríamos con nuestro mouse y también se pueden instalar paquetes o dependencias de nuevo james verdad y se puede hacer mucho mucho más por ejemplo el react tiene su propio cielo y tú pones unos comandos de react luego de que esté instalado y puedes crear la aplicación.
Inicial de riad por ejemplo también podemos con el cielo y podemos enviar un repositorio a kid hope y muchas muchas cosas más pero en esta clase para que tengamos ya una familiaridad con el cielo vamos a comenzar desde lo básico a manipular los nuestros documentos ok bien así que comenzamos aquí estoy en mi escritorio y vamos a comenzar abriendo.
Lo que es el terminal el terminal es esta pantallita que está aquí la voy a hacer grande para que la puedan ver ok esto es un cielo que ya viene con instrucciones predeterminadas que nosotros podemos utilizar para nuestro beneficio si miramos este síguela y tiene esta cadena de texto que comienza con rey esto quiere decir que yo estoy.
En el directorio rey voy a mover esto a un lado para mostrarles en donde estoy dentro de lo que es la carpeta que creo que lo tengo en el otro monitor por acá vamos a acomodarlo para este lado para que todos lo puedan ver ok bien entonces si nos fijamos yo tengo mi carpeta de.
Rey aquí en los favoritos para tener un acceso rápido a esta carpeta tiene un nombre que es el nombre de lo que es mi computadora accidentalmente puse eso no quería hacer eso pero tiene el nombre de lo que es mi computadora no sé por qué puso más venido porque solamente tengo una pero este es esta carpeta ok entonces digamos que yo quiero lo.
Primero que quiero hacer es verificar qué directorios y documentos tengo en la carpeta de rey entonces con el comando se supone que aparezcan todos estos documentos que están aquí ok para hacer eso oprimimos ls ls quiere decir list directory o enlistar el directorio y oprimimos enter y por supuesto que estas aplicaciones o estas carpetas quiero.
Decir son las mismas que tengo en este lado ok entonces así es que tú verificas los documentos que tienes en el directorio porque queremos verificar los documentos tenemos en el directorio tal vez ya lo sabemos pero tal vez no y queremos estar seguro ahora por ejemplo si aquí tal vez no sabías esto tú quieres ver lo que son.
Los documentos y los directorios ocultos que hay dentro del directorio rey que es el usuario principal de la computadora pues nosotros oprimimos la tecla shift comando y el aro derecho ahí automáticamente me aparecen todos los directorios que se encuentran ocultos si queremos ver eso aquí porque vimos que cuando escribimos ls no aparecía todo lo.
Que tenemos que hacer es añadir el tag das a me explico listar el directorio o lista director y am y das a primo agente y ahora sí que me aparecen todos esos documentos que estaban ocultos o que están ocultos aquí de la misma manera para ocultarlos nuevamente oprimimos shift comando y tecla a la derecha ahora si ya se nos.
Llena podemos por ejemplo podemos poner más cosas aquí y seguir es haciendo es crowd pero si queremos aclarar el terminal lo que tenemos que hacer es escribir clean clear ok así es que está clara el terminal en la mac ok ya sabemos verificar que directorios están dentro de un directorio o qué documento porque.
También aparecen los documentos ahora queremos movernos a otro directorio queremos movernos al directorio texto si por ejemplo hacemos esto vemos que el directorio existe si el directorio existe podemos cambiar de directorio a texto supongamos que no es que que que nos equivocamos escribimos algo mal y en vez de escribir desktop escribimos desk.
Me va a traer un error me va a decir no existe el directorio o el documento que falta el documento directorio documento ok entonces para cambiar de directorio vamos a decir que queremos cambiar a texto una vez más sólo tenemos que escribir es cede perdón sé de qué que decir sin directory y escribir el nombre de lo que es el documento.
O el directorio quiero decir porque estamos cambiando el directorio james al rector y a texto ahí es donde queremos ir ok entonces en texto ahora estamos aquí si yo cierro esto por ejemplo yo cierro esto aquí no tengo nada solamente tengo estos dos estos dos carpetas los discos duros no aparecen en lo que es la lista si por ejemplo escribo ls ahora.
Que estoy en el texto ves que aquí me lo dice estoy en el texto ls oprimo -entre me aparece la carpeta de la carpeta others que es otros ok entonces digamos que ahora yo quiero crear un directorio ya sabemos que concede y el nombre me cambio si yo quiero sede de entró al directorio de ok si yo quiero regresar.
Hacia atrás vamos al escritorio nuevamente le doy cd y le doy dos puntos es como envíes code cuando estás haciendo una referencia en documento que está a un nivel más alto ok el cdh inter vector y dos puntos quiere decir al directorio padre ok ahora en texto lo que yo quiero ahora hacer es crear un documento soy yo.
Quiero escribir perdón crear un directorio para crear un director nuevo escribimos mk de y&r que quiere decir make director y ok oprimimos enter y me sale un error porque no escribí nada entonces yo quiero que ceda electro y se llama si él hay ok ahora cuando el primo inter me aparece él el directorio si el jockey que es donde.
Yo quiero entrar ahora yo quiero entrar a este directorio y quiero abrirlo desde el comando interface si te fijas estamos hablando de que con solo cadenas de texto podemos enviar comandos a la computadora para que haga lo que nosotros queremos hacer y si yo quiero entrar a este directorio como ya bien dije anteriormente simplemente.
Pongo cd y si el hay ahora yo quiero que ese documento sigue like se abra entonces todo lo que tengo que hacer es por ejemplo esto es un cielo que es de pies con todo lo que tengo que hacer es escribir code porque ya está predeterminado y está instalado y el punto el punto quiere decir que ese directorio quiero abrirlo completo.
Entonces va a abrir envíes code y así es que tú abres una carpeta dentro de riesgos y esperamos ya había es como de está abriendo o qué y vamos a ver que tenemos la carpeta que vamos a poner un poco más pequeños cerramos esto y vemos que esto está vacío porque no hemos hecho nada ahora que queremos hacer ahora ya que estamos.
En el directorio sigue like lo que queremos hacer ahora es crear documentos en este caso digamos que yo quiero crear un documento de index y un documento de contacto pues eso se hace de la siguiente manera para crear un documento muy fácil escribimos todos ok en español es tocar no sé cuál es la lógica del nombre pero escribimos touch y luego.
Escribimos el fallo que queremos crear en este caso un index index este e-mail ves que la fila el documento se creó ahora algo que quiero mostrarte ahora es cómo hacer múltiples comandos no perdón como escribir múltiples documentos y es bien fácil otra cosa si yo quiero ir a.
Por ejemplo yo quiero en lugar de escribir todo esto solamente es oprimo el aro hacia arriba y me vuelve al último que ya escribí y así mismo si vuelvo oprimo al que estaba antes de eso y así por el estilo entonces vamos hacia arriba porque ahora yo quiero crear digamos una un documento de nosotros html y quiero mostrarte cómo se hace más.
De más de un documento pues la misma lo único que tienes que hacer es poner un espacio porque html espacio y ahora escribir contacto html oprime gente y se crean los dos fallos aunque los tenemos ahí ahora digamos que queremos hacer un directorio de assets para las imágenes y un directorio de js y un directorio de.
Css para lo que ya va script y para lo que es css eso se hace de la siguiente manera made al vector y de la misma manera que lo hicimos anteriormente y simplemente escribimos el nombre de los directorios que queremos crear dentro de lo que es la carpetas y el like css js y vamos a poner img para las imágenes ok entonces.
Le damos enter y automáticamente se crean los documentos ok digamos que ahora yo quiero cambiar de documentos para js por ejemplo y ahí yo quiero crear un documento estilos css y luego quiero regresar aquí a la raíz al rut para luego ir a js y escribir main js como yo puedo hacer.
Eso con un solo comando o más bien con una sola cadena de texto pues nosotros podemos unir varios comandos en una sola cadena de texto utilizando lo que es y okay parecido a como utilizamos javascript en los que son operadores ternarios por ejemplo por queremos ir a cambiar change de director y css y para añadir otro comando cuando estemos ahí y.
Lo que quiero hacer es crear un file perdón crear un file estilos css y ahora quiero regresar cede dos puntos para subir un nivel y quiero ir a javascript ok que este factor que está aquí y ahora quiero oír perdón quiero crear un file que se llama main js y ahora quiero.
Regresar a arriba cuando yo lo de adelante esto indica que tiene más de un comando si tiene uno tiene un comando dos comandos tres comandos cuatro comandos cinco comandos en una sola cadena de texto vamos a ver si funciona y vimos que no pasó nada porque no creamos nada en el root pero si verificamos el force css tenemos la hoja.
De estilos y si verificamos aquí tenemos el main de js no sé porque se creó este file vamos a verificar si dice s s este punto css luego subimos luego cede j s y touch main ustedes dice de o es que aquí le puse le puse le puse sidi y se me olvidó ponerle.
El ok son cosas que pasan en realidad son cosas que pasan son tipos que van a ocurrir y por lo tanto si se fija por ese tipo no subió de nivel se supone que aquí hubiera un am percent que es este signo ve y como no puse el signo lo que hizo fue que creó main js y un file pero como el file no tienes extensión si por.
Ejemplo éste está un fallo y lo quiero probar ahora cede html punto html b si fuera un forest no aparecía así ahora si yo quiero volver al blood simplemente lo hago de la manera correcta así que prácticamente así es como tú utilizas el.
Cje light para manipular files por ejemplo con el mismo sigue light nosotros podemos utilizar no leyes y esto es un ejemplo y con esto terminamos porque no quiero extender mucho este vídeo si por ejemplo yo quiero declarar vamos a asumir que ya tenemos no llegues.
Instalado en la computadora si no lo tienes debería de instalarlo porque es muy útil para hacer cualquier tipo de trabajo yo escribo en pie in its ok en pie quiere decir no x management o manejo de paquetes de nombre paquetes son módulos código que otra gente escribe para que nosotros saquemos provecho a eso para.
Que hagamos las cosas más fáciles etcétera pues para iniciar un ambiente de naut escribimos npm in its ok me va a hacer unas preguntas el paquete se llama síguela pero puedes ponerle cualquier nombre que tú quieras pero yo lo voy a dejar así la versión de tu código la descripción si el tutorial por ejemplo el entry point e index vamos.
A ponerle index.jsp por ejemplo asumiendo que vamos a escribir un servidor el código del servidor con no leyes y textos de comando realidad esto no importa ahora mismo si no tienen toda esa información solamente para que para que veas qué cosa ahí y este paquete es lo que se crea.
Confirmamos que todo esté bien quiero decir este documento que es un documento de jason ok ahora mismo tengo esto supergigante un poquito para que lo puedan ver ok y básicamente todo lo que durante ese momento hicimos pues se encuentra aquí ok ahora con el cielo podemos instalar paquetes por ejemplo vamos a decir que.
Yo quiero comenzar un servidor de express ok yo le doy a empleen install express y vemos que se crea esta carpeta esto que se llama notebooks que contiene todas las dependencias que requiere express ok entonces digamos que yo quiero vamos a limpiar.
Esto player vamos a crear index punto y es que si vemos que todo todo lo estamos haciendo el terminal prácticamente vamos a crear un servidor rapidito const ex express y cuales vamos a cerrar este comando b carriquiry express.
Como después de hacerlo ok con su app es igual a express ok después vamos a poner con sports que es el puesto donde vamos a correr el servidor con esta parte vamos a poner que 800 2 listen vamos a poner que es en el puerto.
I [Música] aquí vamos a hacer una función para imprimir en la con solá el app está corriendo en el puerto por ejemplo ok entonces en beat scout si por ejemplo en lugar de estar aquí y.
Esto es otra cosa que le quería mostrar para los que no saben ponemos control shift y el back ticks ok y esto nos va a abrir el terminal es si vemos el terminal nos abre en el directorio raíz en este caso el zelai quiere decir que todos los comandos que hagamos aquí aplican a este directorio que acabo de abril y que es lo que hemos creado ok.
Ahora por el momento voy a hacer real esto porque ese el terminal integrado prácticamente hace lo mismo ok digamos que ahora vamos a suponer que yo quiero abdo gates iba a ser la raíz request response si no sabe mucho de.
Esto no te preocupes esto más bien para mostrarte vamos a vamos a ver simplemente decir ay ay ok qué quiere decir que ahora aquí en paquetes de jason en scripts esto es lo que está relacionado al terminal scripts vamos a escribir def.
Ok te voy a mostrar ya mismo no teman de phnom un es otra dependencia que tengo instalada a nivel global no es algo de lo que tienes que preocupar en este momento pero ahora yo estoy aquí yo con no te amo no te vas a utilizar mucho esto porque queremos correr el servidor y no hay otra manera de correr el servidor que no sea tal vez la hay pero.
La manera más común es utilizando lo que es el zelai en este caso en pie rom y es que envíen corre y la el script que yo escribí en este caso va a ser de cuando yo le doy enter ok ves qué dice el app está corriendo en el puerto 800 ok también éste sigue light te funciona para que cuando estás escribiendo código de servidor en lugar.
De utilizar la consola en el navegador si por ejemplo abrimos el navegador ok aquí tengo las noticias localhost y no me acuerdo el puerto que puse 800 vez que dice a hi ok son prácticamente todo lo que escribas en código de.
Servidor la consola o el cje light te va a funcionar para dibujar y para verificar información etcétera lo que usualmente harías en lo que es la consola en la lo que es código del cliente porque eso son muchas cosas las que puedes hacer con el cielo y en la medida que vayas involucrándose con desarrollo web vas a aprender muchas.
Cosas más así que este fue reinaldo para javascript ecosistema recuerda que si quieres ver este tutorial en escrito puedes visitar javascript ese punto com no olvides darle like suscribirte si no lo has hecho y oprimir la campana que nos ayuda a despegar esta página para así traer más contenido este es reinaldo que dios te bendiga hasta la próxima.
[Música]