Configuración

Clase 5 de 26 • Curso de Asincronismo con JavaScript

Paul Martin Vargas Portugal

student•

pwd: Saber donde estoy ubicado. mkdir: Creación de carpeta cd: Moverse a carpetas git init: Inicias Git npm init: Le da nombre, versión, entre otras cosas al proyecto code . : Inicia el editor de códigos

Sergio Lopez

student•

-Para no darle valores default: npm init -y

-Para que Visual Code no abra otra ventana si usas la terminal del programa: code ./ -r

Felix Torres Javier Antonio

student•

gracias por el aporte"!!!!

Maria Gabriela Rodriguez Cuevas

student•

⚙️ 𝗖𝗹𝗮𝘀𝗲 #𝟱: 𝗖𝗼𝗻𝗳𝗶𝗴𝘂𝗿𝗮𝗰𝗶ó𝗻 𝟱/𝟮𝟭 ⚙️ . 🖋️ ++Conceptos fundamentales antes de crear el proyecto:++ .

Web APIs JavaScript del lado del cliente: setTimeout, XMLHttpRequest, File Reader, DOM. Node: fs, https.
API: El término API es una abreviatura de “Application Programming Interface” (Interfaz de programación de aplicaciones en español). Es un conjunto de rutinas que provee acceso a funciones de un determinado software.
Hoisting: Sugiere que las declaraciones de variables y funciones son físicamente movidas al comienzo del código en tiempo de compilación.
XML: Lenguaje de marcado creado para la transferencia de información, legible tanto para seres humanos como para aplicaciones informáticas, y basado en una sencillez extrema y una rígida sintaxis. Así como el HTML estaba basado y era un subconjunto de SGML, la reformulación del primero bajo la sintaxis de XML dio lugar al XHTML; XHTML es, por tanto, un subconjunto de XML.
DOM: El DOM permite acceder y manipular las páginas XHTML como si fueran documentos XML. De hecho, DOM se diseñó originalmente para manipular de forma sencilla los documentos XML.
Events: Comportamientos del usuario que interactúa con una página que pueden detectarse para lanzar una acción, como por ejemplo que el usuario haga click en un elemento (onclick), que elija una opción de un desplegable (onselect), que pase el ratón sobre un objeto (onmouseover), etc.
Compilar: Compilar es generar código ejecutable por una máquina, que puede ser física o abstracta como la máquina virtual de Java.
Transpilar: Transpilar es generar a partir de código en un lenguaje código en otro lenguaje. Es decir, un programa produce otro programa en otro lenguaje cuyo comportamiento es el mismo que el original. . . 🛠️ ++Crear e inicializar un Proyecto:++ .

Tener instalado ++Visual Studio Code++. .
Abrir la terminal (en Linux al presionar las teclas ++Ctrl + Alt + T++). .
Para conocer donde estamos ubicados se escribe ++pwd++ y se da ENTER. .
Para ver las carpetas y archivos del lugar donde estamos, se escribe ++ls++ y se da ENTER. .
Para crear una carpeta se escribe ++mkdir nombre-de-la-carpeta++ y se da ENTER. .
Para entrar a una carpeta se escribe ++cd nombre-de-la-carpeta++ y se da ENTER. .
Si se quiere ir a la carpeta contenedora de la carpeta actual que estamos, se escribe ++cd ..++ y se da ENTER. .
En linux para no escribir los comando de mkdir y cd, se escribe ++take nombre-de-la-carpeta++ y se da ENTER. .
Para crear un archivo se escribe ++touch nombre-del-archivo-extensión++ y se da ENTER. .
Para limpiar la pantalla en la terminal se escribe ++clear++ y se da ENTER. .
Si solo se quiere mover el scroll se presionan las teclas ++Ctrl + Alt + l++ .
Para iniciar el repositorio se escribe ++git init++ y se da ENTER. .
Vamos a inicializar el proyecto con npm, se escribe ++npm init++ y se da ENTER. .
Aparece el nombre del proyecto, si no se quiere modificar el nombre, se da ENTER. .
Aparece la versión del proyecto, si no se quiere modificar el número, se da ENTER. .
Aparece la descripción del proyecto, si se quiere modificar dejar vacío, se da ENTER. .
Lo mismo, dejar vacío: entry point, test command, git repository. .
En keywords se escribe las palabras claves como ++javascript++ y se da ENTER. .
En la licencia por defecto aparece la ISC, pero la más común es la ++MIT++ para compartir y poder comercializar después el producto. .
Por último, aparecen los datos ingresados (guardados en el archivo package.json) y si no hay que modificar, se escribe ++yes++ y se da ENTER. .
Para entrar al editor VSC se escribe ++code .++ y se da ENTER. .
Una vez dentro de VSC, en el panel izquierdo aparece el archivo package.json, crear una nueva carpeta llamada ++src++ donde contendrá nuestro código. .
Crear el archivo ++.gitignore++ (estará fuera de la carpeta src). En los sistemas Unix, dado que el archivo empieza con un punto, al abrir un explorador de archivos los toma como archivos ocultos y no son visibles. El contenido del archivo queda:

     /node_modules/

Para guardar los cambios de un archivo, presionar las teclas ++Ctrl + S++ .
Muy importante instalar ++la extensión Code Runner++, presionar las teclas ++Ctrl + P++ y pegar: ++ext install formulahendry.code-runner++ y dar ENTER. Lo instala automáticamente (fuente: aquí).

Felipe Muñoz Caceres

student•

muchas gracias por estos resumenes de las clases, me han ayudado a recordar puntos importantes.

Maria Gabriela Rodriguez Cuevas

student•

Esa es una de las ventajas de la comunidad Platzi, por medio de comentarios he solucionado errores que no me dejaban avanzar, así como también de repasar conceptos. :)

Clem Acosta

student•

Para aquellos que se quieran saltar las preguntas del npm init pueden agregar el flag --yes o -y para que les genere el archivo por defecto.

npm init -y

Jhon Dairo Meche Tenza

student•

Emerson David Cabrera Salas

student•

Cuando me lo explican todo lo que necesito tan claro como lo hizo el profe!

Jesus Nicolas Vite

student•

En efecto, la primera ves que he entendido sin estresarme.

Pablo Torres Pérez

student•

Un comando útil para ignorar archivos cuando se utiliza git con node es:

npx gitignore node

Jhon Dairo Meche Tenza

student•

Diego Raciel Ortega Hernandez

student•

Wow eso si no lo conocia

Stephany Plaza

student•

Para aquellos que no les funcione el npm init Deben verificar si tienen instalado NodeJS en su última versión, pueden chequearlo en la terminal con el siguiente comando “node -v” En caso de no recibir respuesta puedes instalarlo desde su sitio oficial: nodejs .org Aunque mi recomendacion es que vean el curso de prework para tener todo configurado para este y los proximos cursos :)

Miguel Angel Perez Cardona

student•

Pienso que antes de este curso se debe tomar el curso donde el profesor te dice como instalar todo de acuerdo a tu sistema operaitvo. De hecho lo explica bien.

Aca algunos comandos que me se.

ls -> Te muestra los archivos que hay donde estas ubicado. cd .. -> Retrocede de carpeta. cd -> Avanza de carpeta. rm -> Eliminar un archivo o carpeta. cd ~ -> Te lleva al home de la terminal. cd mnt -> Te lleva al directorio de windows. touch -> Crear un archivo . mv -> Mover un archivo o carpeta .

Les recomiendo el curso de github con Freddy, github es... hermoso.

https://platzi.com/cursos/git-github/

Danilo Estupiñan

student•

Me gusta que despues del curso de git, seguimos usando los repositorios asi nos acostumbramos a llevar buenas practicas en nuestros proyectos

Julian Jose Sossa Cruz

student•

Agregar autor

tu nombre <tucorreo@correo.com>

Porfirio González López

student•

No abre

Luis Carlos Zapata García

student•

. code me sirvio en windows.

Joao Ivan Garduño Salgado

student•

git init -> Repositorio inicializado npm init -> inicializar nuestro proyecto con NPM

Erick Martin Meza Alonso

student•

Alguien que sepa cuál es el thema de oh-my-zsh que Oscar está usando? se les agradecerá mucho que lo comenten <3

Douglas Lovera

student•

Hola! Él escribió este artículo sobre el tema y de cómo usarlo:

Erick Martin Meza Alonso

student•

gracias, @Douglaslovera

Nico Melgarejo Sabelle

student•

pwd: Print Working Directory mkdir: MaKe DIRectory

Para crear el .gitignote desde la terminal podemos escribir touch .gitignore

Daniel Builes Gomez

student•

muchas gracias

Cristian Muñoz

student•

Pueden utilizar esta web para construir su .gitignore mas fácil

https://www.toptal.com/developers/gitignore/

Andres Felipe Baron Becerra

student•

no me funciona npm init y ya desacrgue la ultima version

Rosario Sánchez

student•

Hola Andres, fijate si tenes node instalado, capaz no lo tenes y ese sea tu problema.

Diego Jose Chavez

student•

Revisa si tienes node y npm instalado con los siguientes comandos:

npm --version
node --version

Michael Figueroa Reyes

student•

Hello guys , Alguna configuration extra para poder configurar con npm por que la configuración actual no me reconoce el comando en el que estamos trabajando. help please .

Vanessa Gordillo

student•

ayuda!! no me sale igual git init en la teminal (me sale esto: Reinitialized existing Git repository in C:/Users/nvane/js-asincronismo/.git/ )y al ejecutar npm init me sale esto: npm : El término 'npm' no se reconoce como nombre de un cmdlet, función, archivo de script o programa ejecutable.

Heidenber Palacio Garzón

student•

Ya tienes el repo inicializado, si quieres borrarlo y volver a empezar debes hacer

rm -rf .git

git init

Parece que no tienes instalado NodeJS

Daniela Stornelli

student•

2:50 esa terminal o linea de comandos sería por ejemplo GIt Bash?

Heidenber Palacio Garzón

student•

O la que más te guste.

Cristian Blandon

student•

La que usa el profe es iTerm en MacOS... Si estás en Windows y quieres usar los mismos comandos, Git Bash te serviría sin problema.

Calvin Rafael Bobadilla Fernandez

student•

La explicacion que dio hoy fue universal (claro, era basicamente un tutorial pero aun asi cuenta) 10/10

Pastor Alexander Castro Aguilar

student•

Execelente explicación, no asume que el estudiante ya posee conocimientos sobre el tema, haciéndola más accesible para los que estamos empezando.

Configuración

Introducción

Lo que aprenderás en este curso

Qué es el asincronismo

Event Loop

Iniciando a programar con JavaScript

Callbacks

Configuración

Qué son los Callbacks

Playground: Ejecuta un callback con 2s de demora

XMLHTTPRequest

Fetch data

Callback hell

Promesas

Qué son las promesas

Playground: Crea una función de delay que soporte asincronismo

Fetch

Fetch POST

Async Await

Funciones asíncronas

Try and catch

Playground: Captura el error de una petición

¿Cómo enfrentar los errores?

Generadores

Generators

Proyecto CV

Proyecto del curso

Consumiendo API

Desplegando el proyecto

Playground: Crea una utilidad para hacer peticiones

Nunca pares de crear

Conclusión

¿Qué camino tomar para seguir aprendiendo?

Autoevaluación de Proyecto: Creación de Landing Page