Bonjour à tous, bienvenue sur ce nouvel épisode de Double Slash, comme d'habitude nous s'en
intéresser pour sponsoriser les épisodes, c'est sur le site internet double slash.dev et donc
la rubrique nous soutenir je crois je sais même plus. Exactement et ça se fait sur GitHub sponsor
et si vous voulez qu'on passe aussi sur Google souscription sur YouTube en fait vous pouvez aussi
passer sur des souscriptions. Pour l'instant on n'a pas ouvert la fonctionnalité si vous êtes plutôt
familiarisés avec ça et bah dites le nous dans les commentaires et on activera ce moyen. En tout
cas un petit pouce, un petit commentaire ça fait toujours plaisir. De quoi on va parler Patrick
aujourd'hui pour ce nouvel épisode retour de l'actualité dans l'été ? On a pas mal de choses
et encore on a crémé un petit peu parce que sinon on pourrait faire un épisode de trois heures
mais je crois que ça vous t'aide, il y en a qui serait content d'avoir un long épisode mais on
va parler d'IA évidemment il faut toujours parler d'IA dans les épisodes c'est obligatoire. On
parle pas de rust dans cet épisode il manque un truc je crois. Exactement on va pas parler de rust.
Non on va parler de certains outils qui ont une nouvelle version on va parler de directus qui
a des nouveaux prix mais pour une fois c'est pas l'augmentation tu vois c'est bizarre. C'est
bien hein. Spoiler alert j'ai déjà balancé. De notre JS qui commence à comprendre type script,
il a appris le langage, il y a après des outils, plein d'outils pour gérer des tâches en background,
un outil pour faire des sites en drag and drop, des outils d'accessibilité, des petits outils.
Et de la formation aussi sur les événements et pour mieux comprendre les composants. Nice,
allez on attaque tout de suite dans le vif du sujet avec les Postgres et Postgres et c'est un outil
qui a été sorti par StackBlitz je crois. Superbase non ? Ah ouais ou peut-être Superbase.
Ça a été annoncé dans la semaine Superbase week je crois c'était la semaine dernière.
Et cet outil s'appelle Postgres.new ce qui nous permet en fait de designer une base et un
et il va automatiquement créer notre diagramme, il va créer les migrations,
on a juste à corriger et à valider. Et là pour l'exercice de style je fais ok donne-moi un
twitter clone ce qui m'a, il m'a automatiquement créé tout ça, ça m'a pris à peu près trois
secondes j'ai attendu et ça s'est venu automatiquement créer les migrations donc c'est quand même assez
puissant et assez sympa à utiliser ces gratosses pour l'instant je sais pas si ça
sera si ça va changer si ça va bouger mais c'est bluffant c'est vraiment bluffant.
Ouais c'est bluffant, c'est la principe, c'est la chose en fait que tout le monde a
réélevé la semaine dernière justement de la Superbase week là. C'est outil qui marche à
base d'IA et qui te génère n'importe quoi en fait avec les tables et tout. Je trouve ça super
intéressant pour apprendre aussi parce que voilà pour des personnes qui ne sont pas, même pour moi,
si j'ai une idée je voudrais structurer une table, tiens comment je pourrais faire je sais pas trop,
tu vois l'outil pour tester et donner une idée et puis tu as éventuellement le modifier pour
l'adapter un peu plus mais c'est juste bluffant c'est hyper rapide et ça te sort tout direct.
Ouais mais c'est vrai que tu peux partir de postulat en fait au lieu de partir de ton schéma on va
dire de scratch de rien du tout là pour le coup en fait tu peux t'appuyer là dessus pour dire
ok sur quoi je pars quoi après t'es pas obligé de faire un copier collé exact,
bête et méchant on va dire mais tu peux largement t'inspirer pour ça peut te prémacher le travail
de manière significative quoi. Ouais parce que normalement pour la plupart des gros projets
quand tu dois faire des tables tu te creuses un petit peu la tête pendant une heure ou deux de comment
tu vas structurer les tables et là ça te donne vraiment une idée après je tiens je vais pendant
qu'on parlait je réfléchissais un truc je me disais est-ce qu'on pourrait éventuellement récupérer
le schéma des tables enfin l'utiliser dans une autre IA pour générer par exemple dans la ravelle
tu sais t'as un système qui génère les tables en fait de migration est-ce qu'on pourrait pas
utiliser une autre IA pour générer les migrations et après avoir les migrations automatiquement
enfin je pense qu'il y a un petit côté inception IA. Ouais en fait c'est mais je pense que ça serait
largement possible de faire ça avec une chaîne en fait tu vois c'est tu fais ton tu utilises ce
premier outil et après basé sur ces migrations là génère moi les lignes de commande de code
en PHP ou depuis la CLA et exécuter quoi et au final là t'as quasiment tout automatisé tout par
compte à tout automatisé à quel moment en fait tu viens garder en fait ton libre arbitre pour dire
ok cette ce champ là on va plutôt l'appeler comme ça on va plutôt l'appeler comme ça nommer
comme ça enfin tu vas d'avoir un point de contrôle à quelques moments ça me paraît important
néanmoins ça peut énormément faire gagner du temps mais de ma boule quoi ça c'est sûr et
certain. Ouais et l'outil je crois ça fait l'étable et ça je crois que tu peux faire des requêtes
aussi je pense qu'il est capable de générer des requêtes assez complexes si jamais tu veux
derrière générer des requêtes des fois parfois c'est assez complexe à écrire. Et pour le coup ça
serait ouais ça ça doit être sympa de pouvoir lui donner en fait le schéma tu lui donne le schéma
et tu dis ok moi je veux taper ça comme ça mais sans ça on va dire en français ou en anglais
classique et lui il te génère en fait la requête SQL optimisée ou au moins prête à 80% ça peut
être super super nice. Postgresnew.new on met les liens dans la description évidemment. Allez on
reste toujours sur de liens où en fait on en avait parlé dans un précédent épisode où on
parlait de formkit qui est en fait un framework pour générer des formuleurs et là en fait ils viennent
augmenter en fait la création de ce formulaire toujours à base d'IA. L'idée c'est tu viens donner un
PDF ou une photo ou un scan d'un formulaire à l'ancienne et lui en fait il va interpréter
chaque champ et il va te générer ton schéma directement avec le framework formkit évidemment
mais de la même manière tu scans et tu as un formulaire direct quoi. C'est un peu. C'est hallucinant. Le truc qui génère les tables et lui qui génère les formuleurs c'est juste fou. Là on a des super
outils enfin des vrais outils sur base d'IA qui sont vraiment intéressants. Il te génère d'un document ou même tu peux lui taper un prompt pour dire moi j'avais testé sur un simple
truc de login tu vois il m'avait généré formulaire de login formkit et en plus formkit comme c'est un système de formuleurs
avec de fin de component formuleurs après tu n'as rien à faire en fait il te donne directement les valeurs en sortie tu peux l'intégrer
direct dans ton app en vue je crois que ça ne fait que du vu par contre. Non je crois pas il me semble pas il me semble que c'est je suis pas sûr
Asi vu project ok c'est ça c'est que du vu formkit c'est vu project exact donc mais pour le coup c'est hallucinant quoi c'est vraiment bluffant pour tu gagnes vraiment du temps et à la
login ou quoi. Login haute on va dire facile. C'est hallucinant et pour le coup tu as tout tes composants et tu as ton schéma et tu as évidemment le rendu où tu peux tester tu peux tester tout ce que tu veux tu as tous tes messages d'erreur qui sont déjà codés
non c'est vraiment vraiment. En plus tu peux glisser déposer après si tu vois un truc. Bien sûr tu construits ton drag and drop avec en fait c'est vraiment la pierre manquante en fait de ces formuleurs là et pour le coup formkit était top pour les développeurs parce que en fait ils avaient
réussi à partir d'un schéma on va dire code tu venais générer tout tes formuleurs tes chiants avec les messages d'erreur les labels tout ça c'était plutôt propre par contre la grosse frustration qu'il y avait c'est que en fait le marketing pouvait pas s'en occuper il fallait un développeur pour intégrer ça avec ce système de kickstart là qu'on vient de présenter en fait ça déplace la
la puissance en fait du formuleur dans les mains du marketing ou du concepteur ou de la personne qui veut construire le formuleur à l'issue de ça il a son schéma qui est généré et donc en fait il peut donner ça au dev et le dev en fait vient intégrer directement ça dans le code
quoi donc en fait il y a une sorte de mix on n'est pas totalement sur un truc WordPress tout est fait directement par le potentiellement tout peut être fait par le par le marketing mais là en fait on est un peu à la croisée des mondes entre l'automate on va dire l'autonomisation je sais pas si ça se dit mais rendre autonome la création sans pour autant en fait dénigrer le code et l'expérience avec les couleurs le branding et tout ça quoi
c'est très très puissant et ça me paraît vraiment vraiment pas mal
c'est top d'autant que les formuleurs c'est vraiment le truc le moins intéressant à faire en développement donc
si on peut éviter de les faire c'est clair un peu la même chose le temps donc
c'est clair la suite
Tori pour ceux qui connaissent pas Tori c'est un peu l'équivalent de en fait il s'inspire dans la même veine que Electron c'est à dire utiliser
la technologie web du CSS du JavaScript et du HTML CSS JavaScript pour créer des applications desktop mais là en fait ça va encore plus loin parce que
tu peux interagir avec du Rust ils ont créé tout un écosystème c'est devenu de plus en plus solide et ils ont annoncé début du mois la version 2
mais il me semble que tu avais fait une...
j'avais fait un workshop il y a très longtemps la première version
je cherchais dans les vidéos YouTube mais on avait fait un workshop
où j'étais un petit peu voir comment ça s'installait tout ça et comment on arrivait à communiquer sur une application desktop
et c'était assez simple en fait tu as une API machin et après c'est pas mal du coup c'est en Rust tu vois comme quoi on avait quand même un truc en Rust
et la nouveauté principale de Tori 2 c'est quoi c'est ?
alors en fait il y a 2, 3, il y a des breaking change, il y a l'utilisation de toujours plein de plugins où en fait ils viennent
découper en fait tout le corps des applications pour pouvoir donner plus ou moins accès à des fonctions natives de ton opérateur
par exemple ok je vais pouvoir interagir avec la barre, la barre du menu, la barre de la fenêtre ou des choses comme ça
et en fait ce qui est super intéressant c'est qu'ils arrivent maintenant à déployer sur iOS Android
et là en fait tu te dis c'est un nouvel acteur, ils vont commencer à rentrer en fait vraiment en concurrence
alors est-ce que ça va surpasser le dev natif ? j'y crois pas trop en tout cas pas pour l'instant mais ils sont en train de, enfin voilà ils viennent croquer là dessus
donc super intéressant c'est en release candidate autant dire c'est pas encore officiel et ça vient pas sortir tout de suite
mais ça s'annonce plutôt bien et en tout cas c'est vraiment un projet ou une techno qu'on suit de manière assez régulière
parce qu'on a vu toute la communauté se détourner d'électrons pour Tory et donc on pense que ouais
pour ceux qui font du web et qui doivent déployer un OS sur différentes plateformes, une application sur différentes OS
ça peut être une très très bonne solution
après électrons c'était basé sur notre JS si je me trompe pas donc ça avait de tendance
alors je sais pas comment ils font parce que VS Code il est basé sur Electron toujours je crois, moi ils ont changé depuis où ils ont fait un truc d'application
ouais je crois qu'ils ont bien réécrit beaucoup de choses
ouais parce que VS Code dans l'ensemble il tourne pas mal alors qu'électrons c'était le reproche c'est que ça faisait trop tourner le processeur
Tory c'est du reste donc logiquement ça tourne du feu de Dieu
et puis ça va être beaucoup plus light à faire tourner par contre le fait que ça tourne sur mobile c'est pas mal
à tester, à voir
ouais faire un contest c'est clair un nouveau workshop
exactement, à tester aussi Chereo qui passe en 1.0
mais Chereo c'est un truc mais c'est super vieux en fait
c'est vieux ouais
je sais pas depuis quand ça existe Chereo mais j'ai vu ça l'autre jour version 1 tu dis ah ouais ok d'accord
ça fait dix ans que ça existe
c'est ça et est-ce qu'on peut rappeler ce que ça fait Chereo ?
Chereo en fait c'est un système qui permet de passer en fait du HTML
donc tu donnes un document ou une string n'importe quoi sous forme de HTML
et après tu peux naviguer dedans et sélectionner des éléments à la manière de jQuery
ah j'ai dit désolé
mais c'est vraiment exactement ça parce que c'est des dollars machin dollars je sais plus parce que je fais plus de jQuery
mais voilà c'est vraiment l'écriture de jQuery mais tu navigues à travers ton domaine et tu vas récupérer les éléments
ok et pour le coup c'est beaucoup beaucoup utilisé pour scraper les données et donc pour parser et pour récupérer les infos quoi
ouais c'est ça
toutes les personnes qui font du scrap de données à droite à gauche connaissent Chereo
et là en fait le fait que ça passe en version 1 ils viennent quand même casser et introduire des breaking change dans la façon de parler
par contre enfin dans la communication avec la pays par contre est-ce qu'il y a des gains ou des nouvelles fonctionnalités ?
non je crois pas en fait tu vois si tu regardes dans les breaking
c'est juste version de note des trucs comme ça il n'y a pas
après ils ont changé de trois trucs mais ouais en fait ils ont enlevé certainement des polyfill des trucs comme ça j'en sais rien mais voilà ils ont certainement
comment dire modernisé un petit peu le code
et peut-être plus de natif aussi donc
ouais plus de natif après ça tourne sur note et tout
non c'est un bel outil mais enfin la version 1
c'est quoi comme quoi ils ont mis le temps
moi là c'est nickel la version 1 elle est parfaite
toujours en terme de bel outil
alors pour ceux qui ne le savent pas j'ai quand même mon petit faible pour directus en terme de CMS headless
si vous n'avez pas écouté l'épisode CMS sur les CMS headless
on vous invite à aller voir dans votre plateforme de podcast préféré et d'écouter l'épisode sur les CMS headless
où on vient justement expliquer tout le potentiel et tout le spectre
de solutions qu'on a aujourd'hui pour utiliser ça
et il y a un des acteurs qui s'appelle directus qui avait aujourd'hui une offre directement en cloud qui commençait à 99$ par mois
et donc c'était pas pour toutes les bourses
et aujourd'hui ils sont venus avec une nouvelle offre qui est une offre starter
oui c'est je pense que
on en parlait juste avant l'épisode en fait à une époque tu me disais
parce que moi il me semblait qu'il y avait une version frime et tu me dis ça fait deux ans que l'avait disparu
donc je ne sais pas c'est, moi je trouve ça faisait quand même assez élevé 99$
en fait tu passes vraiment d'un pricing où tu es à zéro
enfin tu payes rien tu n'as rien
et tout de suite la première marche c'est 99$
et il y a un peu de l'espace au milieu
et donc je pense que la stratégie d'avoir quelque chose à 15$ par mois
en auto, pardon pas en auto hébergé mais en hosté
donc c'est-à-dire sur leur cloud à eux et géré par eux
c'est totalement pertinent
après tu peux toujours utiliser directus sur ta propre machine
et tu viens toi même l'héberger si tu es en capacité de le faire sur ton VPS
ou sur un Kooli-Fi par exemple
tu peux l'héberger facilement
après à ce prix là tu as quand même des limitations
ce qui est normal
une personne qui doit gérer l'application
est à 5000 entrées dans ta DB
avec 50 000 appels API
pour le coup
pour un site project
ça peut être largement suffisant
ou pour un petit client qui sait de toute façon que ça va rester sur le scope
ou en début de projet juste pour éviter de payer 100 balles directement
ça peut être largement intéressant
de toute façon c'est clair pour les petits projets
si tu veux un site vitrine
100 balles c'était beaucoup trop élevé
donc il fallait vraiment une offre beaucoup plus adaptée
un petit site 15 balles c'est bien
c'est le bon prix je pense
parce que après si tu mets un serveur toi en auto héberger
tu arrives presque à ce prix là
là tu géreras rien, tu es tranquille
et pour le coup si ton client est prêt à mettre ce prix là
toi tu gères pas l'hébergement, tu lui mets sa carte bleue
que si tu dois l'héberger
toi tu dois facturer son hébergement, tu dois gérer son hébergement
tout de suite le prix sera beaucoup plus élevé
en plus il me semble
que la version cloud et la version community
il y a des différences, il y a des choses en plus
sur la version cloud il y a pas toutes les features
par contre peut-être je serais incapable de dire
lesquels ne sont pas de tête
je suis pas capable mais oui il y a 2-3 différences
et après je regardais aussi Strapi parce que c'est un peu la concurrent
enfin je sais pas après si ils sont directement concurrents
je sais pas qui est le plus gros Strapi et Directus
mais Strapi ils ont une offre à 29$
c'est peut-être aussi pour ça, les concurrents ont déjà des offres
dans cet arrif là donc ils ont été obligés à un moment donné
de baisser les prix, enfin au moins la première marche elle est accessible
oui exactement mais je pense que tu as de zéro assemblage
le step est trop élevé en termes de gamme de prix
ça se tient totalement
allez on repart sur un truc un petit peu plus
technique, technico-technique
est-ce qu'on ne serait pas en train de voir la fusion
est-ce que en fait TES ne serait pas en train
type script ne serait pas en train de venir le vrai standard
et s'infiltrer partout dans l'univers JS
alors ça serait je sais pas si c'est une bonne nouvelle ça mais
je sais pas si c'est une bonne nouvelle je suis complètement d'accord
parce qu'on fait tous les deux on fait un peu partie de la team
type script c'est top mais par contre des fois ça prend la tête
surtout comme des trucs si
toujours est-il que derrière la dernière version qui est en 22.6
derrière un flag néanmoins il faut quand même initialiser ça
en fait on va nativement node va pouvoir prendre en compte les fichiers type
type script et c'est quoi exactement
en fait il dégage les types à notation des fichiers pointes et après
il lit le type script directement en fait sans le transformer
voilà donc
avec quelques limitations
mais pour le coup au-delà de cette simple on va dire simple news
il y a quand même moi ce que je remarque c'est quand même
que en fait type script a réussi à rentrer comme un standard de maboul
et même en fait sur node qui était l'environnement
donc je me pose la question est-ce que tu vois les dénaux
les bannes et tout ça qui en fait ont été vachement plus pushy sur le type script
est-ce qu'ils sont pas venus en fait bouger un peu les lignes de la team de node
c'est sûr
des nôts et surtout bonnes qui lis le type script directement sans rien faire
ça donne un coup de bienfair milliard donc ils étaient obligés de se bouger
parce que les concurrents sont capables de lire le type script qui est devenu généralisé
tu n'as plus un projet aujourd'hui en tout cas une librairie
qui n'est pas écrit en type script
tout est écrit type script ça permet à ceux qui utilisent les librairies
si on est en JS
si on est dans un système de JS
toutes les librairies sont écrit en type script
la plupart des projets aujourd'hui tu les vois sont écrit en type script
c'est devenu le standard
tous les nouveaux devs qui sortent des écoles
j'en ai vu pas mal
ils cherchent même pas à comprendre
c'est devenu le standard
ça reste du JS, il faut tipper
ça se fait
je sais pas comment il s'appelle
un type script total
il te sort des trucs de l'espace
mais qu'est-ce que c'est que ce truc
c'est exactement ça pour tipper un micro truc
ultra basique
il te fait un type page monstrueux
qui au final perd en lecture
quand t'arrives dessus
c'est pas mal
c'est homie, pique
c'est devenu une usine à gaz
et là tu perds toutes les expériences
c'est raison gardée
on est obligé de basculer d'un côté dans le too much
revenir, rien du tout c'est pas bien
too much tu perds beaucoup trop de choses
trouvant un juste milieu raison gardée
c'est bien plus intéressant
c'est clair, type script apporte beaucoup en tant que dev
moi personnellement devenir ingénieur type script
ça m'intéresse pas
merci, je passe mon tour
c'est exactement ça
la suite, une autre solution
qui nous permet de
de gérer des background jobs
on sait que
souvent on doit effectuer des tâches
mais on n'a pas besoin de les faire de manière
synchrones, on peut les faire de manière asynchrone
où on va générer une queue
un processus parallèle à notre exécution classique
pour pouvoir générer des tâches
qui sont souvent lourdes
je pense par exemple à processer une vidéo
ça prend du temps, processer un fichier mp3
ça peut prendre du temps si on doit collecter
toutes les données
de la même manière si on doit le temporiser
je dois exécuter ça mais que dans 2 minutes
voilà la solution classique c'était de faire des queues
aujourd'hui on a une solution
qui s'appelle trigger.dev
qui se veut comme une solution open source
pour exécuter des background jobs
et c'est une plateforme qui nous permet
de déployer vraiment les tâches
en background
Open source comme tu dis
il y a une version standard
c'est une version cloud
ou une version self-hosted
c'est cool de pouvoir l'installer chez toi
il y a des exemples de dashboard
où tu as les tâches qui tournent
et ça ne marche pas
et après tu écris toutes les tâches en code
tjs
et pour le coup
sur le cloud
tu as 5 dollars d'usage
parce que c'est un fonctionnement en service
ça veut dire que tu vas exécuter
tu vas être facturé à l'exécution de ta tâche
plus ta tâche
en tout cas énergivore
en termes de capacité et de CPU
plus tu vas payer cher
et à la fin tu vas payer
sauf que tu as un crédit de 5 dollars par mois
pour des tâches classiques basiques
ça peut largement suffire
c'est vrai qu'après
les prix sont assez transparents
tu as le prix à l'heure
finalement
ce n'est pas accessif les prix
non
pour le coup
je trouve ça hyper clean et transparent
leur pricing modèle est super clair
et en plus
tu peux tellement l'utiliser pour plein de choses
je vois sur le projet
je dois gérer beaucoup de prix
de mise à jour de prix
je ne voudrais pas que le batch de mise à jour de prix
vienne ralentir mon expérience utilisateur
qui est en train de naviguer sur l'application
donc faire ça en background
c'est totalement pertinent
totalement pertinent
pour le coup
il y a Mark and Doxt
en fait
tu peux totalement agnosticer
parce que
le truc c'est que tu viens créer un petit répertoire
dans ton repo
que tu appelles trigger
et tous les fichiers que tu as mis dans ce dossier
vont être interprétés par trigger.dev
et donc depuis ton dashboard
tu viens connecter ton repo
github
et il va aller analyser
le folder qui s'appelle trigger
et il va interpréter tous ces fichiers
il va les monter en mode endpoint
et voilà
en fait
ok, ça je n'avais pas compris
tu fais tout tes codes dans ton projet
et lui après tu le connectes
c'est pas mal ça
oui, tu n'as pas besoin
de séparer le code
par contre
tu vas déployer
par exemple si tu fais un verselle deploy
ou un netlify deploy
tu vas faire de la même chose
tu vas faire un trigger deploy
ils ont une CLI qui est exactement la même chose
en fait au lieu de monter tout ton applicatif
tu ne vas monter que ton serverless
tes serverless functions
et voilà
ça va être trigger automatiquement
non franchement c'est très puissant
pour le coup
le quick start est vraiment bien
tu vois c'est hyper explicit
ou en fait
tu viens tout créer
c'est vraiment intéressant
et c'est ultra facile à mettre en place
donc
super outil
qui ne s'appelait pas trigger avant
autrement je ne m'en rappelle plus
mais ils ont rebrandé le truc
ça marche très très bien
c'est un bon outil
ils ont plein d'exemples
vidéo processing
après il y a le PDF
tout ces choses là qui prennent un peu de temps
à générer
c'est vraiment pas mal en fait
l'outil a vraiment sympa
on fait peut-être un petit workshop
un petit workshop
allez
on se rajoute des workshops
rien d'actif
exactement
on déroule
la suite toujours dans ces super outils
on connaît tous Webflow
tu as déjà bossé avec Webflow ?
non je me suis juste amusé un peu avec
mais j'ai jamais vendu ça à un client
après c'est pas mal
pour faire un truc simple
ou une monopage
enfin n'importe quoi
l'outil est vraiment très avancé
après
tu as beaucoup de designers
qui facturent
la prestation
et qui font des sites internet
uniquement avec
avec Webflow
et de la même manière
ils ont un service de
de gestion de CMS
pour gérer toutes les données
et là en fait
on vous présente WebStudio
qui se veut en fait
l'équivalent open source
de Webflow
alors pour le coup
je n'ai pas maîtrisé
enfin je maîtrise par Webflow
et donc je peux pas comparer
ce que tu peux faire
et ce que tu peux pas faire
néanmoins
on voit que c'est quand même assez poussé
et je pense que le projet
est assez mature
pour venir concurrencer Webflow
après peut-être que l'expérience
est telle
et Webflow a tellement tellement d'avance
sauf que est-ce qu'on va
est-ce que le développeur
on va dire classique
va utiliser toute la puissance
de Webflow
ça se trouve il utilise que 20% de Webflow
et il pourrait
faire exactement la même chose
avec WebStudio
qui est son version open source
sans pour autant
ça quitter de
le même prix
du service
WebStudio c'est assez récent
c'est assez joli
je me souviens du début
quand le gars avait commencé
à lancer le projet
je crois que ça doit même pas de 2 ans
c'est récent donc je pense pas
qu'il soit au niveau de Webflow
parce que Webflow a une telle avance
Webflow tu peux vraiment
aller très très loin avec
le stress tu peux même
créer des blocs et des components
en réacte
et les intégrer après dans ton truc
donc tu vois quelqu'un qui est très bon
en développement peut faire des
choses assez poussées avec Webflow
après il y a toujours la problématique
de c'est pas open source
c'est propriétaire
il faut payer un abonnement etc
et puis il peut augmenter
à n'importe quel moment
voilà tu deviens un petit peu
quand même prisonnière de ce truc
mais voilà c'est un débat
bon on va pas le faire
mais WebStudio c'est intéressant
et surtout ce qui est intéressant
c'est comme le l'outil qu'on parlait
juste avant c'est que tu as une version
pareil Cloud hébergée
et une version que toi tu peux hébergé
et là ça devient intéressant
parce que tu vois ne serait-ce que
l'exemple d'une boîte
qui veut donner la possibilité
à son marketing de générer
des landing page ou un truc comme ça
peut-être que là l'outil est capable
de le faire et tu peux le mettre
en interne et puis faire
voilà ton marketing il est libre
il fait ce qu'il veut
il est surtout autonome
c'est clair
ouais autonome et ça change d'un WordPress
ou n'importe quoi
je sais pas après comment ça fonctionne
la génération de pages
si c'est du statique ou pas
j'ai pas regardé en détail mais
deploy to versel, deploy to Netlify
donc ça ressemble vraiment à mon avis
il y a sûrement un système de statique
ou un truc comme ça
donc ouais ça change un peu
de WordPress
il faut voir comment ça fonctionne
les possibilités mais
ouais c'est pas mal
après voilà tout ce qui est
ouais pour du landing page
tout ça ça pourrait être intéressant
est-ce que tu disais
ouais tout ce qui est data
ils appellent ça des collections
dans webflow je crois
ouais
donc tu as une sorte de
voilà tu vas faire des articles
après tu les affiches
c'est une collection
enfin c'est des data
donc c'est un petit peu délangage
un petit peu différent mais
ça c'est assez puissant
ouais c'est du no-code
ouais ouais exactement
c'est du no-code mais tu peux
tu peux interagir aussi avec
tes CMS classiques
par exemple
tu vois c'est pas leur CMS à eux
en fait c'est une surcouche
qui vient te plugger
sur ce que tu veux
donc pour le coup c'est plus
agnostique
de CMS
en fait tu viens brancher
ton CMS
et leur outil eux
te permet de créer l'interface
entre ton tapage
et ton CMS
headless
donc c'est intéressant
après c'est des outils
souvent ce que je pense c'est que
pour parler de WordPress
il y a beaucoup de gens qui utilisent des trucs
comme des constructeurs de pages
je sais plus comment ça s'appelle
page builder
élémentor
ouais élémentor
des choses comme ça
et très clairement
enfin à utiliser WordPress
avec élémentor
qui est payant quand tu veux vraiment
utiliser élémentor
je me demande des fois
si ça n'a pas plus le coup d'utiliser
un truc comme webflow
plutôt que casser la tête
avec un WordPress élémentor
après c'est mon avis mais
le process
le process
ça fait 10, 20, 50 sites
qu'on fait comme ça
donc changer le process
demain le dev n'est plus là
qui gère
qui est le garant du process
là c'est une nouvelle techno
on n'a pas l'habitude
on sait pas faire
les habitudes
après c'est aussi Tio
des boîtes d'avoir un petit peu les
sites
non mais les sites Tio des boîtes
qui
moi je pense que
ils sont souvent frileux
les mecs
non c'est le site Tio de l'agence
c'est le site Tio des agences
alors les agences c'est un problème c'est que les mecs ils n'ont
jamais le temps de tester les outils
et de faire évoluer leur process
il faut que ça chie
faut que ça chie
après dans les boîtes
ça dépend de la maturité
de la boîte
mais tu vois souvent ils ont
plus de temps
et ils
peuvent mettre en place des choses
comme ça
pourquoi pas
je pense que le coeur du problème
si ils viennent concurrencer Webflow
Webflow c'est typiquement
le produit agence
vraiment
on enchaîne sur l'accessibilité
alors toi
mais toi t'as été formé là-dessus Patrick
non ?
j'avais fait une formation d'accessibilité
c'est le premier niveau
je suis pas un expert en accessibilité
mais j'ai voulu me former
pour ne stresser qu'avoir les bases
et oui c'est très important
c'est souvent passé à la trappe
sur le projet
mais il faut savoir que c'est obligatoire
sur certains sites c'est notamment ce du gouvernement
le gouvernement est obligé d'avoir des sites accessibles
et quand on parle d'accessibilité
on parle pas seulement de personnes
avec des gros handicaps
on parle aussi de personnes qui ont des problèmes de vision
des problèmes avec
d'altonisme
il y a plein de noms
à différents stats de d'altonien
et ça c'est un outil
c'est plus un outil pour les
designers
qui permet de tester des contrastes
et de voir si ça passe au niveau de l'accessibilité
et donc
t'as le petit color picker sur le côté à gauche
qui permet de changer les couleurs des boutons
tu changes la couleur
et après en fonction du texte
ça te dit si ça passe ou pas
le test de contraste
et puis là par exemple c'est tout en fail
là ça passe à moitié
si c'est lisible ou pas
c'est plutôt un test
il y a là on ne voit rien par exemple
et en fait c'est tout est répertorié
par patologie
de
si je suis d'altonien
si je suis trop anhopia
machin tout ça
en fait
en fait
ça va prendre en compte
la perte
potentielle de visibilité
avec
la couleur
que je vais suggérer
voilà
ça c'est hyper important
t'as un peu de tout, t'as du en bas
t'as le glaucomme, cataract glaucomme
si t'as du soleil aussi
tu vois parce que c'est con
mais par exemple t'es sur un téléphone
t'as le soleil, t'arrives pas à lire
il y a un direct sunlight, il y a plein de choses comme ça
et souvent faut pas oublier
parce que ça concerne pas
enfin on parle souvent d'accessibilité mais souvent d'accessibilité
ça concerne pas uniquement les gens qui ont des problèmes vraiment
d'handicap tout ça, ça concerne un peu tout le monde
en fait des fois nous on est fatigué
t'as une vie tu vois un petit peu moins bien
tout ça, ou le soleil
ou des choses comme ça et en fait
finalement ça sert à tout le monde en fait la plupart du temps
ouais ok
et ouais ouais
après il y a pas aussi
une erreur qui peut être induite aussi
par les écrans sur la représentation
des couleurs
si l'écran est plus ou moins fidèle
ma question est sans doute naïve
je ne sais pas
bien sûr ça peut jouer
c'est pour ça qu'il faut acheter un bon écran quand tu dévoiles
ouais ouais ça se tient
carrément
et les écrans ça coûte cher
les bons écrans ça coûte cher
ok petit tout le ce qui s'appelle
woukenuse.fr
point com
je suppose
point com
point com
yes
allez on passe sur un outil plus
pédagogique
qui en fait nous explique
la propagation
des événements dans le dom
alors on sait que ça peut être
vite compliqué on sait aussi
que le dom
on a accès
à plein plein plein d'événements donc c'est
à la fois super bien et à la fois
parfois un peu complexe
parce que il y a énormément
d'événements qui se passent
et quand on les passe d'un composant
à un autre du parent à l'enfant
au grand enfant au second tout ça
il se passe plein de choses
et là en fait
donc c'est un projet qui est soutenu
ou développé par
par alex ryrdon
il m'excusera d'avoir écorché
son nom par contre
c'est hyper didactique
et en fait on voit vraiment
la propagation de l'événement
et tout l'impact
que ça peut avoir si
on vient mettre
un arrêt
ou en tout cas un event
l'issueur qui est passif
qui vient de s'exécuter
que une fois
si on peut stopper la propagation
est-ce qu'on met un prevent default
ou pas
et en fait là on visualise
de manière très ludique
en fait qu'est-ce qui se passe
et pourquoi ça déconne
et en fait je trouve ça
super intéressant et c'est ultra didactique
c'est super pédagogique
pour
le DOM event
qu'on est censé tous connaître
ça fait partie du DOM, du HTML
de JavaScript
et souvent on ne comprend pas trop
stop propagation, pourquoi il faut l'utiliser
ou quand je clique sur mon bouton
j'ai un autre truc qui réagit
ça permet de se rafraîcher
un peu la mémoire
ou d'apprendre pour ceux qui n'ont pas appris ces choses là
et donc
c'est visuel donc on comprend assez facilement
comment ça fonctionne et puis c'est didactique
c'est pas mal
c'est très puissant
et c'est assez simple
en fait c'est vraiment rendu accessible
quelque chose qui peut être assez complexe
en fait visuellement et de manière
hyper pédagée
le site s'appelle
DOM event
c'est ça ?
DOM events
avec un s
point dev
évidemment le lien dans la description
mais
belle petite découverte
pédagogique
super intéressant
surtout aujourd'hui on fait beaucoup de web app
javascript on met des clics dans tous les sens
des événements dans tous les sens
comprendre ne serait-ce que ce qui se passe
au niveau de la poêle
top
allez on reste sur le web
avec les web component
aujourd'hui c'est devenu un standard
beaucoup plus accessible
qu'il y a quelques années
et là c'est quoi ?
c'est un tutoriel
c'est une formation
c'est une course gratuite
pour apprendre à faire des web component
toutes les bases toutes les notions
voilà c'est un free roadmap
comme il marque en haut
tout le cheminement
pour apprendre à faire des web component
comme tu dis ils sont bien pris en charge maintenant
par-dessus des navigateurs
il y a quelques années c'était pas le cas
il n'y avait pas les chadoudomes tout ça
on était encore limité
on était obligé d'avoir des librairies par-dessus
pour que ce soit bien pris en charge
aujourd'hui normalement tout fonctionne
donc on peut créer des web component
qui sont natifs je le rappelle
il n'y a pas besoin de réacte
et en plus ce qu'il y a bien
c'est qu'on peut créer des web component
qu'on peut intégrer dans des projets réactes
ou vues ou angulards
et ça fonctionne directement donc c'est pas mal
donc ce ne serait-ce que pour apprendre
les bases des web component
et puis c'est toujours intéressant
d'apprendre un peu plus
parce que forcément tu as allé acheter les templates
les chadoudomes tout ça
qui sont des choses natives donc on apprend
à les utiliser donc c'est intéressant
de passer par ça
et pour le coup
est-ce qu'en fait
on ne serait pas en train de recoder la roue
de manière native
tu vois, est-ce que
quelle est l'intérêt de passer par un web component
vanilla on va dire
plutôt que de le faire en réacte
ou en vue ou en angulards
veldt whatever
parce que normalement tu peux écrire ton component
en vanilla js et tu n'as pas besoin de le compiler
normalement il fonctionne direct
parce que c'est compris par le navigateur
donc tu peux faire des component
un web component et après tu peux réutiliser
ton tag et tu l'intègres directement
dans ton html style tu vas faire
je ne sais pas un tag
hello world
hello-world
donc ça sera ton web component et après tu l'intègres directement
dans l'html et le navigateur le comprend
il va chercher
le tag en fait
et tu auras un tag qui va fonctionner
en web component
donc ça l'intérêt c'est de plus passer par cette phase de compilation
on est en natif
ok donc tu viens
en fait de supprimer
ton js
ton vue
voilà tout ce tooling
au fil des années
il évolue les web components
et ça évolue au fil des années
c'est de mieux en mieux
après ça reste une écriture
c'est un peu différent c'est plus complexe
à écrire
c'est un plus component de réacte c'est clair
mais
moi je ne sais pas après si
même si tu n'utilises pas
en projet tout ça c'est toujours
intéressant d'apprendre les notions
de comment ça fonctionne
ça peut toujours faire progresser même sur ce que tu fais
avec d'autres technos
comprendre quoi
ouais
comprendre de quoi tu parles
yes
allez
en dernière petit outil
qui est du pur pur pur css
on connait tous la tendance
à supprimer lgs
toutes ces formes
souvent on va utiliser des formes
aujourd'hui on est plutôt habitués
à utiliser des svg
le truc un peu standard
et là en fait c'est un outil
qui fait des clips passent
donc des formes
on va dire pas vectorielles mais ouais quasiment
mais des formes qui ne sont
fait que en css
ouais c'est ça
donc
t'en as pas mal de formes
tu as plusieurs formes
c'est du pur css
ce qui est intéressant c'est de regarder le code générive
en css
alors on va
prendre
quelque chose d'assez complexe
on va dire un
polygon
avec potentiellement
on va dire
5
alors c'est assez
je veux pas dire que c'est assez facile
mais c'est
balèze
en fait ça vient
automatiquement en fait créer
ton clip passent
automatiquement
et tu peux faire une rotation
directement pour le
on va dire le mettre directement
dans la forme que tu veux
par contre c'est des formes pleines
ou des
stripes on va dire
que des borders
et tu peux même mettre des images inversées
et là pour le coup
ça commence vraiment à être un petit peu plus
un peu plus stylé
tu peux mettre des borders
autant que tu veux
c'est assez complexe
avec des vagues
je crois, wavy, circle
ça aussi
tu peux créer des patterns
de vagues
avec la longueur
de vagues que tu veux
autant de repeats
que tu veux
et tu viens juste interpréter tes données
et
après ça vient faire le taf
donc
intéressant
après ce qui est plutôt bien c'est le full css
quoi
ouais ouais ouais
de voir le code généré
c'est juste, ne serait-ce que pour la notion de la prendre un petit peu plus
sur le code css généré, le clip passent
tout ça, comment il fonctionne, le polygone
c'est intéressant
c'est vrai que j'irais manuellement
les masques radiales
pixels tout ça
ouais
si le mec qui arrive à écrire ça
c'est pas un autiste mais presque
quoi
donc oui c'est sûr que si tu n'as pas un outil
pour générer ça
c'est assez
difficile
on en reste là Patrick ?
un grand merci à tout le monde
un grand merci à tout le monde
pensez à mettre un petit like
un petit commentaire, ça fait toujours plaisir
et on vous dit à bientôt