Les news web dev pour Juin 2024

Durée: 27m27s

Date de sortie: 19/06/2024

Dans cet épisode de news pour juin 2024, nous allons évoquer un éditeur boosté à l'IA, une alternative à copilot, un tout petit paas, les nouveautés de Safari 18, un peu de CSS et 2 utilisations insolites de SQLite. Retrouvez toutes les notes et les liens de l'épisode sur cette page : https://double-slash.dev/podcasts/news-06-24/

Bonjour à toutes et à tous, bienvenue sur ce nouvel épisode de Double Slash.
Comme d'habitude, nous sommes avec Alex.
Salut Alex, comment ça va ?
Salut Patrick, salut tout le monde.
Écoute, ça va plutôt bien, content de revenir.
Petit annonce sur les retours de la WWDC.
On va parler de Next qui arrive en fin de vie.
On va parler des choses insolites que des mecs font avec…
Non, Next 2, hein.
Next 2 qui arrive.
Qui arrive en fin de vie, évidemment.
Mais de toute la partie SQL Lite qui est en train de prendre des ampleurs plutôt intéressantes
avec des mecs qui font des trucs totalement insolites
et des petits navigateurs qui sont augmentés avec de liens.
On va voir si c'est intéressant.
On a testé, on va en parler.
Du CSS qui évolue justement vu que la WWDC est sortie.
C'est la conférence des développeurs de chez Apple.
On avait déjà fait un épisode sur la Google Io
parce que mine de rien Google c'est quand même Chrome.
Et donc Chrome c'est un moteur qui est quasiment partout aujourd'hui sur le web.
Néanmoins il y a le petit canard boiteux qui est en train de rattraper son retard
avec Safari et donc on va en parler de tout ça dans cet épisode de news du mois de juin.
Ouais carrément, mon petit canard boiteux.
Ouais, je suis un peu méchant.
Il boite beaucoup, c'est court derrière.
Après, je sais pas, ça fait combien de temps qu'on en parle
mais Safari c'est un peu le nouvel Internet Explorer.
Et pourtant, il pourrait faire un truc vachement plus poussé et tout
mais je crois que Chrome est trop loin devant.
Je vais vite faire, on en parlera pas.
Mais moi je trouve déjà un des problèmes de Safari
c'est le fait que ça mise à jour uniquement avec les nouvelles versions d'IOS ou de macOS.
Et ça c'est problématique parce que contrairement à Chrome qui est mis à jour très régulièrement
en fait, ça farie tous les mois.
Et Safari, tu attends à chaque fois une nouvelle OS.
Donc c'est vraiment handicapant pour faire des évolutions de Safari.
On en parlera après.
Allez, on attaque tout de suite avec un éditeur
qui est une sorte de fork ou une surcouche de VS Code qui s'appelle Curso.
Et qui vient en fait mettre une énorme surcouche d'intelligence.
Donc en fait c'est un copilote intégré directement.
L'avantage c'est que tu peux utiliser différents modèles.
Donc t'es pas prisonnier du modèle de copilote.
Tu peux mettre tes propres clés API ce qui fait que tu payes toi-même
ou sinon ils ont une version directement où tu viens payer.
Je crois que c'est 20 balles par mois un truc comme ça.
Je sais pas trop.
Donc en fait Curso c'est un truc qui est sorti il y a plusieurs mois déjà.
Mais toi en fait tu l'as testé.
Oui, moi je l'ai testé.
Le gros avantage que je vois c'est que dans copilote souvent
quand tu vas lui poser une question en commentaire ou quelque chose comme ça
il va prendre les onglet qui sont ouverts
mais il va pas toujours prendre la code base dans son intégralité.
Là en fait quand tu ouvres un projet dans Curso
il va vraiment scanner toute ta code base
et en fait il va la prendre comme contexte.
Donc tu as beaucoup plus de contexte
et sur les suggestions c'est quand même beaucoup plus pertinent
et moi j'ai quand même vu une différence.
Là où ça me dérange un peu c'est que c'est toujours très obscur
sur la code base elle est envoyée où ?
Est-ce qu'elle reste en local ?
Est-ce qu'elle est envoyée chez eux ?
Est-ce qu'elle est envoyée au modèle vu que j'ai mis mes clés API ?
Est-ce que c'est envoyé à 4GPT4 ?
Est-ce que je viens entraîner le modèle avec mon code ?
Tout ça c'est assez obscur.
Alors je t'avoue aussi que je me suis pas infligé la lecture des conditions générales de vente.
Donc un moment donné tu dis ok, bah là stop quoi.
Néanmoins il y a quand même des choses qui sont plutôt sympas
où l'expérience de chat est plutôt bien réussie
contrairement à copilot où tu vas aller...
en fait tu es dans un onglet à part.
Là tu peux vraiment ouvrir une boîte de dialogue dans le contexte
et tu poses ta question et tu chates avec ta code base.
T'as tout un système de documentation
où il va aller automatiquement récupérer toute la doc.
Non en fait c'est pas mal.
Après moi ce qui me dérange le plus c'est le manque de transparence
sur où va le code et...
C'est marrant de dire ça parce que en ce moment justement
à chaque fois que je parle avec des devs tout ça de dia
c'est une des premières choses qui revient à chaque fois
la privacy, mon code etc.
On a passé un petit peu la partie époustouflante de l'IA
et là on commence à se poser les vraies questions
et c'est vrai que c'est une question qui revient tout le temps
en fait que bah ouais mais data elle vont où etc.
ça y est on a atteint ce niveau où on se pose vraiment des questions.
Je pense qu'on a passé le côté l'effet wow
c'est bon c'est fait maintenant je veux plus de pertinence
je veux de la privacy mais comment je peux contrôler ça
après sur le côté refacto
il y a des trucs où il est complètement pertinent
après ça reste un large LLM
donc ça veut dire que tu peux pas lui faire une confiance aveugle
en mode copier-coller
non tu relis et nombre de fois où tu te fais quand même
surprend en disant ah ouais mais c'est exactement ce que je voulais faire
et donc tu as un gain de temps qui est monstrueux
donc ouais non
ça c'est clair
on est de façon
on est plus productifs ça c'est évident
après j'ai testé moi ce matin je m'amuse avec
parce que je me suis mis sur un petit projet de la Ravel
et je me suis amusé un petit peu avec
alors ce qui est cool déjà c'est que c'est un VS Code
donc on peut emporter direct
tous les settings, toutes les plugins de son VS Code
donc on se retrouve directement dans son VS Code
comme on avait déjà avant assez rapidement
après il y a ce côté
mais tu disais tu peux brancher sur n'importe quel lien
c'est à dire que là le chat tout ça qui est intégré
je le branche sur, tu sais on avait vu de ta bille la dernière fois
je le branche je suis et c'est censé marcher
tu vas pouvoir en fait mettre tes propres clés API
juste pour revenir sur l'intégration
moi là où j'étais bluffé
c'est justement la migration
au moment où tu installes pour la première fois
ou tu ouvres pour la première fois ton curseur
en fait il récupère toutes tes settings
tes paramètres, tes thèmes, tout
et en fait tu es automatiquement
en fait si tu viens de VS Code
tu as une migration qui est inodore un color
tu retrouves les mêmes keymaps
toutes tes settings, toutes tes extensions
c'est vraiment à l'identique
ce qui fait que tu n'as aucune barrière
au switch
mais ça c'est super malin
parce que à chaque fois que tu passes
d'un editor à l'autre
c'est pas les mêmes shortcuts
tes settings, il faut les refaire
ou des choses comme ça
là ils ont vraiment c'est hyper hyper hyper hyper
hyper fluid et ça ça m'a vraiment bluffé
sinon oui pour revenir sur le côté
où tu mets tes propres key
en fait tu vas payer au service
donc la question c'est
est-ce que tu vas passer tes 20 dollars par mois
franchement je ne pense pas
qu'avant de mettre 20 dollars
je pense qu'il faut vraiment que tu y ailles vraiment vraiment vraiment fort
pour passer en fait ton prix à la consommation
tu vas voir le tarif par an
pour voir la différence
il marque 48 dollars par mois
ça fait 182 dollars
ça fait 16 dollars par mois si tu prends
après ça c'est pas des prix qui me choquent en général
le copilote aujourd'hui
c'est 20 dollars je crois
non attend c'est pas...
non c'est 10 balles c'est 10 dollars
le copilote par mois
et après chat gpt
enfin là parce que je dis gpt4
donc gpt4 c'est 20 dollars je crois
si tu rajoutes...
en fait la copilote plus gpt4
tu as deux choses donc finalement
voilà c'est...
je pense que...
tester peut-être...
ouais faut tester
avec votre propre clé api
ça vous coûtera toujours moins cher
et puis comme ça vous pouvez voir
ce que ça dit
et si vous êtes plutôt à l'aise
avec ça quoi
yes
faites les retours dans les commentaires
ça nous intéresse
carrément carrément
une autre possibilité c'est d'utiliser codium
par contre ça moi je n'ai pas testé
c'est le même concept en fait
ou c'est une chose...
non non c'est pas pareil du tout
j'ai pas testé encore
mais je pense que je vais le tester assez rapidement
c'est un copilote
ok donc c'est une extension
que tu installes dans ton VS Code
voilà c'est un gini à pour coder
sauf que la grosse différence c'est le pricing
c'est que c'est gratuit
ok
voilà
par contre...
je m'arquise dans les notes
c'est gratuit mais en fait tu entraînes l'IA
automatiquement
donc tu en fait tu travailles pro
c'est comme ça qu'on entraîne les IA
pour rappeler en fait on en a parlé
il y a un ou deux épisodes
les IA en fait pour les entraîner
en fait elle te fait une proposition
et tu dis oui ou non c'est pas bon
et en fait effectivement quand ton code
qui est une propose des trucs qu'on refuse
de la proposition
on l'entraîne
donc c'est peut-être pour ça aussi que c'est gratuit
pour l'instant
ce qui est normal
il faut bien qu'il...
après on voit tout
comment...
c'est toujours le problème
privacy
à tester
ouais à tester c'est intéressant
ça permet aussi de sortir un petit peu
de Microsoft
et etc
c'est obsidieux pas mal
allez on part sur
quelque chose qui a rien à voir
on va
sans doute parler dans un futur
épisode d'un pass
d'un plateforme as a service
trouver
le bon compromis entre son
propre serveur et
le pass, là il existe
une toute petite solution qui s'appelle
Picoo
Picoo
ça fait très
Pokémon Picoo quand même
mais bon je pense que c'est
tout petit, l'idée en fait
c'est d'installer Picoo sur son propre serveur
pour pouvoir
déployer ses applications
directement, c'est ça ?
ouais ouais il se dise
ce qu'il dit c'est le plus petit
pass que tu peux trouver
et en fait quand tu dis la motivation
c'est tout simplement... alors il y avait Dooku
qui disait qu'il était
une version open source
d'Heroku en fait, donc voilà
qui détecte automatiquement que tu as fait un guide
push et puis il va déployer
automatiquement avec un prog file
sur Heroku
sur Heroku
c'est des build
build pack
machin tout et en fait
Dooku je crois il prend ton app
il la dockerise et il la déploie
il la déploie sur son serveur
donc c'est un peu le même principe
sauf que ce qui raconte c'est que
Dooku ne fonctionnait pas sur les ARM
donc il a voulu faire une version ARM
donc ce Picoo en fait
il fonctionne sur ARM et sur Intel
et après c'est le même principe que
Dooku et Heroku en fait
ça déploie automatiquement donc c'est le même
fonctionnement
et a priori c'est stable donc c'est
utilisable
et pour le coup
c'est tout petit
si ça fonctionne sur un ARM
je pense que le but c'était de réduire
la taille des
serveurs quoi d'utiliser
le côté
petit serveur
c'est un petit truc
qui prend pas de place ça marche sur Python
c'est sympa
pas mal
et il y a un site de Dooku
qui explique
l'installation
facile à installer
je n'ai pas testé
pour le coup
Picoo
ça marche
on bascule sur Astro
qui vient encore plus
étoffer
son système et tout son écosystème
de solution alors pour ceux
qui n'ont pas suivi
l'astrosphère
Astro c'est un
générateur de sites statiques
sur lequel on va pouvoir
greffer
n'importe quel
framework javascript
ou librairie javascript
si on en a besoin mais on va trouver
la modularité des librairies avec tous
les composants mais là
à la fin on va sortir que du HTML
pur et brut
et donc ce qui nous fait des sites
plutôt rapides et légers
nativement mais tout en
profitant de l'expérience développeur
des composants
et on va venir
composant ifier on pourrait dire
tout le HTML
donc il y a tout un écosystème
qui s'est développé là dessus
avec des sortes d'extensions
pour gérer les langues
gérer le markdown, le gson
et tout ça et là en fait
il nous revient avec
un astro content layer
et donc
qu'est ce que c'est ?
en fait là ils ont fait des
la semaine dernière ils ont fait des conférences
sur le futur d'astro en fait donc ils ont
présenté, il y a eu plusieurs
c'est disponible sur youtube, il y a plusieurs vidéos
et ça c'est la partie vraiment intéressante
d'astro en fait
la plupart des gens qui
il y a beaucoup de gens en fait qui étaient sur gatsby
et qui par la force
des choses
gatsby est mort
officiellement non mais il est
un sous respirateur
en tout cas c'est
netlify qui
a la main sur le bouton
en gros
donc il y a des gens qui passent sur astro forcément
parce que c'est la suite logique
par rapport à gatsby, générateur de cistatiques, performants
mais à chaque fois qu'ils arrivent sur astro
en fait ils disent c'est pas mal
astro et tout mais il manque un truc
qu'on avait justement sur gatsby
d'ailleurs c'est pour ça que netlify
il avait racheté
c'est ce système de
de data hub
c'était pas un truc concernant
en fait ça via
un système ça allait chercher
des data en fait soit sur une API
soit sur du markdown etc
et c'est vrai que c'était assez puissant
sur gatsby comme système
et c'est quelque chose qui manque vraiment sur astro
et même si il y a les collections
tout ça ou qui vont gérer le markdown
directement tout ça mais ça manque
de pouvoir se brancher à un cms
n'importe lequel
un sas ou n'importe quoi
et justement ils ont annoncé astro content layer
alors ils ont pas détaillé
comment ça va fonctionner etc
mais c'est dans la même vaine que
gatsby en fait
ça va pouvoir se connecter
soit à des markdowns soit
des data en remote
donc tout ce qui a piscms tout ça
et ça va utiliser la puissance de sql light
parce qu'en ce moment ils instaigrent beaucoup sql light
sur astro
donc ça semble vraiment pas mal
c'est un peu le principe
de gatsby
tu définis et voilà tu donnes un nom etc
et après j'imagine et j'espère qu'on pourra
faire des requêtes via ce système
de content layer comme on l'avait sur gatsby
donc j'ai hâte de voir
comment ça va fonctionner
et c'est le truc qui manque
c'est la pièce manquante
c'est la pièce manquante parce que
le site static c'est toujours bien
mais ton client va dire ouais mais moi je veux contrôler
mes données
le github base machine je veux pas
ton site static j'arrive à le vendre
tu me l'as vendu nickel mais
en tout cas ils comprennent le bénéfice
d'utiliser un site static
pour la sécurité, la rapidité tout ça
ok pas de problème
par contre eux ils veulent toujours garder le contrôle
des data et c'est vrai que
si là tu peux brancher
ce qu'avait réussi à faire gatsby
le data hub tu branches n'importe quelle source
de données
là ça prend
une autre dimension
ça prend vraiment une autre dimension
et c'est là où ça peut
être très très très très très très fort
très intéressant
parce que sur gatsby en plus tu pouvais
après chaque provider
des cms tout ça
développer un peu son truc et tu l'installais
un peu comme les modules tu vois sur nukes tout ça
tu l'installais, tu mettais ta clé API
et en 2 secondes t'avais accès à ton cms en faisant des requêtes
et tout ça et donc tu pouvais te brancher
à n'importe quel truc ou même à WordPress
tu avais même la version WordPress tout ça
tu avais accès aux data très rapidement
sans prendre la tête
donc ils travaillent dessus
en automne normalement
enfin ça sera dispo en automne normalement
donc j'ai hâte de voir ça
après sur la doc
ils parlent déjà
des cms guide
et tout ça
ça a l'air vraiment bien par contre
est-ce que
ils ont évoqué
une notion de prix
est-ce que ce data l'ailleurs il sera payant
est-ce que ça sera
une source et tu pageras
en fait ton cms à côté
ou comment ça va se passer ?
non c'est vraiment
c'est quelque chose qui est dans ton projet
qui va se brancher en fait
c'est un package qui va se brancher
à un endroit et qui va traiter la data
en fonction de sur quoi il est branché et qu'elle provoque
pour l'instant il n'y a pas de système
de SaaS tout ça
oui comme tu disais
comme il avait fait Gatsby dans un second temps
pour l'instant ils en sont pas là
c'est indépendant
et c'est toujours une source tout ça
tu vois ce qui est cool avec
Gatsby c'était top
mais tu sentais que les fondateurs
avaient fait Gatsby pour le revendre un jour
et faire de l'argent
en gros
Astro c'est totalement la même
enfin en tout cas je le ressens comme ça
peut-être que je me trompe mais Astro je ne sens pas du tout la même
motivation tu vois
après on est gens qui
contribuent, qui veulent faire évoluer
une grosse grosse partie de la communauté
sur Gatsby pour le coup
enfin pardon
sur Astro
il y a une grosse grosse communauté
après derrière
il y a toujours une boîte
donc
on va dire le business model
il reste toujours
comment ils font de l'argent
à un moment donné ces gens-là
est-ce que c'est full full full open source
normalement oui
il y a peut-être des mecs qui sont derrière aussi
comment ils font pour gagner de l'argent
c'est
toujours l'équilibre au précaire sur de l'open source
parce que
parfois les gens sont pas prêts
à sortir la carte bleue tout simplement
alors les gens est souvent les sociétés
c'est d'ailleurs ce qui revient souvent
c'est que les sociétés c'est un peu le problématique
d'open source ces derniers temps
beaucoup de sociétés
d'énormes sociétés type amazon facebook
qui utilisent des systèmes open source
et ne contribuent jamais
à ces trucs
alors qu'ils font énormément d'argent
c'est toujours la problématique et la polémique
après à l'inverse aussi
les grosses boîtes parfois
dédient des mecs sur des proses
donc
c'est pas aussi
binaires
on va faire un épisode spécial
open source
et après c'est pas toujours aussi
les gentils et méchants
ça dépend, yona ils sont méchants
quand même
allez ça marche
allez on déroule
la
version de
ios
a été présentée à la wwdc
donc c'est ios 18
alors pour
nous qui sommes un peu du web
ça va peut-être changer
des choses
mais je crois que ça a été
un petit peu forcé par l'Europe
il me semble
que googlepair
va s'ouvrir
en fait
d'autres navigateurs que safari
donc pour ceux qui n'ont pas suivi
applepay c'est le bouton
en deux clics
tu as enregistré ta carte bleue
et tu payes avec ton téléphone
et en deux clics
tu as payé
donc tu n'as plus besoin de mettre
tes codes de carte bleue et tout ça
et pour le coup pour avoir
intégré ce système-là dans stripe
ma cliente
a vraiment vu la différence
avant et après
en conversion
en conversion
parce que c'est
un frein et une barrière
indéniable
parce qu'il faut taper les codes
c'est chiant
tu as des systèmes de scan maintenant
tu peux scanner ta carte ça va plus vite
mais la facilité de paiement
en clic clic c'est payé
elle est énorme
et donc là on est en train
de l'ouvrir à d'autres navigateurs
sur la partie
desktop
par contre je vois un espèce
avec un rond
tout ça c'est quoi ce truc
en fait comme tu dis
souvent ça revient sur stripe
ce système pour intégrer facilement
Apple pay tout ça
apparemment j'utilise peu Apple pay
sur mon ordi
plutôt sur l'iPhone
c'est vrai que c'était déjà disponible
quand tu as un Mac
mais là il s'ouvre au pc
tu dis super on va pouvoir
payer avec Apple pay sur pc
en fait pas vraiment
c'est juste
ce truc là qui s'affiche
tu as une sorte de QR code qui s'affiche
quand tu veux payer avec Apple pay sur pc
tu vas scanner avec ton iPhone
et après tu payes avec ton iPhone
oui ça fonctionne sur les autres navigateurs
mais en fait pas vraiment
parce qu'il faut toujours l'iPhone
après
c'est le déco système Apple
donc tu es forcément obligé
d'avoir un device Apple
c'est logique
ce qui se tient après c'est pas non plus déconnant
oui c'est pas déconnant
de faire ça pour
en fait
déporter
ton paiement en termes de sécurité
t'es dans ton device à toi
t'imagines par exemple que
t'es sur un ordinateur qui n'est pas le tien
tu vois où t'es dans un
coffee shop
ou je sais pas quoi sur un wifi non sécurisé
là en fait tu fais ta transaction
sur un appareil que tu contrôles
tu vois
en termes de sécurité
c'est pas déconnant
tu viens déporter
et tu ouvres
en fait à d'autres navigateurs
moi je trouve que le contournement
qu'ils ont pris est
pertinent et l'expérience d'achat
il faut pas ressortir ton téléphone
mais en termes de sécurité
c'est bien
ouais ça fait une doule authentification
tu valides avec ton téléphone
il y a le
FSID tout ça
en fait l'intégration est très bien
très sécurisée c'est à l'appel
puis évidemment ça sera fluide
de toute façon c'est logique tu vas pas payer
sur un pc si t'as pas un iphone
un mac n'importe quoi en fait
tu pourras pas de toute façon
ce qui t'évite de mettre tes crédins de show
appels tout non c'est
c'est plutôt bien ça marchera pas avec ton apple watch
par contre
tu peux payer avec un apple watch
tu peux pas scanner avec ton apple watch
non tu peux pas scanner
mais intéressant
intéressant
dans le même akabi
vu que la WWDC 2024
la conférence apple developer
ils annoncent
une nouvelle série
sur iOS 18
ce qui veut dire qu'il y a aussi la version
desktop qui vient
et donc le moteur de safari se met à jour
avec la problématique qu'on évoquait
en début d'épisode où justement
malheureusement
les releases
de safari sont conditionnées
et sont rythmées
avec les versions
de macOS
qui se mettent à jour
malheureusement qu'une fois par an
c'est super dommage donc ça veut dire
que c'est souvent assez long
ça sort tout d'un coup
ça fait que là sur ce document
qui résume un peu toutes les nouveautés
et les dépréciations
il y a énormément de choses
mais on va juste résumer vite fait
les choses importantes
au niveau du CSS
il y a les view transition
en level 1 qui sont intégrés
donc c'est une bonne nouvelle pour tout ce qui est
CSS view transition
on va pouvoir l'utiliser sur safari
nickel
il y a un truc
intéressant
si tu descends un petit peu le style query
ça c'est marrant
je ne connaissais pas
c'est quoi le style query
en fait c'est un conteneur query
c'est une query conteneur
si le background est black
tu vas mettre le texte en blanc
tu vas faire une query
avec une condition en fonction du style
qui est appliqué sur ce conteneur
moi je n'avais jamais vu ce truc
c'est pas mal
ça veut dire que c'est un truc
en fonction du texte
pour faire les contrastes
intéressant
on a un truc sur les couleurs
on a toujours du mal à comprendre
il y a un truc super intéressant
le animating display
c'est quelque chose qui
normalement existe déjà sur chrome
qui est déjà disponible
c'est le fait de pouvoir
alors tu sais que
quand tu mets un display none
ça te pète tout
ta transition ne fonctionne plus
étant de l'élément disparaît direct
en fait il n'y a pas de transition
avec un arroba starting style
il y a la possibilité
de faire fonctionner
les transitions avec le display none
c'est quelque chose qui est déjà disponible
en chrome
moi je n'avais quasiment jamais entendu parler de ça
et là ça commence à sortir
et on commence à en parler
et donc il intègre sur separate 18
et pareil de pouvoir faire
une transition donc tu as un élément
qui au final va finir en display none
mais tu as quand même la transition
jusqu'à ce qu'il soit display none
parce que ton display none
en fait ton neu
html il est encore présent
mais il n'est pas affiché
et donc là en fait on pouvait animer
sur l'apparition d'un neu html
ou la disparition d'un neu html
d'un tag
d'une balise classique
sauf que si il était présent
mais pas affiché on ne pouvait pas
appliquer une animation
ou une transition
et grâce à ce starting
style query
on va pouvoir faire ça
tu peux intégrer le display none
dans l'equiframe
pas mal
donc en termes de performance aussi
parce que moi on manipule le html
plus on a de la performance
donc intéressant
un truc sur css
qui évolue encore c'est cool
on a le
vision os en s'en fout
je n'ai pas les moyens
même si ça va sortir en France
il arrive
mais c'est 4000$
c'est hors de prix
le backdrop filter
truc marrant
il existait depuis super longtemps
mais il était sous un prefix
webkit
ça y est ils enlèvent enfin le prefix
tout le monde le prend en charge
sa farie avait toujours le prefix
il enlève enfin
le safe in flexbox
intéressant
je ne connaissais pas cette propriété
c'est pour aligner les éléments
si tu descends un petit peu tu verras
en fonction s'il est
encore un petit peu
quand ça dépasse
si tu fais un aling
en fait ça en justifie
le centre
si jamais ça dépasse
ça dépasse les deux côtés
si tu passes en safe centre
ça va dépasser que d'un seul côté
il va aligner les deux éléments
sur la gauche et ça dépasse que sur la droite
c'est un truc comme ça
la partie du texte reste lisible
et tu devines quand même ce que c'est investigation
au lieu de juste investigation
donc c'est un truc
intéressant que je ne connaissais pas
c'est des toutes petites
des toutes petites ajustes
mais qui
au final rend le truc
un petit peu plus joli
web app format
celui là il est la suite
attention celui là
tu le connais quand on fait des web app
sur tout ce qu'est environnement mac
si tu as un lien dedans
il s'ouvre où actuellement
dans ton navigateur
voilà donc tu sors de l'application
et tu te retrouves dans ton navigateur
donc ça a plus part du temps c'est compliqué de revenir dans l'application
et apparemment ils ont enfin
réussi à résoudre ce problème
et donc ça devrait s'ouvrir
dans la web app
donc
ça c'est cool
encore une évolution sur les web app
dans mac
ça c'est un problème
on est obligé de faire des hacks et tout ça
pour éviter que ça ouvre à l'extérieur
et le jour où ils font ça sur des pwa
les gars je suis trop content
c'est un pas de plus vers la pwa
donc on s'en rapproche
mais ils le font sur mac
c'est à dire sur le desktop
parce que ça passe mieux
parce qu'ils arrivent à l'intégrer
mais sur ios
c'est plus le même délire
parce qu'il y a tout l'écosystème
business derrière avec le store
et tout ça
donc c'est plus compliqué
mais c'est très bien
c'est top
je ne peux que valider ça
c'est clair
et ensuite après il y a plein de trucs
mais il y a beaucoup
des prix qui est tide
j'ai noté abandon de jpeg 2000
ils disent on était les seuls
à le supporter donc on abandonne
ouais mon renais
faut arrêter quoi
non je ne dirais pas que c'est un échec
ça n'a pas marché
arrivé de url
en js url parce
pour passer des url
donc il n'a pas d'ispo
javascript arrive et puis après il y a plein de trucs
qui sont supprimés
gros documents, grosses mises à jour
donc intéressant à lire
de voir un peu ce qui évolue
yes ça roule
on revient
sur
sur des
enfin on va dire qu'on va rester
sur du css
on parle de ça
ouais on passe au moins
mais pour le coup
là en fait
dans un contexte
d'input
si on avait mis des règles
qui n'étaient pas valides alors que même
l'utilisateur n'avait pas
sélectionné l'input
il n'avait même pas pris le focus
on lui a fiché déjà
une erreur comme quoi c'était invalide
parce qu'il ne respectait pas
les règles inscrites
ça maintenant c'est fini
grâce à
la ballyse
la pseudo classe
valide et user valide
invalide et user invalide
ouais c'est ça
en fait quand tu as 2 points valides
ou 2 points valides en fait t'as arrivé sur la page
t'avais déjà le truc qui était
si tu disais que c'était obligatoire
il était forcément invalide direct
donc t'as arrivé sur la page et c'était déjà rouge
quasiment ces choses
étaient quasiment inutilisables
2 points valides ou 2 points invalides
donc il y a 2 propriétés qui arrivent
enfin 2 pseudo classes qui arrivent
user tirait valide et user tirait invalide
et qui ne se mette en place
que si tu as interagis avec l'input
c'est à dire que tu vas commencer à taper
ou quoi et si c'est pas valide ça va se faire en rouge
j'ai envie de dire enfin
un truc utilisable parce que là dernièrement
j'ai fait un système de CSS
pour des formuleurs tout ça et je me suis retrouvé
à dire en fait je peux pas l'utiliser
c'est ce truc il est inutilisable
en fait je peux pas l'utiliser
donc là voilà c'est pris en charge
sur tous les derniers navigateurs
c'est arrivé sur safari je crois
le temps que ça soit implémenté un peu partout
mais ça c'est une super nouvelle
et pour le coup on dégage
encore du JS
ouais encore
bientôt on fera plus de JS
c'est fini
allez on vient mixer du CSS
avec du design
et des couleurs
pour ceux qui sont plutôt
adeptes et on va dire
vous faites partie
de la même équipe
que moi-même et Patrick
où on est plutôt fan de taïwine
tout simplement on va pouvoir
en fait générer
des shades
donc des dégradés de couleurs
à partir
d'une couleur primaire qu'on va lui donner
la référence
et on va automatiquement
créer un grid
avec tout un dégradé
ça va la nommer
exactement au bon nom
on va dire un nom littéral
et derrière on va pouvoir
l'exporter soit
en version
soit en version
CSS
SAS
Tailwind
ou avec
la typologie de couleurs
un peu spécifique
les HSL
les OKLCH
tout simplement aussi pour les designers
on peut l'exporter directement en SVG
pour faire un Figma
avec un simple copier
coller
c'est top ce truc
ouais mais j'aime bien
tu le connaissais déjà mais tu l'utilises
ouais je l'utilise depuis longtemps
mais évidemment
on mettra le lien dans les descriptions
mais c'est quand même super pratique
et l'avantage
c'est qu'on voit aussi
visuellement en fait
plein de petits composants
qui utilisent en fait ce dégradé de couleurs
et toutes les couleurs
sont issus de la palette
qui a été générée
ce qui fait qu'il n'y a pas de surprise
on voit vraiment si ça correspond
à ce qu'on voudrait
ou ce qu'on espère
ou ce qu'on pensait
utiliser
là on le voit directement dans le contexte
et on peut après faire des ajustements
donc c'est super intéressant
et ça nous permet
de créer une palette très très rapidement
et comme ça on a tout le dégradé
direct
un bon outil à utiliser pour
les développeurs qui sont plutôt fans
de Tailwind
ou pas
parce que tu peux utiliser les couleurs
pas faux, c'est vrai
et pour ceux
qui, un peu comme nous
on va
l'accorder qui ne comprennent pas
toujours l'utilité
des couleurs dans tous les sens
le co... au KLCH
par exemple
si pour vous ça vous parle pas
on vous invite à lire
le poste
de Léa Verrou
c'est un poste qui est assez fourni
quand on voit le temps de lecture
c'est significatif
mais elle a fait
un poste qui date
du 17 mai
il y a un petit mois
où elle reprend
toute l'explication
et pourquoi
en fait le contraste
pourquoi utiliser
toutes ces
nomment clature
de couleurs
un peu ésotériques au premier abord
en fait nous permettent de faire
des maths
et de sortir
avec des contrastes de couleurs
bien plus intéressants
et de valider
tout ça
on va dire c'est un article
qui se veut quand même
pour les développeurs
mais qui ont une grosse pour les designers
et des designers
des développeurs on pourrait dire
non ?
Léa Verrou
c'est quelqu'un
qui est assez forte
qui fait partie du truc
et qui fait des articles très complets
très fournis et très précis
et je pense que ça c'est le genre d'article
que tu dois lire
en tant que développeur
pour te former
pour tenir à jour, te former etc
parce que c'est ce genre d'article
quand tu as fini de le lire
tu vas comprendre pourquoi il faut utiliser
au KLCH
et il y a aussi une partie
accessibilité
comme on fait les contrastes
donc je pense que c'est
une lecture obligatoire
pour... c'est une formation
carrément gratuite
disponible pour en tant que développeur
donc je vous recommande de le lire
de prendre le temps
après ça peut se dire en 2-3 fois
c'est pas obligé de le dire en une fois
je me sens obligé maintenant Patrick
mais t'es obligé
et d'ailleurs la prochaine fois je te fais un quiz
sur le KLCH
comment tu fais ça ?
non mais ok
c'est très très fourni
c'est vraiment
très très très très fourni
c'est hyper pointu
en parcourant
en biais
très rapidement on voit qu'elle pousse
vraiment vraiment le curseur
hyper loin
je pense qu'on a une très très bonne idée
à l'issue de la lecture
de ce poste

allez on reste dans l'univers
on revient dans l'univers NUXT
pour ceux qui n'ont pas suivi
on a fait une vidéo sur un workshop
ou comment on utilisait
NUXT server
donc c'est un petit workshop
qui est uniquement sur Youtube
exactement
et on utilisait toute la partie
de NitroJS qui est en fait le moteur
derrière NUXT server
et
on fait un petit workshop où on vous explique tout
le biais bas ou comment on pourrait
se passer de express
sur nos
applicatifs
et ça en ayant une DX
super sympa
allez voir la vidéo c'est directement sur Youtube
et si on revient
dans l'écosystème NUXT
il y a Prisma
qui a sorti son module
j'ai envie de dire enfin
qui a sorti son module pour
interagir avec les bases de données
pour ceux qui ne connaissent pas Prisma c'est un ORM
donc en fait c'est l'interface
entre ton backend, ton front
et ta base de données
donc ça va optimiser ton pool de connexion
et
au lieu de te faire tes requêtes SQL
à la mano
tu vas directement faire un user
point fine
et donne-moi les chans que tu veux
ça vient faciliter la communication
avec
la base de données
alors pourquoi ? Pourquoi que maintenant
ça sort ?
pourquoi que maintenant ?
en fait tout simplement
moi je me mettais pencher
sur Prisma il y a déjà un bouton
le gros problème qu'il y avait
sur
Prisma c'est que ça ne tournait pas
sur
des workers
ou sur
c'était pas module en fait
c'était pas ESM
et donc en fait tu ne pouvais pas
l'exécuter
sur NUXT3
ou en fait tu pouvais le faire que
sur la partie back
c'est super intéressant
tu as ton ORM
côté back
par contre côté front
tu ne pouvais pas requêter
donc tu avais une limitation
tu étais obligé de passer à chaque fois
par le serveur
et c'est plutôt bien
de faire un use
Prisma et tu lui
balance ta requête
avec ta demande
à ta DB pour récupérer
les données
et donc
ok
ça c'était juste pas possible
et il y a quelques mois
ils ont sorti en fait
une version Prisma Edge
parce que
tout l'écosystème Edge
s'est beaucoup développé
et donc tu étais obligé
avant vu que t'étais obligé
d'avoir un serveur
tu avais une manière de faire
c'était de déployer en serverless
sauf que ton serverless
t'amène à un autre problème
c'est comment tu gères ta pool de connexion
donc c'est pour ça qu'ils ont sorti un service
qui s'appelait Pulse
qui faisait de l'agrégation
de connexion
pour éviter que ton pool de connexion
explose à ta base de données
et sauf que
NUXT
NUXT tout ça
poussé par tout l'écosystème
versel Netlify
on a déplacé le serverless
sur du Edge
donc il y a un runtime
un petit peu particulier
qui s'exécute au plus proche
de l'utilisateur sauf que
il y a des contraintes techniques
et il faut respecter les ESM
si ton module est
envers si ta librairie est
ESM compliant
c'est un module tu peux l'exécuter
sur ton Edge sauf que Prisma
n'était pas fait là-dessus
et toutes leurs
technos étaient basés
pas là-dessus donc ils pouvaient pas
exécuter
le Prisma
sur du Edge donc ils avaient une contrainte
en dire
physique et donc on était baisés
on pouvait rien faire sauf que
il y a quelques mois
il y a quelques mois ils ont réécrit
et devant la demande
et devant tous les fervers sens du Edge
ils se sont quand même penchés
sur le problème et il y a quelques mois
ils ont sorti
une version Prisma Edge
et donc à partir de là
l'intégration
dans NUXT était possible
et donc c'est pour ça
que ce module NUXT
en fait arrive que très très très tardivement
parce qu'il fallait
faire la migration
et pour le coup ils ont fait ça
plutôt bien, plutôt propre
et donc
on vient en fait récupérer
tout l'écosystème Prisma
avec la déclaration de schéma
toutes ces choses-là
et on vient utiliser le fameux
Use Machin
Use Prisma
qui est en fait la composable
de l'écosystème
sur
Prisma client
et là en fait depuis ton composant
tu vas pouvoir en fait
faire un Use Prisma client
et tu vas exécuter ta query
directement dans le browser
dans le browser
et tu vas récupérer
donc ça c'est plutôt
plutôt cool
ça arrive un peu
tard mais c'est pas grave
ils ont mis du temps quand même
mais bon ils ont mis du temps
mais c'était un peu obligé en même temps
parce qu'avec toutes les nouvelles systèmes
Adrisal, qui sont compatibles
Edge, eux n'étaient pas compatibles
alors après c'est un peu différent
mais c'est vrai qu'ils avaient
un peu de retard sur ce côté Edge
bien sûr et tu vois on est obligé de parler
d'Adrisal parce que je pense que
d'Adrisal leur a mis un coup de pression
de ma boule
vraiment donc ils étaient obligés
de combler
ce vide-là
mais aussi ils viennent utiliser
toute la partie serveurs
des serveurs componentes
avec tous les avantages que ça amène
et donc Prisma
tient vraiment
tire tout le bénéfice
en fait de cette technologie
et ça reste quand même récent
il n'y a pas
une grande maturité
là-dessus encore
ça reste encore hyper
c'est utilisable en prod
tout ça marche
aucun problème là-dessus
sauf que ça reste encore récent
donc il fallait que tout l'écosystème s'étoffe
et vienne développer
sur cette technologie là
c'est ce que Prisma a fait
parce qu'il y avait l'alignement des planètes
ça a été long mais ils ont réussi
donc c'est cool
yes ok cool
propre
on reste sur Next
on reste encore sur Next
on parlait de... petite musique d'enterrement
exactement
Nuxt 3 est sorti il y a déjà
pas mal de temps
ils étaient
ils maintenaient encore
Next 2
et là en fait ils annoncent
comme quoi c'est la fin
end of life
E O L
c'est la fin de vie de
Next 2 alors vous pouvez encore
pousser
votre applicatif
va encore tourner
ça va pas s'arrêter
par contre eux ils vont arrêter
en fait de faire... arrêter les frais
voilà
ce qui est normal
ils ont mis beaucoup beaucoup beaucoup de temps
à passer sur Nuxt 3
ils ont tout récrit
ils ont fait un effort
ils ont aussi fait des systèmes
pour faire une migration
il y a un module qui s'appelle Nuxt Bridge
qui en fait est la première étape
pour migrer vers Nuxt 3
donc ils ont accompagné
cette transition là
à un moment donné
c'est la fin
après vu 2 c'est ce qui meurt
vu 2 a été en end of life
le 31 décembre 2023
ça fait 6 mois déjà
donc logiquement Nuxt 2
qui est basé sur vu 2
doit tirer sa révérence
suite logique
fin du mois 30 juin
30 juin 2024
ils ne s'en occupent plus du tout
évidemment comme tu dis ça tournera toujours
tiens, petite question
tu as des projets en Nuxt 2
qui tournent
pareil moi j'en ai un aussi qui tourne
je sais aussi que
pour le coup le client
ne sera pas prêt
à payer la transition
et la migration
sur un Nuxt 3
ouais c'est pareil
ça tourne
après ça marche bien
rappel de mises à jour
sécurité
mais c'est comme ça
c'est le jeu
voilà bye bye Nuxt 2
nous avons bien rendu service
exactement
on passe sur des trucs un peu plus funk
et exactement
totalement insolite
on en a déjà parlé
mais ça prend
plus en plus des
défervessances
c'est le retour en force de SQ Lite
qui est la base de données
vraiment
tout légère
j'ai un truc tu vois
tu sais que
il y a un mec qui a fait une conférence
sur des vox
et les spikets
ça se disait
SQ Elite
ça se prononce comme ça apparemment
le mec n'était pas tout
toute la conférence
il disait SQ Elite
et je lui dis putain mais c'est pas possible
et à la fin il dit ça se dit SQ Elite
parce qu'apparemment
c'est pas
le mot light
c'est plutôt basé comme petit SQL
donc c'est plus lié à la
je sais plus comment ça s'appelle
mais en fait ça se dit SQ Elite
moi je continuerais à dire SQ Elite
parce que j'aime pas trop SQ Elite
mais ok
tu vois là tu m'apprends
et toutes mes excuses
pour avoir dit pendant des années
SQL Lite
SQL Lite
toujours est-il que
il y a un retour en force
qui est vraiment assez prononcé
je pense aussi par
des personnes
et surtout une société
qui s'appelle Curso
qui a investi énormément
parce qu'il déplace
en fait ce SQL Lite
dans le Edge
et donc
ça ouvre des possibilités
à des prix défiant toute concurrence
voilà il y a une technologie
de ma boule quoi
c'est général parce que je le vois
dans la Ravel par défaut maintenant c'est SQL Lite
qui est installé
quand tu installes un nouveau projet
WordPress tu as la possibilité
aussi maintenant de te connecter à SQL Lite
mais pas de ma SQL
donc tu vois c'est général
c'est pas que le monde JS
c'est vraiment voilà
parce que là il t'es en train de faire un retour
fracassant
on se rend compte qu'il est bien
suffisant pour beaucoup de projets
beaucoup plus simple
et pour le coup
là t'as trouvé un tweet
où en fait le mec en quelques lignes
il utilise SQL Lite
avec
une extension
qui s'appelle
SQLite HTTP
donc c'est pour envoyer des requêtes
HTTP
directement depuis ta base
et
là en fait il fait un scrap
c'est ça en 5 lignes de code
oui il fait du scrapping
avec SQLite
il va chercher directement les liens
dans une page
et il les met directement dans la base de données
en fait tout ça en quelques lignes de code
avec burn
tu fais ok
on cherche toujours compliqués
parfois c'est tout simple
donc voilà celui là il est pas mal
très très bon
merci la fonction HTML attribute get
ouais et le
c'est quoi ? c'est HTTP get body
avec l'URL et tout
c'est marrant
pour le coup
c'est hallucinant
dans 2.2
il a tout récupéré
propre
c'est propre
pareil en PHP
lui il a réussi à faire quoi ?
lui en PHP
avec un quelques lignes de code
il te fait
une réponse à pays
en JSON
tu n'as quasiment rien dans le code
il va chercher et fait sa requête SQLite
il donne une réponse en JSON
et c'est terminé
il met ça sur un serveur Apache
et voilà t'as ta réponse JSON
en 2 temps en 3 mouvements
pareil toujours super simple
c'est vrai qu'en attendant ça se compliquait la vie
tout ça à mettre 18000 dépendances
et en fait là tu vois quand on a 17-18 lignes
et encore en moins que ça
parce que là je prends juste les espaces
et en rien de temps tu fais
une réponse à pays qui peut bien suffire
pour pas mal de jouets pop
simple simple simple
comment simplifier
mais après ça c'est un peu la maladie du développeur
quoi
de faire de la conceptologie
et de faire des trucs compliqués
d'utiliser des techno hype
alors que
simplifier c'est
c'est un peu notre problème en attendant
ça vouloir toujours utiliser des super trucs
faire voir qu'on sait le faire, prouver tout ça
prouver qu'on est malin quoi
prouver qu'on est meilleur que les autres
et puis finalement le but c'est surtout
faire que ça marche
c'est tout ce qu'on a besoin en fait
yes
carrément top, écoute Patrick
on en reste là pour cet épisode
ouais
et on vous remercie
énormément pour votre soutien
avec le petit pouce que vous allez lâcher
le petit commentaire que vous allez donner
partager évidemment l'épisode
à vos collègues
et on remercie toutes les personnes
qui nous soutiennent sur le github sponsor
un grand merci à vous
et on vous dit à bientôt
pour d'autres épisodes, ciao ciao
ciao Appis
retrouvez Double Slash
sur le plateforme de podcast préféré
et sur le site internet du podcast
www.slash-podcast.fr
sur le site vous allez retrouver
tous les liens de l'épisode, les références
évoquées durant l'émission
www.slash-podcast.fr

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