Reproducirse en todos lados
Introducción
Historia de JavaScript: ¿qué es ECMAScript?
¿Qué es el TC39?
Configuracion
Configurando nuestras herramientas
¿Qué se implementó en ES6?
ES6: let y const, y arrow functions
ES6: strings
ES6: parámetros por defecto
ES6: asignación de desestructuración
ES6: spread operator
Playground: Combina objetos JSON con el Spread Operator
ES6: object literals
ES6: promesas
ES6: clases
ES6: module
Playground: Obtén una lista de películas
ES6: generator
Playground: Generador de identificadores para michis
ES6: set-add
¿Qué se implementó en ES7?
ES7: exponentiation operator y array includes
¿Qué se implementó en ES8?
ES8: object entries y object values
ES8: string padding y trailing commas
ES8: funciones asíncronas
¿Qué se implementó en ES9?
ES9: expresiones regulares
ES9: Promise.finally
¿Qué se implementó en ES10?
ES10: flat-map y trimStart-trimEnd
ES10: try catch y fromEntries
¿Qué se implementó en ES11?
ES11: optional chaining
ES11: BigInt y Nullish
ES11: Promise.allSettled
ES11: globalThis y matchAll
ES11: dynamic Import
¿Qué se implementó en ES12?
ES12: numeric-separators y replaceAll
ES12: promise-any y métodos privados
¿Qué se implementó en ES13?
ES13: at
ES13: top level await en el consumo de una API
Recapitulación
Performance
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
No se trata de lo que quieres comprar, sino de quién quieres ser. Aprovecha el precio especial.
Antes: $249
$209
Paga en 4 cuotas sin intereses
Termina en:
13 Días
0 Hrs
19 Min
6 Seg
Configurando nuestras herramientas
3/35Recursos
Para instalar los plugins que te mostré, da click en ícono de extensiones de tu Visual Studio Code, escribe el nombre del plugin en la barra de búsqueda, seleccionalo e instala.
Icono de extensiones en VSC
Plugins importantes para este curso:
- Code Runner. Permite ejecutar piezas de código seleccionadas y muestra el output directamente en nuestro editor de código. (Más de Code Runner)
- Live Server. La vamos a utilizar para ejecutar un servidor y ver los cambios efectuados en tu código. (Más de Live Server)
- JavaScript (ES6) code snippets. Autocompleta y brinda sugerencias al momento de escribir código. (Más de code snippets)
Plugins recomendados para usar en tu día a día como frontend developer
- Auto Close Tag. Ayuda a cerrar más rápido las etiquetas que vas abriendo.
- Error Lens. Muestra los errores visualizandolos de forma atractiva para que no pases ninguno por alto.
- Guides. Te ayudan a indentar tu código y ordenarlo de forma más eficiente.
- Indent-rainbow. Hace que la indentación sea más amigable con la ayuda de colores diferentes por nivel.
- Palenight Theme. Úsalo si quieres visualizar los mismos colores que se muestran en mi editor de código.
Aportes 36
Preguntas 15
Ordenar por:
No olviden el archivo .gitignore y configurarlo para ignorar node_modules y no subirlo a su repositorio 🤭
No solo me llevo grandes conocimientos, si no también una nueva colección de plugins de vc, esta genial!!!
Me parece genial cuando Platzi deja en sus recursos el resumen de la clase (key points) y enlaces a más info y recursos. Ojalá lo hicieran como regla general para todos los cursos.
Apunte de la clase en Notion
Para inicializar el proyecto vamos a agregar las configuraciones base de npm e iniciarlizar con git con los siguientes comandos
git init
npm init -y
Para abrir la carpeta desde VSCode desde la terminal estando ubicados en la carpeta que inicializamos lo podemos hacer con el comando code .
Luego creamos un archivo llamado .gitignore en el que podemos ignorar los archivos que no queremos subir a nuestro repositorio ya que son autogenerados al correr npm install.
.gitignore
/node_modules
Carpeta src
Es un estandar donde vivirán los archivos que vamos a manejar dentro de nuestro proyecto.
Plugins útiles
- Auto Close Tag
- Code Runner
- Error Lens
- Guides
- indet-rainbow
- Live Server
- Palenight theme
- JavaScript (ES6) code snippets
Si desean actualizar Node.js a su versión estable o a su ultima versión, pueden utilizar estos comandos los que utilizan wsl:
→ sudo npm cache clean --force
→ sudo npm install -g n
→ sudo n latest
Ultima versión es con “latest” y si quieres la versión estable es “stable”
Que bonito es que el profe recomiende un curso y tu ya haberlo pasado porque sabes que la p##Bida esfking dura y escojes el camino del guerrero nocturno solitario aprovechando al máximo para estudiar, send my love tM8t, a seguir estudiando 8)
Oscar, cuando hablas asi de fluido y no haces tantas pausas de verdad que eres uno de los mejores profesores del sitio! Felicitaciones por eso
Si algunos realizan el procedimiento desde la consola de GIT bash en Windows, es muy probable que al ejecutar el comando npm init salga un error de command not found.
Para esto se puede instalar el nodejs para Windows en su versión LTS desde el siguiente link:
Es recomendado crear un directorio en D (Con cualquier nombre), de tal manera que al seguir el procedimiento de instalación se cambie la ruta por defecto para el programa (…\Archivos de programa…) a la ruta creada (D:\Directorio para npm…). Después de esto la instalación se continúa y finaliza de manera normal.
Una vez instalado node.js dentro del directorio creado se reinicia la consola de GIT (salir con exit), volver a abrirla, se ingresa al directorio donde se instaló el node.js (cd /d/…Ruta Directorio para npm), al ingresar ls debe desplegar todos los archivos correspondientes al programa y finalmente al digitar npm -v debe desplegar la versión del npm:
$ npm -v
8.19.3
Esto nos indica que ya se podrá ejecutar las funcionalidades del npm como el npm init.
También pueden usar nvm para instalar node, les permite cambiar de version de node y npm cuando quieran, muchas veces las nuevas versiones arrojan errores que se solucionan pasando a versiones mas antiguas.
✅ ¿Qué es npm?
.
“Aunque puedes ver diferentes variaciones del significado de npm, las siglas significan «Node package manager».
.
npm es un gestor de paquetes para los proyectos de Node.js disponibles para su uso público. Los proyectos disponibles en el registro de npm se llaman «paquetes».
.
npm nos permite utilizar fácilmente el código escrito por otros sin necesidad de escribirlo nosotros mismos durante el desarrollo.
.
El registro npm tiene más de 1,3 millones de paquetes que son utilizados por más de 11 millones de desarrolladores en todo el mundo.”
.
Fuente: kinsta
✨🦄
Con estos dos comandos se puede instalar la versión lts de node de forma rápida :3
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash
nvm install --lts
Y para comprobar la instalación simplemente le damos a:
node -v
otro comando de Visual Studio Code es
code ./ -r
Hola a todos, les recomiendo usar RunJS, está para Windows, Linux y MacOs y es bastante útil para correr código de JavasCript mientras lo vas escribiendo.
✅ Extensiones principales para instalar en nuestro vscode:
- Code Runner. 💻
- Live Server. 🔅
- JavaScript (ES6) code snippets. ➡️
Para Windows se puede usar nvm for windows https://github.com/coreybutler/nvm-windows que permite gestionar distintas versiones de node:
nvm install latest
nvm install lts
nvm use latest
Muy útiles las recomendaciones de pluggins para visual studio code, porque son de gran ayuda, y hasta ahora en ningun otro curso las habia visto, pero me preguntaba lo de los colores y ayudas en vscode
Si que es super sencillo configurar todo este asunto del ECMAScript en Mac.
Quokka es mejor que Code Runner.
<https://quokkajs.com/docs/index.html>
Instale Node js, pero la verdad no me sale nada, ni la ruta donde estoy y no me recibe sino instruscciones como console.log, pero no me permite ver en que ubicacion estoy ni mkdir sale error
```js
Welcome to Node.js v20.9.0.
Type ".help" for more information.
> mkdir ''prueba'
mkdir ''prueba'
^^
Uncaught SyntaxError: Unexpected string
> mkdir 'prueba'
mkdir 'prueba'
^^^^^^^^
Uncaught SyntaxError: Unexpected string
> mkdir prueba
mkdir prueba
^^^^^^
Uncaught SyntaxError: Unexpected identifier 'prueba'
>
```Welcome to Node.js v20.9.0.
Type ".help" for more information.
\> mkdir ''prueba'
mkdir ''prueba'
^^
Uncaught SyntaxError: Unexpected string
\> mkdir 'prueba'
mkdir 'prueba'
^^^^^^^^
Uncaught SyntaxError: Unexpected string
\> mkdir prueba
mkdir prueba
^^^^^^
Uncaught SyntaxError: Unexpected identifier 'prueba'
\>
por que en recursos no me sale nada?
Para los que estamos usando WSL instalar node y tener npm ultima version estable
https://learn.microsoft.com/es-es/windows/dev-environment/javascript/nodejs-on-wsl
El audio es malo
Los pluggins estan geniales
Herramientas a usar;
- Git
- Node LTS
- Cuenta en GitHub
- Visual Studio Code
Aún no tomo el curso de Prework pero ya tenía instalado todo lo que se mencionó en clase 😅.
Había visto este vídeo hace un tiempo y me fue útil en mis proyectos.
Oscar Barajas siempre recomienda buenas extensiones!
Como un “tip extra”, vayan al canal de Youtube del gran Óscar Barajas. Van a encontrar un video, sobre éste tema.
Óscar: https://www.youtube.com/@gndx/featured
Si estas en mac y no funcionò el “code .” puedes abrir visual studio code y con “cmd + shift + p” abres la paleta de comandos y escribes “shell command” y despues eliges la opciòn “Instalar”… cierras tu editor y tu terminal y abres una nueva… se supone que ya deberìa funcionar con “code .”
Por si alguien llega a presentar este problema al configurar node.js o al correr ‘Code Runner’:
‘Solución (FIX): NodeJs: ‘node’ no se reconoce como un comando interno o externo, programa o archi…’
Una posible solución:
https://www.youtube.com/watch?v=0EYq0u_6wo8
Que buenos pluggins para ayudarnos y adornar todo
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?