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
You don't have access to this class
Keep learning! Join and start boosting your career
If you already have an account,
Resources
To install the plugins I showed you, click on the extensions icon in your Visual Studio Code, type the plugin name in the search bar, select it and install it.
Extensions icon in VSC
Important plugins for this course:
- Code Runner. Allows you to run selected pieces of code and displays the output directly in our code editor. (More from Code Runner)
- Live Server. We are going to use it to run a server and see the changes made to your code. (More from Live Server)
- JavaScript (ES6) code snippets. Autocompletes and provides suggestions when writing code. (More from code snippets)
Recommended plugins to use in your day to day as a frontend developer
- Auto Close Tag. Helps to close faster the tags you are opening.
- Error Lens. Shows the errors visualizing them in an attractive way so that you don't overlook any of them.
- Guides. Helps you to index your code and order it more efficiently.
- Indent-rainbow. Makes indentation more friendly with the help of different colors per level.
- Palenight Theme. Use it if you want to display the same colors as shown in my code editor.
Contributions 36
Questions 15
Sort by:
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)
✅ ¿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
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.
✨🦄
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.
woo
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
Want to see more contributions, questions and answers from the community?