La verdad es increíble la cantidad de cosas que uno aprende viendo los videos de midu. Trabaje con angular un tiempo, pero no sabia que se podia hacer todas estas cosas con TS. Ahora ando aprendiendo React y me gusta mucho aprender la forma de tener un codigo limpio y que sea escalable asi como menciona midu. Muchas gracias por el contenido que nos brindas!
Midu se que te esfuerzas muchísimo y no tienes mucho tiempo...pero espero con ansias que algún día hagas un video actualizado sobre autenticación de usuarios con react...saludos!
Para los que tienen problemas con Eslint que no les agarra, revisen el apartado OUTPUT de vscode alado de terminal, allí les saldrá el error de eslint, en mi caso, tuve que borrar la linea de referencia a eslintconfig en mi package.json de la carpeta que contiene los proyectos, y quedo funcionando.
Me quedé con la duda de que era eso de signals. No sé por qué no explicarlo o redireccionar a alguien solo por el hecho de que lo dijiste hace meses. La gente que apenas te está siguiendo no sabría que ya lo explicaste
Me gustó mucho este video! Te hago una consulta, por qué has enviado al component Todo los atributos y no directamente el todo completo con todos sus atributos? Es una mala práctica lo que estoy diciendo?
Estoy dando mis primeros pasos en typeScript y este video no me a servido de mucho... me marea demasiado son muchos conceptos nuevos, es para gente con mucha mas experiencia en ts y en programacion pero no para gente que recien arranca. Siguiendo el paso a paso siento que no aprendo demasiado, copio mucho codigo pero aprendo nada...
Tengo un problema con el package.js a la hora de hacer npm install me da varios errores severity y con audit fixed force no me soluciona el problema y creo que esto es lo que me provoca que no pueda hacer una función de staking de mi contrato inteligente en metamask pero no estoy seguro por qué aún estoy aprendiendo, algún consejo?
Te recomiendo que desinstales node y lo vuelvas a instalar a la última versión estable (numero par), y aún mejor si lo haces con nvm. Por otro lado te recomiendo que siempre lo instales en el disco o particion que tienes tu SO (sobre todo en Windows)
Midu genial el video como siempre! Alguien sabria como arreglar el tema del linter a dia de hoy con typescript? lo he intentado de muchas maneras y no me funciona, muchas gracias de antemano 🤗🤗
@@mighell__ bueno al final me funciono pero hice el proceso normal de instalacion y creacion del proyecto con vite y luego instalas la dependencias con npm install y luego entonces inicializas el eslint con el comando npx eslint --init sigue los pasos mostrados y aunque te mande error no importa luego te aseguras que el archivo de .eslintrc.cjs te quede similar al video y ya, de hecho lo que hace midu de poner el proyecto en el archivo "tsconfig.json" en mi caso si lo pongo no sirve el linter si lo dejo sin esa linea entonces si funciona todo
recien comienzo con vite y me sabe mal que tiene un mundo de problemas con los pluggins y las dependencias ... o no se si sea mala suerte la mia xd ojala este tutorial hubiera sido con next.js :v
A alguno le pasa que hacen lo del auto save pero no funciona? me pasa que lo configuro y cuando guardo se ve como si trata de cambiar pero vuelve al error de sintaxis
a alguien mas le sale este error al correr su apliacion? Failed to load url /src/main.jsx (resolved id: /src/main.jsx). Does the file exist?, por lo que entiendo vite busca el archivo main.jsx pero yo lo tengo como main.tsx pero si cambio el formato de archivo tambi[en truena, como hago que vite corra mi archivo main.jsx?
por alguna razón no funciona ESlint al momento de instalar... alguien me puede orientar?, obtengo el siguiente error: PS C:\Users\pollo\Documents\todo-app-ts> npx eslint --init You can also run this command directly using 'npm init @eslint/config'. √ How would you like to use ESLint? · style √ What type of modules does your project use? · esm √ Which framework does your project use? · react √ Does your project use TypeScript? · No / Yes √ Where does your code run? · browser √ How would you like to define a style for your project? · guide √ Which style guide do you want to follow? · standard-with-typescript √ What format do you want your config file to be in? · JavaScript Checking peerDependencies of eslint-config-standard-with-typescript@latest The config that you've selected requires the following dependencies: eslint-plugin-react@latest eslint-config-standard-with-typescript@latest @typescript-eslint/eslint-plugin@^5.52.0 eslint@^8.0.1 eslint-plugin-import@^2.25.2 eslint-plugin-n@^15.0.0 || ^16.0.0 eslint-plugin-promise@^6.0.0 typescript@* √ Would you like to install them now? · No / Yes √ Which package manager do you want to use? · npm Installing eslint-plugin-react@latest, eslint-config-standard-with-typescript@latest, @typescript-eslint/eslint-plugin@^5.52.0, eslint@^8.0.1, eslint-plugin-import@^2.25.2, eslint-plugin-n@^15.0.0 || ^16.0.0 , eslint-plugin-promise@^6.0.0, typescript@* npm WARN idealTree Removing dependencies.eslint-plugin-react in favor of devDependencies.eslint-plugin-react npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: todo-app-ts@0.0.0 npm ERR! Found: @typescript-eslint/parser@6.4.0 npm ERR! node_modules/@typescript-eslint/parser npm ERR! dev @typescript-eslint/parser@"^6.0.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer @typescript-eslint/parser@"^5.0.0" from @typescript-eslint/eslint-plugin@5.62.0 npm ERR! node_modules/@typescript-eslint/eslint-plugin npm ERR! dev @typescript-eslint/eslint-plugin@"^5.52.0" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\pollo\AppData\Local pm-cache\_logs\2023-08-17T05_24_24_085Z-eresolve-report.txt npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\pollo\AppData\Local pm-cache\_logs\2023-08-17T05_24_24_085Z-debug-0.log
lo solucicone de la sig. forma: 0. instala vite, react, ts y todo eso..., pero no des npm install 1. borra todo lo que tenga que ver con eslint de package.json 2. ejecuta npx eslint --init e instala todas las deps. que te diga, 3. sigue la conf. de midu y sale funciona ...
Sigo sin enteder por qué en el filter "!todo.completed" se refiere a que sea false, pero todo.completed se supone que es false, !todo.completed no se supone que seria true? alguien me puede explicar? por favor me estoy volviendo loco
Quizá no te viste el video, en varias ocasiones comenta que está haciendo prop drilling. Y lo deja para que la gente lo pueda arreglar. También comenta que se mejorará en el futuro, utilizando por ejemplo Zustand en una nueva clase.
Algún desarrollador por aquí que pueda contratar pero que sepa aplicar esto para un proyecto! Que pueda crear un todolist que se vincule a una base de datos
tienes que instalar la extensión error lens para que te muestre los errores inline, ahora si te da error al instalar eslint borra node_modules, eslintrc.cjs y package-lock.json, luego elimina todo las dependencias que digan "eslint" en package.json, ejecuta npm install y luego instala eslint de nuevo
4:30 para poder lograr lo q hizo midudev con eslint y vitejs react y ts es instalar el puglin de eslint para vite añadirlo en la configuración de vite y ya esta funcionará eslint
Bueno, entonces no sufras, porque en los más recientes lo hemos quitado. ;) Además de pensar eso, piensa que cada sonido irritante me da de comer para que pueda seguir haciendo tutoriales.
Midu, no se si sos vos o tenes alguien que edita los videos pero hay partes las cuales los cortes son tan rapidos y en tan poco lapso de tiempo que termina haciendo muy confuso a la hora de aprender y entender. No se si lo haces por un motivo de generar mas entretenimiento pero desde mi punto de vista me genero todo lo contrario. Espero que lo tomes como critica constructiva...
Eso de linter es una mierd4, nunca lo he podido configurar bien, siempre sale el warning de las versiones, nunca aparece los errores incluso si instalo la extension , actualmente ya no viene un formato json si no otro, que rollo
La verdad es increíble la cantidad de cosas que uno aprende viendo los videos de midu. Trabaje con angular un tiempo, pero no sabia que se podia hacer todas estas cosas con TS. Ahora ando aprendiendo React y me gusta mucho aprender la forma de tener un codigo limpio y que sea escalable asi como menciona midu. Muchas gracias por el contenido que nos brindas!
yo estoy bien piedra para angular y react pero con este chavo no parece tan complejo y se entiende mas
que grande que eres Midu, muchas gracias por el contenido y dedicación que pones en cada live
muy buen video para ir aprendiendo TS, ahora la segunda parte solo queda en los recuerdos...
Si Midu necesita un riñón soy el primero en dárselo, es una locura estos videos de verdad. Muchas gracias!!!!
Cuidado con lo que dice. Despues sí necesita un riñon y ud hace como homero simpson: se escapa y lo deja con la bata de cirugia puesta
Esto piden como prueba técnica en entrevistas en Argentina a día de hoy. Me lo pidieron esta semana.
¡Muchas gracias! Esas configuraciones de TS y ESLint me han servido muchísimo.
Midu, este video no está en el playlist del curso de React ni en otro playlist.
Gracias por tu aporte.
nunca e estado mas perdido aprendiendo programacion
Midu se que te esfuerzas muchísimo y no tienes mucho tiempo...pero espero con ansias que algún día hagas un video actualizado sobre autenticación de usuarios con react...saludos!
Midu donde puedo encontrar la segunda parte? super interesante esta clase, gracias!!
@midulive +1 a esta consulta, esta grabada la parte 2? Gracias por tanto contenido gratuito
Gracias por compartir su conocimiento ❤
me encantoooo, es genial!!!!. Cuando podrás hacer la segunda parte?
Para los que tienen problemas con Eslint que no les agarra, revisen el apartado OUTPUT de vscode alado de terminal, allí les saldrá el error de eslint, en mi caso, tuve que borrar la linea de referencia a eslintconfig en mi package.json de la carpeta que contiene los proyectos, y quedo funcionando.
Me quedé con la duda de que era eso de signals.
No sé por qué no explicarlo o redireccionar a alguien solo por el hecho de que lo dijiste hace meses.
La gente que apenas te está siguiendo no sabría que ya lo explicaste
Primero que todo, gracias por compartir!
Aún espero la segunda parte.
midu pero continua la serie jooooo
Grande Midu ❤
Que pena que el curso de esta parte ha quedado incompleto y no poder terminar de verlo hasta el final
Gracias por compartir tanta buena información! Será posible que subas la segunda parte? Gracias!
Me gustó mucho este video! Te hago una consulta, por qué has enviado al component Todo los atributos y no directamente el todo completo con todos sus atributos? Es una mala práctica lo que estoy diciendo?
Muy buen vídeo, de 10. ¿Para cuándo la segunda parte?
ya hay segundo parte o no ?
@@sebrival que yo sepa no
Midu hizo un video parecido cual debería hacer, el de hace un año o este????
Estoy dando mis primeros pasos en typeScript y este video no me a servido de mucho... me marea demasiado son muchos conceptos nuevos, es para gente con mucha mas experiencia en ts y en programacion pero no para gente que recien arranca. Siguiendo el paso a paso siento que no aprendo demasiado, copio mucho codigo pero aprendo nada...
Tremendo!
Hola midu, me encantó esta primera parte, pero no encuentro la segunda, podrías compartirmela? pls
ostia que ya has llegado a los 100k aquí tambien.
Ueeeeeh
Nunca se subió esa segunda parte? 🤔
Será que habrá segunda parte ?
donde esta la continuacion de este proyecto?
igual sigo buscandola
Saben si por fin saco la segunda parte?
Tengo un problema con el package.js a la hora de hacer npm install me da varios errores severity y con audit fixed force no me soluciona el problema y creo que esto es lo que me provoca que no pueda hacer una función de staking de mi contrato inteligente en metamask pero no estoy seguro por qué aún estoy aprendiendo, algún consejo?
Que versión de Node y npm tienes?
Te recomiendo que desinstales node y lo vuelvas a instalar a la última versión estable (numero par), y aún mejor si lo haces con nvm. Por otro lado te recomiendo que siempre lo instales en el disco o particion que tienes tu SO (sobre todo en Windows)
@@kerneldiego gracias probaré haber que tal.
gracias midu!
Midu genial el video como siempre! Alguien sabria como arreglar el tema del linter a dia de hoy con typescript? lo he intentado de muchas maneras y no me funciona, muchas gracias de antemano 🤗🤗
Si, me parece que cambiaron muchas cosas con respecto a eslint
No consigo la segunda parte en twitch. Alguien me sabe donde lo puedo conseguir?
Lo mismo estoy buscando
Estoy buscando lo mismo, llegaste a encontrarlo?
Genial!
actualmente vite instala ya por defecto una config de eslint y con la config que muestras no funciona para nada :(
tengo el mismo problema, todo me tira error, lograste solucionarlo?, me gustaria saber que hiciste!
@@mighell__ bueno al final me funciono pero hice el proceso normal de instalacion y creacion del proyecto con vite y luego instalas la dependencias con npm install y luego entonces inicializas el eslint con el comando npx eslint --init sigue los pasos mostrados y aunque te mande error no importa luego te aseguras que el archivo de .eslintrc.cjs te quede similar al video y ya, de hecho lo que hace midu de poner el proyecto en el archivo "tsconfig.json" en mi caso si lo pongo no sirve el linter si lo dejo sin esa linea entonces si funciona todo
module.exports = {
env: {
browser: true,
es2021: true,
},
extends: ["standard-with-typescript", "plugin:react/recommended"],
overrides: [],
parserOptions: {
ecmaVersion: "latest",
sourceType: "module",
},
plugins: ["react"],
rules: {
"react/react-in-jsx-scope": "off",
"@typescript-eslint/explicit-function-return-type": "off",
"@typescript-eslint/method-signature-style": "off"
//"react/prop-types": "off",
},
};
asi me funciona todo
@@devvvolf genial, me ayudaste!, muchas gracias! =D
perdon midu crack cual es la extension para tsx en vsc? gracias
Pretty TypeScript Errors de "yoavbls"
muy bueno, hay segunda parte?
Hola Midu cada vez que intento hacer la configuracion del Eslint como lo haces, me da un error en los import
que no te reconoce el tsconfig.json? por que es lo que me paso a mi
@@TorchioLorenzo Me parece que si
Tuve el mismo error hasta que me di cuenta de que mi carpeta "components" estaba fuera de "src"
Midu donde está la continuación?
Cree un proyecto con vite y typescript y ya venia con el plugin del eslint para typescript
recien comienzo con vite y me sabe mal que tiene un mundo de problemas con los pluggins y las dependencias ... o no se si sea mala suerte la mia xd ojala este tutorial hubiera sido con next.js :v
Excelente buen video
A alguno le pasa que hacen lo del auto save pero no funciona? me pasa que lo configuro y cuando guardo se ve como si trata de cambiar pero vuelve al error de sintaxis
Gracias
Buenísimo, me encanta. Solo una sugerencia con todo respeto. Crees que podrías silenciar la notificación cuando te llega un sub?
No se puede, por desgracia, pero voy a intentar poner otro sonido menos molesto!
Alguien puede decirme como se llama la app que usa midu para hacer zoom a donde tiene el mouse?
Voy a tener q ver mas veces los cursos de ts 😢 por q me pierdo demasiado pero gracias por enseñarlos los voy a aprender si o si
Mucha suerte!!
Hola Midu, gracias por le video pero no me funciono lo del esLinst. No me aparecen los errores como a ti.
El enlace al repositorio está roto no?
a alguien mas le sale este error al correr su apliacion? Failed to load url /src/main.jsx (resolved id: /src/main.jsx). Does the file exist?, por lo que entiendo vite busca el archivo main.jsx pero yo lo tengo como main.tsx pero si cambio el formato de archivo tambi[en truena, como hago que vite corra mi archivo main.jsx?
Que tal midu me podrias decir la extencion del autocompletado que trienes minuto 26:42 ? porfavor.
no es un autocompletado, es github copilot.
Y la segunda parte?
El github no funciona
Vengo del futuro y estas mas delgado midu
Sos muy bueno ! me gustaria q no uses copilot, aprenderia mas con menos "sugerencias" ( soy pobre y no puedo pagarlo jaja.)
usa codewisperer
por alguna razón no funciona ESlint al momento de instalar... alguien me puede orientar?, obtengo el siguiente error:
PS C:\Users\pollo\Documents\todo-app-ts> npx eslint --init
You can also run this command directly using 'npm init @eslint/config'.
√ How would you like to use ESLint? · style
√ What type of modules does your project use? · esm
√ Which framework does your project use? · react
√ Does your project use TypeScript? · No / Yes
√ Where does your code run? · browser
√ How would you like to define a style for your project? · guide
√ Which style guide do you want to follow? · standard-with-typescript
√ What format do you want your config file to be in? · JavaScript
Checking peerDependencies of eslint-config-standard-with-typescript@latest
The config that you've selected requires the following dependencies:
eslint-plugin-react@latest eslint-config-standard-with-typescript@latest @typescript-eslint/eslint-plugin@^5.52.0 eslint@^8.0.1 eslint-plugin-import@^2.25.2 eslint-plugin-n@^15.0.0 || ^16.0.0 eslint-plugin-promise@^6.0.0 typescript@*
√ Would you like to install them now? · No / Yes
√ Which package manager do you want to use? · npm
Installing eslint-plugin-react@latest, eslint-config-standard-with-typescript@latest, @typescript-eslint/eslint-plugin@^5.52.0, eslint@^8.0.1, eslint-plugin-import@^2.25.2, eslint-plugin-n@^15.0.0 || ^16.0.0 , eslint-plugin-promise@^6.0.0, typescript@*
npm WARN idealTree Removing dependencies.eslint-plugin-react in favor of devDependencies.eslint-plugin-react
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: todo-app-ts@0.0.0
npm ERR! Found: @typescript-eslint/parser@6.4.0
npm ERR! node_modules/@typescript-eslint/parser
npm ERR! dev @typescript-eslint/parser@"^6.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @typescript-eslint/parser@"^5.0.0" from @typescript-eslint/eslint-plugin@5.62.0
npm ERR! node_modules/@typescript-eslint/eslint-plugin
npm ERR! dev @typescript-eslint/eslint-plugin@"^5.52.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!
npm ERR! For a full report see:
npm ERR! C:\Users\pollo\AppData\Local
pm-cache\_logs\2023-08-17T05_24_24_085Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\pollo\AppData\Local
pm-cache\_logs\2023-08-17T05_24_24_085Z-debug-0.log
justo me pasa, al parecer es vite y las versiones de dependencias relacionadas a eslint
me da el mismo error xD
lo solucicone de la sig. forma:
0. instala vite, react, ts y todo eso..., pero no des npm install
1. borra todo lo que tenga que ver con eslint de package.json
2. ejecuta npx eslint --init e instala todas las deps. que te diga,
3. sigue la conf. de midu y sale funciona ...
@@carlosrofts5230 asi ya jaló
No sirve el link del repositorio D:
Sigo sin enteder por qué en el filter "!todo.completed" se refiere a que sea false, pero todo.completed se supone que es false, !todo.completed no se supone que seria true? alguien me puede explicar? por favor me estoy volviendo loco
es para que el filter tome los falsos, osea conviertes los falsos en true y el .filter solo te devuelve los true
hey, autocomplete extension?
Hiciste un prop drilling, ese tipo de errores deben evitarse.
En otra clase explicamos el Contexto y cómo evitar el prop drilling. :)
Esta clase nos enfocamos a usar React con TypeScript.
Que parte seria eso?
Quizá no te viste el video, en varias ocasiones comenta que está haciendo prop drilling. Y lo deja para que la gente lo pueda arreglar.
También comenta que se mejorará en el futuro, utilizando por ejemplo Zustand en una nueva clase.
@@midulive vale vale una disculpa, gracias, buen contenido, sigo aprendiendo.
Algún desarrollador por aquí que pueda contratar pero que sepa aplicar esto para un proyecto! Que pueda crear un todolist que se vincule a una base de datos
se rompio el link!
no sale la opcion "to check syntax find problems and enforce code style" solo las dos primeras
Good
¿Continuarás el TODO más adelante??
A alguien mas no le funciona eslint? Lo instale desde visual studio, pero no me saltan los errores como a Midu
me pasa lo mismo! pudiste solucionarlo?
@@matiasmolina6777 No, en verdad no pude :/
@@juanjosehorisberger2490 a mi también me pasa eso, es más, cuando instalo eslint me tira varios errores
tienes que instalar la extensión error lens para que te muestre los errores inline, ahora si te da error al instalar eslint borra node_modules, eslintrc.cjs y package-lock.json, luego elimina todo las dependencias que digan "eslint" en package.json, ejecuta npm install y luego instala eslint de nuevo
4:30 para poder lograr lo q hizo midudev con eslint y vitejs react y ts es instalar el puglin de eslint para vite añadirlo en la configuración de vite y ya esta funcionará eslint
Tío me molan muchos tus tutoriales pero es super irritante el sonido de las suscripciones
Bueno, entonces no sufras, porque en los más recientes lo hemos quitado. ;) Además de pensar eso, piensa que cada sonido irritante me da de comer para que pueda seguir haciendo tutoriales.
@midulive Gràcies màquina! te deseo muchas más suscripciones sin sonido ;P Salut!
Mi primer intento de realizar un proyecto con Typescript. Me tumba los ánimos el ver tantos errores en el código 🤦♂
No hay repo ;(
Midu, no se si sos vos o tenes alguien que edita los videos pero hay partes las cuales los cortes son tan rapidos y en tan poco lapso de tiempo que termina haciendo muy confuso a la hora de aprender y entender. No se si lo haces por un motivo de generar mas entretenimiento pero desde mi punto de vista me genero todo lo contrario. Espero que lo tomes como critica constructiva...
1:00:26
prefiero nextjs ya que trae mas funcionalidad
De hecho, si TS ya es capaz de inferir un tipo es mala práctica especificarlo tú. No lo digo yo, lo dicen los gurús, y con bastante sentido
😅
El linter le señala que tiene que arreglarlo, y solo lo siguió pq quería y ya. No porque ha explicado que las inferencias son buenas y recomendables
es más dificil seguir el código de TypeScript que de JavaScript
Para nada. Porque básicamente se sigue igual y encima te facilita el encontrar errores en el código y solucionarlos.
Eso de linter es una mierd4, nunca lo he podido configurar bien, siempre sale el warning de las versiones, nunca aparece los errores incluso si instalo la extension , actualmente ya no viene un formato json si no otro, que rollo
Me pasa igual, llevo varios días intentando arreglarlo y no hay forma con las nuevas versiones :(
no entendi ni la mitad de todo
jajaja quien dijo Access?
You can do that in 10 min with ChatGPT
si se puede pero siempre es mejor saber la teoria y entender lo que se esta haciendo.
el init del eslint a mi me funcionó escribiendo
"npm init @eslint/config"
Y la segunda parte?