Spécial news - Juin 2022

Durée: 49m22s

Date de sortie: 22/06/2022

Un passage en revue des news et releases de nos outils et technologies de développement web des dernières semaines Retrouvez toutes les notes et les liens de l'épisode sur cette page : https://double-slash.dev/podcasts/news-juin-2022/

Bonjour à tous et bienvenue sur ce nouvel épisode où on va parler un petit peu de toutes les
de l'actualité qui s'est passé ces derniers mois. Comme toujours, c'est toujours très riche
dans la mesure où on fait du dev sur du web et le web évolue beaucoup tout le temps. Il y a eu plein
de conférences qui se sont mis en place, je pense avec la fin du Covid et tout ça,
toutes les conférences ont reprise. Et donc on a beaucoup beaucoup d'informations et donc on va
passer un petit peu en revue les points intéressants qui sont sortis ces dernières semaines. Et comme
toujours on va faire ça avec Patrick. Salut Patrick ! Salut à tous ! Alors on va attaquer peut-être
directement avec les gros gros informations des majors peut-être. Il y a Angular qui sort en version
14. C'est une version majeure. Il y a des gros gros points. Après il faut quand même dire que la
version 13 était sortie en novembre 2021. Du coup là on est en juin de version 14. Est-ce que c'est
un petit step ? Angular ils ont l'air d'être à peu près tous les six mois sur une version majeure
en fait. Alors après je suis pas un spécialiste d'Angular donc j'essaie de lire un petit peu les
nouveautés d'Angular. A priori il y a des nouveaux systèmes de components standalone qui sont des
composants en fait, qui sont indépendants en fait, autonomes. Donc on peut faire des composants
sans module puisqu'apparemment normalement il faut faire des modules pour pouvoir sortir un
component. En fait c'est des systèmes de modules et là tu peux faire un component qui marche tout
seul ou tu peux importer directement des choses dedans. Donc c'est une grosse nouveauté. Ça permet
d'être, c'est pas encore stamp mais ça permet de faire des composants un peu plus simples dans ton
application Angular. Donc il y a ça, il y a pas mal de nouveautés mais les principales c'est ça,
les standalone components, le type form. Donc apparemment pour le par défaut les systèmes
de formulaire deviennent type est strict en fait. Donc maintenant tu seras obligé d'avoir quand
tu utilises les formes groupes tout ça, les formes contrôles, c'est le type et les boules,
ils est strict par défaut. Après Angular est basé, t'es obligé d'utiliser TypeScript non ?
Ouais, TypeScript c'est déjà super tippé mais là encore pour les valeurs ça va être encore plus
tippé. Donc ça permettra et dise d'avoir vraiment les types d'informations qui soient
bien conformes à ce qu'on veut tout ça. Voilà, ça prend en charge TypeScript 4.7 qui est sorti
il y a pas longtemps et en target en fait il sera en ES 2020 donc ça permet de faire une
compilation avec des codes un petit peu plus petits puisque il y a moins de compilation,
moins de polyfill tout ça donc c'est pas mal. On a des applications plus légères et puis ils sont
en train de tester aussi un système de build. Alors c'est encore expérimental qui est basé
sur ESbuild et qui va se compiler en module ESM avec MaxTript, puis en module. C'est encore
expérimental donc normalement il faut mettre un petit flag pour compiler avec ça. Et après il y a
plein de nouveautés mais on mettra le lien de l'article qui résume toutes les nouveautés,
tout ça d'Angular pour les gens qui sont très intéressés sur Angular.
ESbuild quand même on le voit de plus en plus, il est en train de croquer un peu tout quoi,
c'est devenu un outil qu'on retrouve un peu partout. Et c'est la fin d'atome.
Tu utilises t'es encore atome ? Non, je fais bien longtemps que je n'ai pas
utilisé par contre j'ai utilisé sublime, j'ai eu ma période sublime sur sublime texte.
Après je suis passé sur atome, j'étais complètement dingue, c'était trop bien,
j'étais un ayatola de atome et j'ai mis du temps à passer sur VS Code.
Qu'est ce qui t'a fait passer sur VS Code ? Rappelles-toi.
Je ne me rappelle pas. Est-ce que atome te faisait chauffer l'ordinateur à l'époque ?
Oui, c'est vrai. Exact. On a tous basculé. En fait atome c'est sorti en 2011 et c'est vrai que
pour les utilisateurs de Mac et de Windows, on n'avait pas trop le choix à l'époque.
On avait sublime, on avait deux trois trucs, mais c'était pas génial.
Des fois c'était payant. Et atome est arrivé, c'était gratuit.
En plus, tu pouvais l'utiliser facilement. C'était le même entre Windows et Mac.
C'était super. Et c'était basé sur le système d'électrons.
Sauf qu'atome il chauffait pas mal. Il demandait beaucoup de ressources à l'ordinateur.
Et bizarrement, VS Code est sorti après. Et Microsoft, ils ont réussi à faire un truc
qui chauffait moins, qui était plus efficace. Je ne sais pas comment ils ont réussi à le faire.
Mais c'était pas bien sur Windows. Et pourtant, ça marchait mieux.
Du coup, on a tous circulé sur VS Code.
Et aujourd'hui, atome, c'était porté par GitHub, je crois.
Oui, c'est GitHub. De toute façon, c'est GitHub qui avait fait tout ça.
Heureusement qu'il est arrivé, puisque ça fait évoluer tous nos idées.
Mais le 15 décembre, c'est annoncé, c'est la fin, le 15 décembre 2022.
Merci à atome pour ton travail.
Au revoir, à atome. C'est terminé.
Mais ce qui est intéressant, c'est ce que tu disais, il était basé sur électrons.
Aujourd'hui, il y a quelques jours, est sorti la version 1 de Tory.
Tory, ça se veut un peu le digne successeur d'électrons.
Pour ceux qui ne connaissent pas Tory, c'est du développement web.
Par contre, on va exporter sur des plateformes natifs.
C'est vraiment l'équivalent que ce que pouvait proposer électrons.
Électrons, c'est basé sur Node.
C'est ça la grosse différence.
Alors que Tory est basé sur ?
Ça a l'air de fonctionner avec Rust.
Alors, je n'ai pas encore exploré.
Normalement, petite annonce, je dois faire un crash test sur YouTube de prochainement.
Certainement dans la semaine, où je vais essayer de steler Tory,
de voir comment ça marche tout ça.
Pour l'instant, je ne vais pas explorer.
Je ne sais pas exactement comment ça marche, mais c'est basé sur Rust.
Ça va permettre de faire des applications desktop.
Même des discros à plateformes.
Je ne sais pas exactement comment ça va fonctionner.
Mais version 1 vient de sortir.
Donc, on va tester ça.
Après, le projet est lancé depuis déjà un certain temps.
Par contre, là, ils arrivent en version un peu plus mature.
Là, c'est officiel.
On peut y aller.
Et donc, intéressant.
Je pense que c'est un projet qui doit être super sympa à regarder.
Et même à tester, crash tester pour voir ce qu'on peut faire avec.
Et ça, c'est plutôt intéressant.
Et qui sait ? Peut-être que VS Code va basculer sur Tory ?
Après, il y a tellement de choses à faire.
Et chaque migration, utiliser un framework quand tu as basé tout ton appli
sur un framework, il change tout.
Voilà, c'est un travail monstrueux.
Après, il faut voir s'il y a une sorte de portabilité qui peut s'opérer.

A voir.
En toute façon, on va tester ça dans la semaine.
Rester à l'écoute sur YouTube.
Nouvelle type de série qui double crash.
On va crash tester des applis, des librairies sur des formats vidéo
qui ne seront que sur YouTube.
Donc, vous pouvez nous suivre sur YouTube si ce n'est pas déjà fait.
Parfait.
Cypress, parce qu'on sait que les tests, c'est important.
Les tests, c'est la vie.
Les tests, c'est très important.
Test version 10 de Cypress.
Pour ceux qui ne connaissent pas Cypress, Cypress, à la base,
c'est un framework qui nous permet, en fait, c'est une surcouche
qui va nous permettre de faire des tests end-to-end.
Et donc, on va vraiment tester toute la fonctionnalité,
toutes les features.
Je vais sur cette page-là.
Dans ce champ-là, je vais remplir tel email, tel password.
Et je vais cliquer sur tel bouton.
Et en fait, on va écrire ces tests.
Et ça va lancer ces tests automatiquement.
Et on va pouvoir tester.
C'est vraiment end-to-end parce qu'on va avoir tout le scope.
On peut même tester les requêtes, attendre les requêtes.
Ce qu'il faut bien expliquer en test end-to-end et surtout avec Cypress,
c'est que tu as vraiment ton application qui s'affiche.
Et tu as un truc qui se passe.
Il va les remplir à un champ, etc.
On teste l'interface, ce que ça fait, ce que ça répond.
On peut tester les formuleurs, etc.
Si le formulaire enregistre bien, etc.
On vient vraiment simuler le comportement utilisateur.
On simule un utilisateur qui va tester un formulaire,
qui va se loguer, qui va changer,
ce balader dans le site, etc.
Ce qui est vraiment pratique avec Cypress.
Alors, Cypress, il y a deux modes.
Soit tu peux les écrire à la mano, tes tests,
en disant que tu vas remplir tel champ, etc.
Soit tu peux aussi utiliser un système avec la souris
pour qu'il crée lui-même le script.
En fait, il enregistre.
Donc c'est vraiment top.
Il y a une version payante et une version que tu peux héberger toi-même.
C'est hyper bien fait.
C'est hyper bien fait.
Les tests sont très faciles à écrire.
Après, il y a des baisses practices
à mettre en place,
de mettre des éléments spécifiques
pour ne pas jouer avec les id ou les classes,
d'aller récupérer un élément particulier,
d'injecter en tout cas
un attribut dans tes balises
que tu mets spécifiquement pour Cypress.
Et comme ça,
tes agnostiques totales
de te précauches, ton petit attribut.
Et qu'est-ce que nous offre la version 10 ?
Il y a pas mal de choses.
Déjà, ils ont changé l'interface utilisateur.
Ils disent NUAI.
C'est mieux.
Plus user friendly.
C'est pas encore testé.
Plus user friendly.
Il y a des nouveaux fichiers de config
en type script ou en JavaScript.
Une évolution au niveau de la config.
Il y a des migrations.
Ce qui est bien, c'est qu'il y a une migration automatique,
des anciennes versions de Cypress,
la nouvelle version de 10.
C'est cool.
Il n'y a rien à faire.
Et surtout, la grosse annonce,
c'est les components,
les testings de component.
On peut tester les components
séparément.
Tu vas afficher ton component.
Tu veux faire des choses.
Sans afficher tout ton interface complète.
On peut tester indépendamment
les components.
C'est une super évolution.
On va faire du test end to end
pour vraiment toute la globalité
de la page.
Mais on va pouvoir aussi faire
des tests unitaires
au sens propre du terme.

des tests dans l'environnement
du component.
Je vais pouvoir tester spécifiquement.
C'est ça ?
Oui, de toute façon, ça vient vraiment
dans la lignée de...
Aujourd'hui, on développe
un component.
Et après, tu l'intégres dans tes pages.
On fait vraiment bloc par bloc
aujourd'hui.
Donc ça vient dans cette logique de développement.
Maintenant, on va pouvoir tester les components séparément.
Tes blocs, ton formulaire,
ton truc, n'importe quoi, ton bouton.
Et qui va faire ce qu'il doit faire.
Exactement.
C'est super.
Parce qu'on avait Storybook
qui permet de visualiser tous les components séparément.
Tu peux déjà tester tout à même.
Faire interactif.
Tu peux vraiment les tester dans Cypress.
Et c'est vraiment
excellent.
À tester.
Quand tu parles de Storybook
transition aujourd'hui,
quand tu parles de Storybook,
il y a eu
la conférence
de vue
à Amsterdam,
où Guillaume Chaud
a parlé et a présenté
son outil sur lequel il est
travaillé.
Il s'appelle Histoire.
Dans l'écosystème
de vue, ils utilisent beaucoup
de mots français.
Petite vue.
Histoire.
Vite.
C'est top. On n'est pas dépaysés.
Après, ils sont obligés
de nous mettre
la définition
de comment tu dois le dire.
C'est facile, mais des fois,
pour les américains, ça, c'est pas évident.
C'est un petit peu plus compliqué.

c'est quoi, Histoire ?
Est-ce qu'on est proche du système
de Storybook ?
Ouais.
C'est
quasiment la même chose.
Comme toujours, Storybook, il est assez
décréé, même s'il a beaucoup évolué
Storybook, est souvent
critiqué pour le poids du bundle
final, et des fois, un petit peu le temps
de build, même si en ce moment,
ils travaillent sur la dernière version,
la 6.5, je crois.
Ils sont même en train d'intégrer vite
dessus, mais
il y a toujours des
projets, des sites projettes
qui ressemblent à Storybook, qui essaient
de faire la même chose, et souvent, ils sont un petit peu mieux.
Ça fait avancer le Schmilberg,
et ça pousse Storybook à faire mieux.
Histoire, c'est un truc qui est très adapté,
qui intégrer vite, etc.
et qui est très adapté pour vue,
et qui a l'air plutôt pas mal, donc
c'est encore assez récent, mais
je vais pas tester perso, mais
ça me semble prometteur.
Guillaume Chaud, il est bien connu pour faire
des bons
projets, donc je pense que
ça doit être sympa.
On lui doit beaucoup de choses,
sur tout ce qui est vu,

Guillaume Chaud qui est français, de Lyon,
à la base.
Et donc, super projet
qui rejoint
dans ce qu'on disait tout à l'heure,
justement,
où on vient écrire toutes les stories,
on vient tester les composants,
on vient tout centraliser,
on vient développer chaque bloc.
En fait,
à quoi ça sert Storybook rapidement ?
Storybook, ça permet
l'histoire.
En fait, ça permet, vu qu'on développe nos compagnons
séparément, qu'après, on les intègre dans les pages,
ça permet d'afficher
une sorte de bibliothèque
de tous les composants.
Donc, tu as une sorte de sidebar
à gauche avec ta liste de composants,
tu cliques sur le composant, c'est une sorte de menu,
et ton composant s'affiche.
Et tu peux jouer avec lui, en fait, il est interactif.
Donc, voilà, si tu as un truc
ou tu dois remplir des champs, ou des boutons
qui vont afficher des choses, tu peux cliquer,
machin. Et l'intérêt de tout ça,
en fait, c'est surtout
quand tu travailles en équipe, avec des designers,
avec des chefs de projet, tout ça,
l'intérêt, c'est qu'ils peuvent contrôler
le component
facilement, à travers cette bibliothèque,
sans devoir lancer le projet, etc.
Et pour ça, c'est vraiment top.

Cool.
Un projet à suivre.
Oui, histoire un projet à suivre.
C'est bien, il y a tout un écosystème qui se met en place
autour de vues, avec des projets assez robustes.
Il y a vraiment
un écosystème qui permet vraiment
aux développeurs spécialisés en vue
de faire des bonnes choses.
Cool.
Et quand tu parles de vues, justement,
il y a la version
Vue 3 qui est sortie.
Yes.
C'est toi qui m'en parlais, ça.
Et en fait, ils
continuent quand même à faire
une évolution sur la version 2.7.
Donc la version 2
qui continue, en fait, à évoluer.
Alors, elle est encore
sortie en beta.
Il y a, ben, hier, on est le
20 juin.
Et donc,
ce qui est plutôt pas mal,
c'est qu'on va retrouver pas mal
de fonctionnalités qui sont propres
en fait à la version 3.
Je pense à la composition IPI,
je pense à la
Tribuse Setup, en fait,
qu'on va injecter directement
dans la balise script pour ceux qui
font du vues, qui va nous permettre
d'être un petit peu plus
concis et vraiment d'utiliser
toute la puissance de la composition IPI
avec les composables,
les use, machins,
qu'on retrouve souvent
qui viennent un peu
de réactes et qui sont aujourd'hui
adoptés aussi dans l'écosystème
Vue. Après moi, je suis un gros, gros
fan de CSS
V-Bind, là.
En fait, on va pouvoir binder le CSS
et c'est vrai qu'aujourd'hui, on était
obligés de faire un peu des trucs
pas toujours
pas très esthétiques à lire
en tout cas. Et là, le fait
d'avoir, de
pouvoir injecter des variables
dans notre CSS
dans la partie script de notre composant
parce que pour
pour expliquer, très très vite fait
en réacte, on va
avoir du CSS et du HTML
et du JS qui va être un petit
peu plus
tout mélangé
alors que sur Vue
on va dire ça
je suis super calme
mais gentil. Alors que
dans Vue, on va vraiment
avoir 3 parties distinctes
la partie template, la partie script
et la partie style
ce qui amène
vraiment une séparation
par contre
passer du template au script
ça passait plutôt bien
par contre du script au
style, justement
c'était un petit peu plus compliqué donc on était obligés
de faire du style avec dans le template
on arrivait toujours
à faire quelque chose. Le fait
d'avoir maintenant, à avoir cette
fonctionnalité là
ça amène une grande, grande, grande liberté
et justement, faire des choses
un petit peu plus
plus propres et donc c'est top
c'est top
c'est empêta encore
c'est empêta mais c'est génial
pour
tu prends les projets qui sont
des gros projets aujourd'hui qui sont développés avec
Vue 2, les mecs qui savent pas
est-ce qu'on passe au 3 machin tout ça
bah non, peut-être qu'avec la 2.7
pas besoin, tu peux faire évoluer ton projet
exactement
et je pense que c'est un super
tremplin pour passer
de manière vraiment hyper progressive
justement à la V3
ou
en fait le gros
chisme, mais même qui a eu
dans la communauté, c'est qu'on a tout fait
en option IPI
et maintenant
Vue 3 nous demande la composition
IPI et donc il faut réécrire
beaucoup de choses
même si dans la partie
de Vue 3 on peut continuer
à utiliser l'option
par contre
oui, sur des vieux projets
on peut faire une migration
progressive quoi, donc
ça me paraît plutôt
intéressant
et donc
c'est pas mal
d'utiliser les nouvelles
fonctionnalités
c'est super de voir que la 2 est maintenue
ça donne
encore confiance pour les projets qui sont en 2
et surtout, je pense que c'est un truc tout bête
mais tu vois, tu as des devs qui bossent sur la 3
par exemple en ce moment
et puis tu dois revenir sur un projet
en Vue 2, tu vois
et ça te fait bizarre, d'un coup
tu dois régresser en quelque sorte
donc si tu arrives à refaire la composition
IPI sur la version 2.7
tu vas pouvoir faire
un moins de choc
quand tu vas passer d'un projet à l'autre
oui, bien sûr
bien sûr, carrément
carrément et de toute façon
c'est toujours appréciable
pour
l'expérience
développeur
on parle de Fastify
on va parler
de Fastify DX
DX, la développeur
expérience
qui
est-ce que tu peux nous parler
justement de Fastify DX
en Fastif
oui en fait, Fastify DX
en fait c'est un adaptateur
toi tu connais très bien Fastify
puisque tu l'utilises
donc c'est un adaptateur qui se met sur Fastify
qui est un serveur node
du type
équivalent, pas de bêtises
mais c'est pas vraiment équivalent, mais express
pour faire un petit peu savoir à quoi ça sert
c'est le successeur
arrêter d'utiliser
mais utiliser Fastify
Fastify c'est hyper rapide
il n'y a pas d'équivalent avec Express
mais ça fait, c'est un serveur
serveur node
Fastify c'est top
et donc c'est basé
sur des plugins et des adaptateurs
machins que tu rajoutes
sur Fastify
et donc un adaptateur
pour faire du rendu serveur de React
qui fonctionne
un peu comme Next
qui va te rendre ton application
sur le serveur qui va te la envoyer
et voilà, c'est assez récent encore
le truc c'est que c'est hyper light
en fait, je crois
c'est moins d'un kilo octège
le corps, c'est vraiment très très petit
et après tu fais ton application
classique, il y a un exemple
sur la dock
et voilà, on mettra en commentaire
donc pour faire des serveurs
Fastify qui renvoient
de la web app React
ça peut être pas mal à suivre
et donc ça par contre
ça vient en frontal direct
avec Next, on est d'accord ?
bah, c'est Avoir
Avoir, parce que bon
ils disent des outils POS CSS
une OCS Valetio pour tout ce qui est
CSS R et tout mais
Avoir, parce que
Next, il y a un comme Next
un écosystème qui est vraiment complet
donc Avoir s'il y a l'équivalent
mais après ça dépend de projet aussi
sur un projet où tu n'as pas besoin
d'énormément de fonctionnalité
ça peut faire l'affaire
et surtout c'est hyper light
et Fastify est très rapide
donc ça peut vraiment être pas mal
après, est-ce que ça serait pas
pour des projets qui ont plus
une grosse dominance
back mais qui ont besoin
d'un petit peu de frontes
est-ce que là ça serait pas
intéressant ?
je m'explique si c'est pas assez clair
en fait
Next, ok
Next ou Nuxt
si 90%
de ton appui métier
c'est du back end
est-ce que c'est intéressant de passer
sur des frameworks comme ça
en
bah, ouais, t'as raison
oui, oui, oui, effectivement
en fait, pour moi j'ai l'impression
mais peut-être que je peux me tromper
et dites-le nous en commentaire
et envoyez-nous des emails en disant
on n'est pas d'accord
mais Next et Nuxt sont avant tout
des projets frontes
sur lequel on va pouvoir greffer
des serveurs
des serveurs
des rendus serveurs
mais ça reste des projets frontes
alors que Fastify
c'est un framework back end
donc néanmoins
parfois ça peut nous avoir
on peut avoir besoin d'avoir
quelque chose à afficher
et éviter
de développer
une usinagaz pour afficher 3 pages
ou un dashboard très rapide
bah peut-être
que justement Fastify
ce Fastify DX React
nous permet
de mettre
un élément front assez léger
rapide sur notre back end
qui représente
la grosse partie de notre appli métier
est-ce que c'est un peu plus clair
ou pas triqible ?
bah en fait, je sais pas trop
parce que généralement
le rendu serveur on l'utilise principalement
parce que le notre app est soit
indexé en SEO
parce que sinon on s'en fout en fait
finalement le rendu serveur c'est principalement pour ça
donc après
sur un back
il n'y a pas vraiment besoin
d'avoir un rendu serveur
à part pour augmenter la vitesse de rendu
je sais pas honnêtement
après aussi
ça peut être plus facile
j'ai déjà mon serveur qui tourne
je vais pas relancer
je vais pas faire une autre appli
avec toute la problématique
que ça amène
donc il faut que je communique avec mon front
et mon back via une API
via du transport de données
là j'ai directement mon back
j'ai 3 pages à afficher
je le fais directement depuis mon fastify
enfin c'est là
où ça me semble assez logique
quoi
je pense que c'est une bonne alternative
c'est vrai que next après
tu as des fonctionnalités et des features
comme le static regeneration
des trucs comme ça
peut-être effectivement si tu as besoin de faire un site
avec 4 pages type web app
et que tu n'as pas besoin
d'avoir tous ces systèmes de regeneration statique
et que tu veux vraiment un truc qui crash rapidement
ça peut être pas mal en fait
tu vas te sortir ton app
elle va te la rendre serveur hyper rapidement
le cache tu t'en fous
c'est assez simple comme application
par exemple
après je pense que c'est comme tout
il n'y a pas d'outil baguette magique
je pense qu'il faut bien définir
bien définir le scope du projet
mais moi ce que je vois
c'est surtout
ton projet il est avant tout back
je vais faire du calcul de rendu
je vais faire la génération
ton projet il est avant tout back end
et tu as besoin
d'afficher des choses
tu ne vas pas à rogue
développer une autre appli à côté
tu vas le faire directement depuis
fastify avec ton rendu
si tu fais une appli
tu peux rajouter ton interface
tu peux rajouter ton interface directement dans ton app
tu regardes avec ton super outil
ton petit plugin
que tu as à gauche
tu verras qu'il y a Fastify
Dx React mais il y a aussi
Fastify Dx Solid
Svelte et Vu
à gauche
la colonne de gauche
ah oui ok
alors c'est une petite extension
pour ceux qui ne vous voient pas
sur Youtube
c'est une extension qu'on installe
sur VS Code qui nous permet
d'avoir un menu
sur notre gauche
de GitHub et dans les projets
dans lesquels on navigue on a une navigation
verticale
ça s'appelle Octotree
je vous invite fortement à l'utiliser
parce que c'est vraiment bien
et donc le Fastify Dx
React mais il y a la même chose pour
Solid
il y a la même chose pour Svelte
je pense Svelte
il serait... ah ok je pense pas
encore fait
vu il y a quelque chose
vu c'est en place
et
ok
donc il existe pour vu, pour React pour l'instant
et la suite arrive
excellent
framework
frontaine
frontaine agnostique
comme on dit
parfait
allez comme on parle de framework
on va parler
d'un nouveau framework
alors
on est parti dans la hype
du nouveau framework
Next Generation
framework
par contre lui il est basé sur
Delo
donc il est l'équipe
de une grosse partie
de l'équipe de Node
a créé ce nouveau
rendu server
ce nouveau runtime
et donc qu'est ce qui amène
ce nouveau framework fresh
faut rappeler que Deno
en fait
c'est du rendu server javascript
mais en fait si tu veux ça remplace Node
faut bien
on est pas comme Fastify ou qu'il y a un système
de serveur pour Node
non mais carrément ça remplace Node
c'est une runtime
en fait javascript
qui permet
de substitution et qui permet en plus
d'utiliser des tabscript directement
et qu'il compile à la volée
et qu'il va le faire fonctionner
sur ton serveur
et donc c'est un mec de la core team
de Deno qui a lancé ce framework
ce web framework
qui est encore en mode beta
enfin
on doit pouvoir quand même l'utiliser
je pense et il y a pas mal de features
qui sont intéressants
et donc le justin time rendering
qui est pas mal on the edge
alors ça on en parlera
alors c'est
le justin time rendering
c'est le rendu sur le edge
donc le edge computing
attention
trigger spoiler alert
on va justement on va faire
un épisode sur le edge computing
parce qu'on voit ça un petit peu popé partout
et on va faire un épisode
dessus pour répondre à la question
c'est quoi le edge computing
pourquoi c'est intéressant
et pourquoi
en fait c'est mis en première liste
en fait en première position
de la liste
ok
alors c'est
quoi ça le island based
client hydratation
alors c'est le système
de
en fait c'est astro qui avait lancé ça
c'est un système de
on appelle ça un système de
de deal en fait
comment ça fonctionne en fait c'est que
en fait au lieu de cracher
si tu prends next ou next
ils vont te renvoyer une web app complète
donc ta page en fait ça sera une web app
avec du vu du vrai tout ce que tu veux
et en fait le système de deal d'island
en fait c'est différent c'est qu'en fait
il va te renvoyer une page html
et en fait le seul élément
qui doit être interactif c'est là où ça sera
un élément javascript
qui sera hydraté etc et donc
ça permet en fait d'hydraté
uniquement ce qui a besoin d'être hydraté
ce qui va être interactif et tout le reste
le contenu qui est statique
il reste statique il reste en html
classique et ce qui permet d'avoir
un chargement extrêmement
rapide de la page puisque il n'y a pas besoin
d'hydratation il n'y a pas cette étape d'hydratation
de toute la page ok et c'est pour ça qu'en bas
il y a des points qui se sont dit
sur la ligne du bas 0 runtime overload
donc en fait il n'envoie pas de javascript
à part
sur ces espèces de composants
qui ont besoin de cette hydratation
c'est exactement le même système
casse trop et petit à petit
ici il met un peu tous et il y a d'ailleurs même 11 tigres
qui sont en train de travailler dessus
en fait par défaut il n'y a pas de javascript
en fait il va te renvoyer du html
et si éventuellement tu as un élément qui est interactif
on prend toujours exemple du formulaire
ou des choses comme ça
et ben c'est à ce moment là qui va aller
l'hydrater avec javascript
et le faire fonctionner et en plus
ce qui est très fort dans ces systèmes là
alors je sais pas s'ils le font sur celui là mais sur astro
ça marche c'est qu'on peut faire
une hydratation et donc un téléchargement
des dépendances javascript
au moment où le component est visible
en fait donc c'est encore plus fort que ça
c'est vraiment extrêmement puissant
parce que
ça veut dire que par défaut à page il n'y a
pas de temps en temps où le component est visible
que ça devient interactif et qui charge le javascript
donc très très puissant
en fait ils sont en train de prendre
toutes les meilleures pratiques et le mec il a fait
un framework avec ça
ok excellent
après là je vois
ça use
ça utilise
préact
est-ce que tu peux nous dire
c'est quoi préact
alors préact c'est
une série
équivalente à react
le mec est extrêmement légère
et après la syntaxe c'est très proche
de react il y a quelques différences
mais dans l'ensemble c'est pareil il y a du javascript
pareil et pourquoi c'est hyper light
en fait tout simplement parce que préact ils ont
fait le choix
d'être rendu uniquement sur le web
alors que
réact il est utilisable dans plein de
quatre figures que ça peut être
sur mobile, sur une télé etc
ce qu'il faut savoir c'est que dans react
en fait ils ont
synthétisé en fait tous les événements
le onclick par exemple
c'est pas le onclick de la page web
c'est un onclick qui est
dans react et qui va appeler en fonction
de la plateforme
où il est et tout ça ça fait
d'une sorte de proxy on pourrait dire
oui c'est ça en fait
il y a des events qui sont vraiment propres à react
c'est pas les évents naturels de la page web
en fait
c'est pas un document
donc ils ont
ils ont fait tous ces systèmes d'événements
ils ont fait pour que ça s'adapte
dans une plateforme et tout ça ça fait que react
forcément il est un petit peu plus lourd et préact
en fait eux par contre ils utilisent
les systèmes de natif par défaut
puisqu'il ne fait que du web donc ce qui fait
qu'il est hyper light et préact
est vraiment très très très très léger
de base et
pour ça il est assez puissant
et après tout est très proche de react
en niveau écriture tout ça c'est vraiment
si vous avez des projets
uniquement web
souvent préacte
regardez-le parce qu'il est pas mal
il fonctionne très bien et il est hyper léger
on voit un exemple
vous voyez bien du jsx tout ça c'est tout pareil en fait
ok
parfait
donc fresh
qui est le framework
basé sur
dino
qui prend type script
par défaut
d'accord
ok
il faudra tester
il semble pas mal
tout ça ouais
on continue un peu
dans l'histoire des frameworks
redwood
2.0
il sorti la première version
il y a pas longtemps on en avait parlé
juste avant
ok
alors pourquoi
il passe déjà à la 2 ?
c'est très intéressant j'ai lu l'article
il y a un super intéressant
Tom Preston Warner il a fait un article
alors déjà j'ai appris que c'était lui qui avait créé la version
sémantique
des logiciels je savais pas du tout
c'est la version sémantique en 3
le 1 majeur, 2 mineurs, 3 backfix
ouais c'est ça voilà
il y a même un 4ème apparemment il explique
dans l'article
il y a un 4ème chiffre qui peut être utilisé
si tu veux mais bon personne n'utilise
en fait je savais pas que c'était lui il explique
il y a 10 ans ils se sont assis ils ont écrit
les sémantiques versions et qui aujourd'hui
est utilisé partout en fait
et par contre voilà après il revient
dessus il dit le problème c'est qu'aujourd'hui
les gens ont peur de
faire des versions majeures
quand ils ont sur un logiciel
ou un framework n'importe
parce que souvent les versions majeures il y a des break in change
et souvent ils doivent s'expliquer
de pourquoi ils font ci, pourquoi ils font ça
etc etc
et en fait les versions majeures
ils deviennent sacrés en fait
les gens, les développeurs
ont de plus en plus de réticence
à sortir des versions majeures
et ça devient un problème en fait
et donc... alors que ça devrait pas
et oui ça devrait pas en fait
il dit que si tu fais des break in change
il explique bien pourquoi tu les as fait
il y a pas de problème en fait
c'est ce qu'ils ont décidé de faire pour redwood
ils ont décidé de...
il dit si on doit supporter
si on fait pas de break in change
si en plus on doit supporter les rétro compatibilité
on peut pas avancer en fait
donc c'est vraiment un problème
donc il assume complètement de faire des break in change etc
et donc il dit
pour que ça soit
plus simple en fait
parce que forcément tu as beaucoup de break in change
il dit que si tu fais une version majeure tous les ans
tu vas te retrouver
avec beaucoup de break in change
forcément d'un coup
et donc un développeur qui doit passer
une application d'une version à une autre
ça lui fait beaucoup de travail
donc il dit c'est beaucoup plus simple
si on fait une version majeure plus souvent
parce que ça fera moins de break in change
et pour le développeur
ça lui fait moins de travail et donc ça sera plus facile de passer
une version à l'autre voilà
donc en fait il est en train de nous dire que dans nous
dans notre inconscient de développeurs
ce qu'on appelait des mineurs
en fait lui il est en train de les passer
sur des majeurs
ils vont faire des majeurs régulièrement
plus rapidement
avec éventuellement des choses qui seront cassées
mais comme il n'y en aura pas beaucoup
il n'y aura pas un énorme travail
pour passer une version à l'autre
assumer quoi on assume
et assumer et c'est pété on va tout compter
on est obligé de faire ça sinon on ne peut pas avancer
voilà
là je vois
annoncign redwood 1 le 4 avril 2002
on est en juin
ils font la version 2
ils y vont
3 mois après
c'est fait
non mais c'est pas bête en fait
si tu réfléchis c'est pas bête du tout en fait
ça se tient
donc les autres vont suivre
je sais pas mais on verra
et du coup en version majeure
il y a WordPress
qui est passé en 6
on va parler un petit peu de WordPress
on en parle pas souvent
et on fera peut-être
un épisode spécial sur
Githemberg prochainement
pour en parler un peu plus
donc la version 6.0
est sortie le 24 mai 2022
donc eux
par contre ils continuent à suivre
le système de version dig majeure
c'est à peu près tous les ans
qui sort une version majeure je crois
même si ça s'accélère un petit peu ces derniers temps
ils ont vraiment un calendrier
alors ce qui est bien sur WordPress
c'est que tout est
assez structuré
franchement c'est un super bon exemple
pour WordPress
de projet open source
au niveau de la structuration etc
de la documentation, des contributeurs
tout est vraiment bien fait
tout est clean
c'est un beau projet à suivre
si vous intéressez à l'open source
de ce côté là c'est vraiment top
et donc la version 6 en fait
c'est une version majeure mais qui casse pas grand chose
en fait
ce qu'ils font maintenant c'est que petit à petit
les dernières versions en 5.9
en fait ils incluent
des choses qui
cassent un petit peu
au fur et à mesure des mineurs
ce qui fait que si ta 5.9 fonctionnait
tu passes à la 6 normalement
il n'y a pas trop de soucis
ils y vont progressivement
donc c'est pas mal
c'est une autre façon de faire
plutôt que d'arriver à la 6
tu mets un route
le problème c'est que
le public de WordPress
est majoritairement
de composés
de personnes pas forcément techniques
on parle de webmaster
on parle aussi de public lambda
qui fait son petit site à la maison etc
et en fait si tu veux
si demain tu as une personne
qui a son site qui fonctionne
qui clique sur le bouton
parce que tu cliques sur un bouton
pour mettre un jour sur WordPress
tu cliques sur le bouton et ça te met à jour sur la 6
et là ça te pète tout
ça risque de être problématique
là tu pleurs et surtout si tu connais rien
et là c'est un score
savez-moi mon site il est cassé
donc c'est pour ça qu'ils y vont un petit peu
un petit peu plus progressivement pour ce public
après c'est aussi basé sur la communauté
justement ils doivent très bien connaître
leur communauté
c'est de façon où WordPress est utilisé partout
partout donc
ils peuvent pas sortir
en fait je pense pas qu'ils puissent
tenir une politique
aussi agressive que peuvent faire
au redwood en mode
nous on fait des breaking changes et on pète tout
on s'en fout quoi je pense que le public
qui a en face
les utilisateurs
les parties prenantes de la communauté
comme tu l'as dit
je pense que c'est un petit peu moins tech friendly
et donc
c'est un peu plus difficile du coup
il faut la
il faut manoeuvrer peut-être
il faut être obligé d'aller doucement
la communauté est gigantesque
enfin il faut le savoir
la communauté est gigantesque et il est énormément utilisé
ils annoncent les 40% du web
40% des sites web c'est du WordPress
donc il faut quand même pas le négliger
et puis en plus ils ont
une politique de rétro compatibilité
donc ils vont très loin dans la rétro
compatibilité
souvent ils prennent en charge
et ils mettent à jour si t'as des
problèmes de sécurité
ils vont te mettre à jour les versions antérieures
en fait
alors là ils vont réduire parce que ça leur fait trop de travail
mais ils vont descendre jusqu'à la 4.9
je crois un truc comme ça
donc ça fait quand même des années en arrière
et ils vont te patcher en fait ces versions là
donc ça faut quand même se rendre compte
du travail que ça donne
bon bref
la version 4.6
la version 6 pardon
je sais plus où j'en suis
donc il faut savoir
que dans les dernières versions
la majorité
des évolutions
elle concerne Gutenberg
en fait Gutenberg est en train
de devenir le corps
de WordPress en fait
c'est-à-dire l'éditeur prend de plus en plus
d'ampleur et devient
principalement
en fait Gutenberg va devenir l'admine
complète de WordPress
qu'est-ce que c'est Gutenberg ?
c'est un système d'édition
de pages et bientôt de sites
directement dans ton navigateur
l'image de ce qu'on peut voir
tu prends des blocs, tu les mets sur ta page
tu les déplace etc
c'est la nouvelle version de
what you see, what you get
c'est exactement ça
et en fait ça va tout à fait dans le
développement de components de blocs etc
donc ils sont partis là dessus sur la version 5
donc ça fait quand même un moment
qu'ils travaillent dessus, l'équipe de dev
est excellente
donc tout est basé sur React
et l'outil est vraiment bien fait
et il évolue au fil des versions
et franchement moi je suis bluffé
par le travail de l'équipe de dev
Patrick il faut que tu nous fasses
un épisode de Gutenberg
React, tout ça pour que tu nous expliques
toutes les subtilités
où est-ce qu'on a tous les ressources
honnêtement le truc est vraiment top
et donc on fera un épisode spécial
je ne vais pas m'étendre là dessus
mais voilà, la version 6
c'est l'arrivée du full
site editing, donc le FSE
comme on dit, le full site editing
ça va permettre d'éditer complètement le site
là ce ne sera pas les pages, ça sera complètement le site
donc ton header, ton total navigation
ton footer, tout ça
donc tu vas pouvoir remonter ton site en fait comme ça
comme on peut le faire dans certains CMS
online qu'on utilise pour la gem stack
ou tu vas faire tes header
tout ça, voilà c'est un peu le même système
et donc petit à petit, c'est encore en version beta
mais ça arrive et des features
arrivent petit à petit et donc
c'est ça, c'est l'évolution
du FSE, les paternes
en fait, alors pour ceux qui font un petit peu
de WordPress, on a des blogs dans le Gutenberg
et on a aussi des paternes, des paternes c'est quoi
c'est comme un component
que tu utiliserais dans ton application
avec un titre, un texte, un bouton
ça c'est un pattern
et en fait ils ont rendu encore plus puissant
les systèmes de paternes, où tu peux tout simplement
faire un pattern dans un fichier
tu mets dans le dossier pattern de ton thème
et il va les trouver automatiquement
et à partir de là, tu peux l'utiliser dans Gutenberg
il y a plein de choses comme ça qui sont rajoutées
et aujourd'hui ça devient vraiment un plaisir de développer avec
c'est hyper simple
et il travaille aussi pour le full city editing
sur un fichier qui s'appelle
team.json
où tu peux
vraiment contrôler
tous les blogs de Gutenberg
et faire tout ça, bien un fichier
lui définir les fonctionnalités
si la police etc
si telle fonctionnalité, si il peut être aligné
à droite, à gauche
Patrick, je vais trop loin
ouais, tu vas trop loin
et en fait c'est super intéressant
et moi je pense vraiment que
ça mériterait vraiment
un épisode parce que
à chaque fois qu'on discute entre nous
tu me le dis
que WordPress a vachement évolué
que justement
Gutenberg a amené une véritable révolution
et on est passés vraiment
à autre chose
et je pense que ça serait intéressant
qu'on fasse un épisode là-dessus
cool
top
top
bah écoute, je crois qu'on a fait un peu le tour
des infos qu'on a
alors évidemment
il y en a beaucoup
par contre on a oublié
une qui est monstrueuse
c'est la fin
d'internet explorer
ça y est
j'ai pas les cotsillons
c'est fini
ça y est
c'est terminé
ça par contre c'est vraiment une super bonne nouvelle
on a pu asfader ça
bon après
il y en a qui on la chance de pas être
il y en a certains qui ont la chance
de pas avoir eu
à prendre en compte explorer 11
ça dépend
par contre quand il y avait client business
des entreprises
souvent on te disait
mais moi il y a des gens qui utilisent explorer 11
dans l'entreprise donc il faut que ça marche
sur explorer 11
et puis on a cette contrainte
là et on peut pas faire autrement
parce qu'on peut pas passer sur autre chose
et tu joues avec
là c'était polyfill sur polyfill
c'était vraiment la misère
c'est fini
donc c'est fini
Microsoft ne supporte plus explorer 11
c'est fini
ce qu'il utilise pas tant pis pour vous
et puis nous non plus on va plus
supporter de toute façon
ça semble supporte déjà
ça fait longtemps qu'on ne supporte plus
ok cool
et ben
parfait
en fait aujourd'hui on a quand même
des navigateurs chrome
safari
et gecko
firefox
et là
ça va dans le bon sens en fait tous les navigateurs
ils évoluent assez rapidement etc
ça c'est top
ça nous facilite quand même
vachement la visite
cool
et ben écoute
merci patrick
merci à tous d'être restés jusqu'au bout
de l'épisode
pensez à discuter
à parler de double slash
autour de vous nous mettre des petites pouces
des petits commentaires
si vous voulez réagir
les sépétitions inter
c'est quoi les prochaines épisodes
les prochains épisodes
il s'est passé beaucoup de choses
on a eu la google.io
la www.dc
donc de chez appels
la conférence des développeurs
donc on va faire un épisode
où on vient parler
un peu résumer
tout ce qui s'est dit
sur toutes les web api
et toutes les nouvelles fonctionnalités
donc ça c'est un épisode qui arrive bientôt
et puis
il faut qu'on parle du edge computing
qu'est ce que c'est
on a vu ça avec fresh tout à l'heure
en mode qu'est ce que c'est quoi le rendu
sur le edge
c'est quoi
donc on va faire un épisode là-dessus
très bien
un grand merci à tous et à très très bientôt
ciao ciao
c'est

Episode suivant:


Les infos glanées

Je suis une fonctionnalité encore en dévelopement

Signaler une erreur

DoubleSlashPodcast

Double Slash, un podcast sur le développement web. Retrouvez-nous régulièrement pour parler de sujets variés tels que la JAMStack, l’accessibilité, l’écoconception, React.js, Vue.js, Next.js, Nuxt.js, le CSS et des retours d’expériences sur des implémentations.
Tags
Card title

Lien du podcast

[{'term': 'Technology', 'label': None, 'scheme': None}, {'term': 'Technology', 'label': None, 'scheme': 'http://www.itunes.com/'}]

Go somewhere