Apprendre TYPESCRIPT en 1 HEURE (l'ESSENTIEL en 2024)

On apprend l’essentiel de TYPESCRIPT en 1 heure environ. Dedans, on va couvrir les incontournables du langage tant demandé par les entreprises. Cette vidéo fait suite à la vidéo REACT EN 1 HEURE.
👉 La suite de "TYPESCRIPT en 1 HEURE", c'est ici : videv.podia.com/typecript-en-...
Le lien vers CodeSandbox : codesandbox.io/new?...
Le lien vers REACT EN 1 HEURE :
• Apprendre REACT.JS en ...
Le lien vers le code final : codesandbox.io/p/devbox/types...
Vous avez été nombreux à montrer de l'intérêt pour la formation dans mes DM. J'ai donc décidé de la mettre gratuitement en ligne sur KZbin 🎁
Si cette vidéo t'a appris quelque chose et que tu veux me remercier, like la vidéo et abonne toi 😃
Vous avez été nombreux à commenter ma vidéo REACT. Ca m'a grave donné la force pour faire cette vidéo Typescript. Donc n'hésite pas à lâcher un commentaire (question ou petit mot sympa de remerciement), ça fait toujours plaisir et ça me (re)donnera de la force pour continuer à faire d'autres contenu gratuit pour vous les gens !
👋 Retrouve mon quotidien de Lead Développeur React :
sur Twitter : / videvjs
Chapitres :
00:00:00 Intro
00:00:16 01 L'intérêt de Typescript
00:04:11 02 Typer une variable
00:27:03 03 Typer une fonction
00:49:15 04 Typer un composant
01:07:08 05 Typer un événement
01:11:45 06 BONUS 1 : Typer un hook
01:21:29 07 BONUS 2 : Utiliser Typescript en équipe
01:31:19 Résumé et la suite

[@videv9858]

JE LIS TOUS LES COMMENTAIRES. Donc si tu as des questions ou si tu veux juste me laisser un message de remerciement, n'hésite pas à le faire en commentaire 🍿😎

[@karimkrimou399]

Pas de quoi frère je vois que la chaine est encore a ces debuts ,mais le contenue est excellent,la méthodologie aussi la qualité des vidéos...tout est parfait ,tu peut compter sur moi pour ,les commentaires,les question qui peut-être inspiront ton contenue jusqu'à a ce que la chaine sera parmi les meilleurs chaines en dev

[@videv9858]

@@karimkrimou399 Je m'efforce toujours de privilégier la qualité plutôt que la quantité et quand je vois ton commentaire, je me rends compte que mes efforts "se voient" et ça me donne beaucoup de force pour continuer à faire d'autres vidéos en plus de me réchauffer le coeur ♥ Merci 😊

[@karimkrimou399]

Je suis moi même dans l'optique de l'idéalisme et de privilégier la qualité sur la quantité et c'est pour cela que j'apprécie et je considère tes efforts frère tu as tout mon soutien jusqu'à ce que cette chaine arrive a des centaines de k ou des millions si dieu le veut bien

[@animemanklayton6940]

pourquoi ce genre de chaine n'a pas plus d'abonnée ??????? pourquoiiiiii youtube pourquoiiiiiii !!!!!!!! ça merite largement les centaine de millier

[@videv9858]

Hahah merci à toi ! Je me pose la même question 😭Un partage de la vidéo à tes potes qui codent et voudraient apprendre TS aussi m'aiderait DE OUF pour ça ❤🤩

[@mosdev1663]

C'est de loin la meilleure pédagogie que j'ai trouvé pour comprendre TypeScript. Merci beaucoup, je peux enfin lire et comprendre ce qui m'est demandé maintenant.. Merci beaucoup 😉

[@videv9858]

Merci pour ton superbe commentaire ! Heureux de voir que ça a servi 💙

[@ntakpearnaudigor4035]

Recevez mes salutations Mr. je n'ai pas l'habitude de commenter les vidéos, mais vraiment wow. J'adore votre manière d'expliquer, c'est tellement plaisant de vous écouter, et on comprend parfaitement sans aucune difficulté. Grand merci pour tout ce que vous faites franchement. Si l'on pouvait liker plus d'une fois je l'aurais fait à l'infini.

[@videv9858]

Ton long commentaire me réchauffe le cœur. Merci beaucoup 😊 💙

[@PikminPiPi]

J’ai suivi la vidéo avec la devBox (en regardant react en 1h au passage) c’est super formateur de suivre les deux cours à la suite. Tes explications sont très claires, ta pédagogie est bluffante. On ne vois pas le temps passer, j’étais presque déçu d’avoir terminé si vite ! Bravo

[@videv9858]

Hahaha tu m'envoies ravi ! Merci pour ton commentaire :))

[@ParzivalEu_]

J'adore ton énergie, ta bonne humeur, t'es explications ! "Comment typer un composant, bah un composant c'est quoi ? Une function, on sait déjà typer une function !! :D :D" J'adore ce passage xDDD

[@videv9858]

HAHAH merci !! il est super sympa ton commentaire :))

[@ParzivalEu_]

@@videv9858 J’aime ton énergie et ce que tu dégages !

[@RickyBERTRAND-zf6op]

Un grand merci pour le partage, toujours de la qualité. GG à toi sensei 🙏🙏

[@CompagnonDeCode]

J'en suis à 3 minutes de vidéos. La qualité du travail fourni est ENORME !!! Je retourne voir la suite !

[@videv9858]

Alors, verdict après 1h ? 👀

[@sebastienlambranca6197]

Très bonne pédagogie. merci

[@jean-christophehuchard6442]

J'ai kiffe ta vidéo même mon chat est reste pour regarder 🤣🤣. Franchement très clair. "de tyyyyypeee" .👍👍😁😁

[@videv9858]

MDRRRR !!! 😂 Bon au moins t'as retenu et à chaque fois que tu typeras explicitement une variable, tu entendras ma voix dans ta tête 😅

[@jean-christophehuchard6442]

​@@videv9858 c est exactement ca 😂

[@romfasul]

Un band pour vous 👋👋👋, je n'ai jamais vu un professeur comme vous. Vous me redonnez goût à la programmation... Je suis abonné 5/5

[@videv9858]

Ralàlà, ton commentaire me donne vlà le sourire ! Merci à toi ✌

[@loulou81400]

On va voir si tu lis vraiment tous les commentaires monsieur le dev !! Encore une super vidéo monsieur, vraiment top !

[@videv9858]

Merci à vous monsieur Loulou ! :)) Manque plus que Typescript et vous serez stock aussi dans votre code 💪🏋‍♂

[@desireedeutou571]

Merci de prendre le temps de nous partager tes connaissances avec une excellente pédagogie en plus !!!👌🙌

[@videv9858]

Merci à toi Desiree pour ton soutien ! Et ce depuis React En Entreprise même :))

[@palomaaubeau2258]

Merci beaucoup pour cette vidéo. C'est hyper clair, la pédagogie est top. Un grand bravo

[@videv9858]

Merci Paloma 🙏 😊

[@julescesar4183]

Merci de nous transmettre une partie de ton savoir ici 🙌

[@videv9858]

Merci à toi pour ton commentaire sympa :) Ave César 👋

[@patrickemery]

Formation très ludique et professionnelle. Merci ViDev pour ton immense générosité. Y'a pas mieux pour comprendre TypeScript.

[@videv9858]

ViDev te remercie Patrick ❤

[@TcHiiZoO]

Pédagogie toujours aussi incroyable, je te tire mon chapeau ! Ta présentation du début, hyper soigner et très claire c’est un game changer 🚀 Bravo pour cette formation, au top comme toujours 💯

[@videv9858]

Vous m'honorez avec votre commentaire cher Chadi - merci ! ❤

[@nicomiloo]

Pédagogie et explications au top !

[@videv9858]

Ton commentaire est au top nico ! :)

[@jeromeg3605]

J'ai vraiment beaucoup apprécié TypeScript en 1h et appris beaucoup de chose, tu as vraiment une très bonne pédagogie, merci aussi pour les nombreux "Tips" pour les event entre autres, même condensé en 1h on a le temps de faire le tour, je vais continuer sur cette lancée en essayant d'appliquer tout ça dans un projet (je ne sais pas encore quel projet mais bon je vais trouver 😁 ) en tout cas merci encore, à bientôt au détour d'autres vidéos. Bonne soirée et bonne continuation dans tes projets futurs.

[@videv9858]

Merci Jerome pour ton long commentaire, il me motive à vous créer encore plus de contenu comme ça :))

[@raazyaa]

Excellent, pédagogue de fou !

[@videv9858]

La société ViDev vous remercie pour votre commentaire très sympa ✨😊

[@Willow_PX]

Mec ta vidéo est incroyablement bien faite ! Tu es pédagogue, clair et précis dans tes explications sans que ça devienne chiant et pourtant c'est une vidéo de 1h30. Vraiment continu comme ça tu gères et tu gagnes un abo !

[@videv9858]

Un grand merci, et merci pour ton abonnement :))

[@beyrahdesquith4090]

Le meilleur tuto sur Typescript que j’ai pu voir! chapeau et merci pour le savoir 💪👏🙏

[@videv9858]

Merci pour ton super commentaire 🙏

[@romeocaillon2506]

Merci !! super fil conducteur pour l'apprentissage, j'ai compris en one shot 🙏

[@videv9858]

haha merci Romain :))

[@karimkrimou399]

Trop fort le pec ,bravo bro

[@videv9858]

merci Karim :)

[@kenshinhimura3140]

Tu m'as appris react à l'époque et la tu vas m'aider avec typescript

[@videv9858]

C'est le but !

[@kenshinhimura3140]

@@videv9858 merci l'ami en tout cas

[@karimkrimou399]

Vraiment cette vidéo est un délice,c'est je la regarde pour la 3 eme fois et je savour ,tout est y détaillé,chapo frère ca me donne envie de travailler avec ou même pour toi si c'est possible, vidéo en or bravo

[@videv9858]

Hahaha c'est très gentil Karim, merci pour ton super commentaire :)) Parle moi de toi : t'en es où dans ton parcours dev ? T'es déjà en poste ? T'as commencé quand le dev ? Qu'est-ce qui t'as amené à t'intéresser à TS ?

[@so5_ne610]

Une vidéo plus que bienvenue ! J'ai "finis" d'apprendre JS et je voulais passer a Typescript , très heureux que tu sortes cette vidéo! Toujours limpide :D

[@videv9858]

Heureux d'arrivé à point nommé ! Tu vas te mettre sur quel framework : Angular, Vue ou React ?

[@so5_ne610]

J'ai un peu tâté du React car React Native m'intéresse pas mal mais via ma formation ma spé est Angular ! Alors on va commencer par ça ! :)@@videv9858

[@so5_ne610]

J'ai tâté du React car React Native m'intéresse pas mal mais la spé de ma formation est Angular alors je vais commencer par ce framework et je tiens a préciser que t'as vidéo explicative de React est super , vraiment d'une pédagogie ultra qualitative! @@videv9858

[@morelyves7298]

😮 Merci Mr!

[@videv9858]

Avec plaisir :)

[@itachouille5127]

Top, merci

[@videv9858]

Merci, tu dois avoir "l'oeil" pour les bonnes vidéo youtube 👁

[@abrahamouattara8757]

superbe ton explications tu vient de suprimer ma peur en ts mercie infiniment 🙏

[@videv9858]

J'ai réussi mon objectif alors :))

[@thomasawounfouet7395]

Merci pour le partage, tes videos m’apporte toujours une grande valeur ajoutée ❤

[@videv9858]

Merci Thomas, ton commentaire me fait démarrer la journée avec un grand sourire ! 🙏

[@thomasawounfouet7395]

@@videv9858 Avec plaisir, c’est ta première vidéo React en 1H d’il y’a un an qui m’avait orienté sur le choix du framework front (angular, React, vue) à apprendre quand j’hésitais encore sur mes choix techo front étant à la base un Dev Back End Python/Django/Flask. Et ça a été l’une des meilleures décisions que j’ai eu à prendre dans mon parcours de dev (non seulement il me facilite énormément la vie en terme d’UI par rapport à Boostrap) mais je me rend compte avec le recule qu’il devenu incontournable dans le monde du développement. En plus tu as un donc pour la pédagogie 🙏🏾

[@rapace333]

J'ai regardé cette vidéo et react en 1h, c'est vraiment super bien expliqué, je te remercie.💯

[@videv9858]

Ah, tu connais bien la maison alors ! Merci pour ton commentaire !

[@MrGeekLegend]

MAIS COMMENT T'EXPLIQUE TROP BIEN !!!! C'est in croy able !!!!!!!!!!! Sache que t'as aidé grandement quelqu'un qui veux progresser dans NextJS pour son alternance !!!! MERCI VRAIMENT ❤

[@videv9858]

Merci à toi pour ton superbe commentaire MrGeek !

[@user-ig5fx8ix5d]

Super vidéo !! Merci beaucoup. Il serait envisageable de faire une seconde vidéo pour approfondir. Avec les Ommit etc … stp

[@videv9858]

✍

[@ovna]

excellent !

[@videv9858]

Merci à toi ! 🫶

[@kesraouimohamed9611]

Merci 🎉❤

[@videv9858]

Merci à toi Hamed 🎉🥂💙

[@moiseprosper375]

Bonjour , j'attendais l'essentiel de javascript pour avoir les bases d'attaquer react en entreprise. Mais hélas bravo pour te tuto combien tres pédagogique ❤

[@videv9858]

Hahaha l'essentiel de Javascript, je conseille de l'avoir en même temps que tu apprends un framework. Comme ça, tu n'oublies rien de ce que tu apprends puisque tu "l'accroches" à un cas pratique :)

[@moiseprosper375]

@@videv9858 un tuto 🙏 avec l'essentiel de javascript sur les notions essentielles pour attaquer react

[@Stefoux]

Une fonction De tyyyyyyype ! 😂 trop bien ta vidéo

[@videv9858]

Hahahahah merci Stéphane ! 💛💛

[@hundrxhundr1901]

Je suis entrain de migrer un projet React en Typescript pour mon boulot et ta vidéo m'as bien aidé à revoir tout les basiques ! Tu mérites bien plus d'abonnés et de vues ! Merci à toi 🙏

[@videv9858]

Merci beaucoup !

[@videv9858]

Comment se passe la migration depuis ? T'as rencontré des difficultés ou bien c'est hyper facile pour toi ? Vous avez une deadline de livraison de migration ? Comment vous vous organisez ?

[@userinconnu2852]

Merci éclairage vraiment efficace et explications très clair. Pas de crasspouillerie ici de bout en bout félicitation 💪

[@videv9858]

MDRRRRR "craspoulleries", terme trop bien trouvé 🤣

[@videv9858]

Et merci pour ton commentaire ! 😊

[@userinconnu2852]

J’ai tendance à appeler les jeunes filles de mes proches des petites fées clochettes 🧚. Comme un adulte qui se respecte j’essaie de leur inculquer des valeurs comme la discipline et autres et que si elles ne suivent pas mes conseils elles deviendront des petites fées clochardes mdr. Mon mot d’ordre c’est discipline et craspouille c’est ta manière en somme de dire d’être discipliné ! Si ton sujet m’intéresse tu peux être sur que je regarderai ta vidéo qui sera du coup qualitatif par ta rigueur !

[@videv9858]

@@userinconnu2852 Elle est trop mignonne ton histoire avec les filles de tes proches userinconnu et MDRRR petite "fée clocharde" ahahahah 🤣 Tu dois être bien drôle, j'aurais kiffé t'avoir en session mentoring avec le reste des membres. On aurait grave rigolé et progressé 💯

[@Stefoux]

@@videv9858 Non non ! Imagine qu’il soit plus drôle que moi ? 😫😫😫 ça serait un cauchemar !

[@florentgironde7279]

super idée de réutiliser le même projet, si j'avais su j'aurais pas attendu 1 mois entre les 2 vidéos x)

[@florentgironde7279]

Seul bémol, l'IA de devBox me propose parfois les réponses en avance , ce qui SPOIL un peu la formation.

[@videv9858]

@@florentgironde7279 je te comprends à 1000%. J'ai moi meme éteint githup copilot dans les settings de codesandbox avant de commencer le cours car comme toi, je trouvais ça relou qu'il prédise mes écritures

[@florentgironde7279]

faudrait un GPT qui prédise et propose des erreurs @@videv9858

[@Stefoux]

Vi plus je regarde tes vidéos et plus j’ai l’impression de regarder Jamy et Fred à l’ancienne 😁 ! C’est super formateur et super bienveillant comme dans l’émission 😂 ! J’espère que tu nous prépare d’autres vidéos 😎

[@videv9858]

Beaucoup, beeeeeeaaaucoup plus ! :))

[@Stefoux]

@@videv9858 🍿

[@SuperKillahdon]

pourquoi t'es le goat ?

[@videv9858]

On essaie, on essaie 🔥Merci pour ton commentaire, il me donne vlà de la force ! :) Vraie question, tu t'y connaissais déjà en typescript avant de regarder cette vidéo ?

[@SuperKillahdon]

@@videv9858 un petit peu. Mais c'est encore plus claire avec tes astuces et tes explications. ça prend beaucoup de sens ! Bravo continue !

[@user-be4xi9mw3b]

Tu es le meilleur des meilleur vraiment mais dans ta formation ( suite de React en 1 Heure) je n'arrive pas a trouver le projet même après avoir renseigner mes informations...

[@videv9858]

Peux tu re-tenter de rentrer ton email ?

[@vireltv256]

Nextjs + ts + tailwind = l’amour

[@videv9858]

de ouf ! Et y'en a déjà 1 sur les 3 pour l'instant 👀

[@henochangemichaellonzokoff6036]

Est ce qu'on peut avoir une video sur la clean architecture en react. merci infiniement

[@videv9858]

oulà, c'est un gros sujet (de Senior) que tu me demandes là. Je suis pas certain que ça intéresse beaucoup de monde 😅

[@henochangemichaellonzokoff6036]

@@videv9858 d'accord

[@TardinDavy]

@@videv9858 moi je suis intéressé, j'ai acheté ta formation et j'en ai énormément appris.

[@SiboBalde1291]

bonjour pour ceux qui cree un projet react avec creat-react-app comment integrer le typescript ?

[@videv9858]

2 cas possibles : 1) ton projet n'a PAS ENCORE été créé avec CRA mais tu veux le créer avec TS dès sa création. Dans ton terminal, exécute cette commande : `npx create-react-app my-app --template typescript`. Cette commande va t'initialiser un projet React ave Typescript dedans. 2) ton projet a DEJA été créé avec CRA mais sans TS et tu veux l'ajouter après. Là c'est un peu plus compliqué mais tout est bien expliqué dans cet article ci-dessous car je n'ai pas la place de le faire dans les commentaires. Faudrait carrément une autre vidéo youtube là. L'article en question : builtin.com/software-engineering-perspectives/create-react-app-typescript

[@SiboBalde1291]

daccord merci vraiment vous etes le seule youtubeur qui m'apprend vraiment react vraiment chapeau à vous @@videv9858

[@Mugisama973]

Bro, c'est exactement une vidéo ainsi je cherchais. TypeScript dans React.. Beaucoup plus simple...

[@videv9858]

Veuillez agréer, monsieur, l'expression des remerciements de ViDev 🎩✨

[@ramytchikou7483]

le lien vers le code final marche t'il toujours?

[@videv9858]

Et là maintenant : ça fonctionne ?

[@ramytchikou7483]

@@videv9858ah ouais c'est réglé maintenant, merci boss.

[@jackmachine5773]

Salut Vi, Excellente vidéo, merci beaucoup! Mais là, je suis perplexe sur une chose: Si je fais export default function Fruit({ fruitinfo, onClick , ... mesAutresSuperProps}) ... ça se passe comment pour typer les props vu que mesAutresSuperProps est indeterminé ?

[@Pikmin-Pi-Pi]

Dans ce cas tu vas devoir étendre le type de tes rest props ou dans ton cas (…mesAutresSuperProps) au typage de FruitProps interface FruitInfoType { name: string; sweetnessLevel: number; } interface OtherProps { onClick: () => void; color: string; } interface FruitProps extends OtherProps { fruitinfo: FruitInfoType; } const Fruit: React.FC = ({ fruitinfo, ...mesAutresSuperProps }) => { // Utilisation des props // ... };

[@PikminPiPi]

@@Pikmin-Pi-Pisauf que tu as utilisé les interface …

[@Pikmin-Pi-Pi]

@@PikminPiPi et ?

[@PikminPiPi]

@@Pikmin-Pi-Piet bas t’as rien compris à la vidéo !

[@Pikmin-Pi-Pi]

@@PikminPiPi si j’ai tout compris 😒

[@Locksherty]

Super cours, je comprenais rien et grce a toi je vois la lumière. Je dois passer un test technique demain avec tu TS, si ça donne qqch, je te paye un coup à boire

[@videv9858]

MDRRRRRRR ce serait trop stylé ahahah

[@Stefoux]

Laisse tomber … j’ai trouvé un travail grâce à lui et il veux même pas que je lui offre un bubble tea … 😒

[@Stefoux]

Quand je suis au boulot et que je m’apprête à ajouter les deux points après un state, j’entends dans mon dos « de tyyyyyyype » 😂😂

[@videv9858]

Typer un state c'est avec des chevrons, va falloir regarder et relike une nouvelle fois la vidéo 😒

[@Pikmin-Pi-Pi]

J’en ai mawe

[@PikminPiPi]

Videv tu es plus fort en blagues que Stephahe

[@videv9858]

@@PikminPiPi chuuuut, faudra pas lui dire... Ça restera ... "entre nous" 🤫

[@Stefoux]

Pfff vous connaissez rien en trucs drôles 😏