Salut, c'est Nico de Code Garage.
Code Garage, qu'est-ce que c'est ? C'est un site qui regroupe énormément de ressources
gratuites et de formations payantes pour les devs qui veulent continuer à progresser, qui
veulent monter en compétence et passer de junior à senior.
Aujourd'hui, dans ce nouvel épisode du podcast, on va parler de TypeScript, comprendre exactement
ce qu'est TypeScript et comment l'utiliser.
Evidemment, pour bien comprendre le contenu de cet épisode, il faut déjà connaître
les bases de JavaScript.
Qu'est-ce que JavaScript ? Sinon, ça va être un petit peu compliqué à comprendre,
mais je vais essayer de rester le plus clair et le plus facilement compréhensible possible.
Donc, d'abord, pourquoi est-ce que TypeScript existe ? Si on fait juste une rapide analyse
du nom, TypeScript, c'est une contraction de type et de JavaScript, donc ce qui nous
apprend un petit peu déjà des choses sur sa raison d'exister.
JavaScript, c'est un langage non-tipé.
On parle aussi de type-page dynamique.
Ça veut dire que, quand vous déclarer une variable, vous n'avez pas nativement la
possibilité de dire à l'interprèteur JavaScript de faire attention à ce que telle
donnée corresponde à un type précis.
Si ça apporte un avantage de souplesse et de rapidité à l'écriture, on va dire
qu'on découvre assez vite que c'est au détriment de la qualité et la solidité
de la robustesse du code parce que ce code-là, il est beaucoup plus propice aux erreurs
humaines.
C'est justement pour pallier à ce problème qu'en 2012, Microsoft a sorti la première
version de TypeScript, censé aider les développeurs et développeuses web à produire du code
plus robuste.
Voilà pourquoi je ne conseille pas nécessairement d'apprendre TypeScript avant JavaScript,
parce que si on n'a jamais rencontré les problématiques liées à JavaScript auparavant,
en fait, c'est plus difficile de comprendre les vrais à toutes ce langage et comment
bien l'utiliser.
Qu'est-ce que TypeScript réellement ?
Maintenant qu'on sait pourquoi TypeScript a été créé, en réalité, qu'est-ce qu'il
fait ? Qu'est-ce qu'il a de particulier ce langage ? Est-ce que c'est un langage
indépendant de JavaScript ou est-ce que les deux sont quand même liés ?
En fait, on définit TypeScript comme étant un superset de JavaScript, un superset en
français, on parle surensemble ou d'inclusion.
Ça veut dire que, syntactiquement, TypeScript inclut toute la syntaxe de JavaScript et rajoute
des fonctionnalités par-dessus, comme par exemple la possibilité d'ajouter des types
statiques pour les donner.
Alors, est-ce que ça veut dire qu'un programme écrit en JavaScript est aussi un programme
TypeScript valide ? Eh ben oui, en fait, même si selon la configuration du compilateur
TypeScript, ça peut poser quelques problèmes, dans l'idée, un programme JavaScript peut
être compilé par TypeScript, il va juste être compilé de JavaScript vers JavaScript,
ce qui n'a pas réellement de sens.
Mais par contre, l'inverse n'est pas forcément vrai parce que dès qu'on utilise les fonctionnalités
ajoutées par TypeScript, le code ne sera plus interprétable simplement par un moteur
d'exécution JavaScript sans être compilé au préalable.
En fait, c'est cette nature qui fait que TypeScript, pardon, c'est un langage puissant
mais qui perd tout son intérêt s'il est écrit sans l'inter ou avec une configuration
trop stricte du compilateur.
Parce qu'en réalité, si vous configurez mal le compilateur TypeScript, eh ben le code
compilé, il ne sera pas suffisamment vérifié et donc il ne sera pas forcément ni plus robuste
ni plus rapide.
Parlons de la compilation un petit peu.
Dès qu'un programme est écrit en TypeScript, il va falloir le compiler en JavaScript parce
que quel que soit l'environnement d'exécution, web ou Node.js, le seul langage interprété,
ça reste le JavaScript.
Alors, petite parenthèse, ça, c'est à l'exception de Deno qui supporte nativement le TypeScript
mais qu'on retrouve encore, enfin pas encore en production, c'est une techno qui est vraiment
trop jeune.
Certains développeurs et certaines développeuses pensent que le TypeScript, c'est un langage
indépendant et qu'il a un effet pendant le runtime, donc à l'exécution.
En réalité, ça, c'est faux.
Une fois compilé en JavaScript, il reste plus rien de TypeScript.
La vérification des types statiques, ça se fait lors de la compilation et en fait,
une fois cette étape passée, votre programme n'a plus la possibilité de vérifier les
types de ces variables lors de l'exécution du code.
À part, éventuellement, si vous souhaitez vous valider les données chargées de manière
dynamique pendant l'exécution, ça, il y a des moyens pour le faire.
Je vous mets un article dans les notes de cet épisode pour découvrir comment faire en
change de la script, mais ça n'a rien à voir directement avec TypeScript.
Pour info, petite note, le compilateur du langage, il s'appelle TSC, tout simplement
pour TypeScript Compiler.
Et je vais vous raconter un petit peu comment on va s'en servir pour compiler votre premier
fichier TypeScript.
Qu'est-ce qu'il faut faire ?
D'abord, la première chose, c'est d'installer le compilateur TypeScript.
Vous pouvez le faire avec NPM en faisant NPM tirer G pour Global TypeScript.
Et une fois que vous avez installé ça, vous pouvez générer un fichier de configuration
de base pour le compilateur.
Il faut simplement faire TSC tirer tirer init.
Il faut savoir que par défaut, le code en sortie du compilateur, il sera compatible
avec ES3, donc une version très ancienne de JavaScript, mais vous pouvez changer ça
dans le fichier de configuration qui s'appelle tsconfig.json.
Et ensuite, on va simplement écrire un fichier index.ts.
Vous mettez ce que vous voulez dedans.
On va dire que vous allez pouvoir créer une variable, que vous allez typer par exemple
en string.
Vous allez dire que c'est égal à Hello World.
Et ça derrière, vous pouvez juste faire la commande tsc index.ts et vous allez voir
que ça va vous générer un fichier JavaScript à partir de votre code TypeScript.
Et vous allez voir qu'en réalité, ça va quasiment avoir rien fait puisque vous
avez utilisé votre code tellement simple que vous n'avez utilisé aucune spécificité
de TypeScript.
Donc, vos deux fichiers vont être quasiment exacts.
Maintenant, si vous voulez faire un test et vous voulez faire la même chose, mais vous
faites votre variable, vous la typez en string et par contre dedans, vous mettez directement
un nombre, 8 par exemple.
Et là, dès que vous allez vouloir compiler, vous allez voir que le compilateur va vous
dire attention, le type nombre n'est pas assignable au type string.
En fait, TypeScript nous a empêché de commettre une erreur en assignant une valeur de mauvais
type, ce qui aurait pu avoir des conséquences sur l'exécution de notre code si on n'avait
pas utilisé TypeScript.
Si jamais le sujet vous intéresse et que vous voulez aller un petit peu plus loin,
ici, j'ai essayé de vous présenter vraiment la base de TypeScript pour comprendre la nature
de ce langage, pas se tromper et bien comprendre qu'à l'exécution, une fois qu'il a été
compilé, on ne retrouve plus du tout de vérification de TypeScript.
Mais j'ai essayé de vous faire d'autres épisodes pour aller un petit peu plus loin.
Et si jamais il y a quelqu'un qui a écrit un guide qui s'appelle TypeScript en 5 minutes,
donc c'est le guide officiel sur le site de TypeScript et je vous mettrai le lien dans
la description de l'épisode pour que vous puissiez aller apprendre exactement la syntaxe
de TypeScript rapidement.
Et vous avez même un playground en ligne pour vous amuser, taper du TypeScript et voir
ce qui se passe.
Je vous mettrai aussi le lien en description de l'épisode.
J'espère que ça vous a été utile et que vous aurez un petit peu plus compris ce
qu'est TypeScript en réalité.
Moi, je vous donne rendez-vous sur le site code-garage.fr pour retrouver tous les épisodes
du podcast, pour retrouver tous les articles de blog et les formations.
Et évidemment, si vous avez la possibilité de laisser 5 étoiles à ce podcast, ça permet
de tout simplement mettre en avant notre travail et aussi de faire référencer encore
mieux le podcast.
Donc, ça serait vraiment génial.
Moi, je vous dis à la semaine prochaine pour un nouvel épisode.
Ciao !