Design & Développement web - Le topic des canards qui mangent des cookies

[Awake]

Wordpress ce n'est plus en PHP ?

[raaaahman]

J'iamgine que mellifico voudrait obtenir les types des réponses de l'API REST de WordPress.

[Sangoon]

A tout hasard, est-ce que ça : https://github.com/johnbillion/wp-js...kages/wp-types ne pourrait pas faire le job ?

[mellifico]

Bien bien, merci pour ta réponse Orhin !


ps : En ce qui concerne wordpress, je comprends même pas pourquoi je me suis posé la question, ça n'a rien du tout à voir...j'ai honte....et en fait j'ai quinze pauv' lignes de types tout bête qui fonctionnent très bien sur les micro sites que j'ai pu faire donc j'm'en fous, en plus chuis obligé d'utiliser Directus maintenant.

- - - Mise à jour - - -

@ raaaahman en graphql surtout, ouaip !

@ Sangoon merci pour ce lien bon pour ma culture !

[Captain_Cowkill]

C'est exactement ça.

Lorsque tu développes en typescript, pour utiliser une librairie externe il est grandement préférable (mais pas strictement obligatoire) d'avoir une définition de type qui décrivent les objets/fonctions/classes que tu peux importer et utiliser.
Cependant, un certain nombre de librairies (notamment celles assez anciennes) ne fournissent pas ces définitions de type dans leur package npm.
Pour palier à ce problème, le dépôt DefinitelyTyped a été créé afin de regrouper les définitions de type créées par la communauté pour tout un tas de librairies.

Ces définitions de type sont ensuite disponibles sous forme de package npm pour chaque librairie.
Si tu installes un package npm toto, il est possible d'installer en parallèle un package @types/toto qui va fournir la définition de type manquante.

Ah mais c'est cool ça

Je me suis retrouvé plus d'une fois à devoir typer des trucs venant de certains packages à la mano et c'est toujours une prise de tête. Merci !

[Orhin]

Va falloir créer une section "quick-tips de typescript".

[GrandFather]

Va falloir créer une section "quick-tips de typescript".

Excellente idée ! Une section de moins du forum à lire.

[raaaahman]

@ raaaahman en graphql surtout, ouaip !

En GraphQL? Je n'ai pas trop la notion sur cette tech, mais ça m'étonne que WordPress la supporte... ou c'est une extension?

Va falloir créer une section "quick-tips de typescript".

En vrai une collection de Gist GitHub (ou équivalent) ça peut être carrément pratique (surtout si on pourra à terme les charger dans une IA type Co-Pilot).

[mellifico]

@ raaaahman Oui, avec des extensions (y'en a au moins deux).

[Awake]

Je viens de pondre https://goleri.com en une soirée + une journée depuis l'idée jusqu'à la prod. (l'annonce : https://forum.canardpc.com/threads/1...es-des-canards )

Pour le code, c'est simplement du vue.js en ts avec le router. Je n'ai pas assez creusé Vue pour vraiment avoir un retour, en revanche l'intégration à mon IDE (webstorm) n'était pas vraiment au point.

Par contre je dois vous recommander Cloudflare Pages pour un site web statique. Il suffit de connecter son repos github à cloudflare, dire qu'on boss en vue, et le déploiement se faire tout seul à chaque push. Il y a bien sur plein de frameworks supportés, et il est possible de mettre ses propres commandes de build. C'est franchement incroyable de simplicité à configurer, et c'est gratuit Requêtes et bande passante illimités. Tout ce que ça m'a coûté c'est le nom de domaine à 9$, lui aussi pris chez cloudflare, et encore une fois la configuration s'est faite en 3 clics. Si vous ne voulez pas de domaine, vous pouvez avoir mondomaine.pages.dev gratos.

Bref Cloudflare pages, c'est vraiment ce qui m'a fait gagner du temps sur ce projet, et l'expérience a été sans faute

[Etheon]

Cloudflare ils se sont bien amélioré ces derniers temps sur l'hosting avec pages, les workers, leur R2...

Dans le même type ya Vercel qui est vraiment top (j'utilise que ça pour les projets perso), et Netlify également. Mais je crois que Cloudflare est bien mieux niveau scale / prix.

Et rigolo le projet sinon o/

[raaaahman]

Je suis régulièrement les actus de la semaine de DevTheory sur YouTube, ça fait un peu de veille facile à consommer, c'est cool. J'imagine qu'il n'est pas le seul sur ce créneau, vous en connaissez d'autres?

[Awake]

Niveau veille j'étais inscrit à https://ecmascript.news/ pendant un bon moment, mais la qualité n'est plus vraiment là (ou ne l'a jamais été et j'ai fini par m'en rendre compte) et je me suis désinscrit.

Super reco, je sais

[Awake]

Je vais commencer l'écriture d'une app mobile, android + iOs. Se pose la question du framework, et je ne suis vraiment plus à jour sur ceux-ci, pour l'instant il y a deux qui ont retenu mon attention :
- react native : apparemment le standard de l'industrie
- flutter : le "petit nouveau" de Google

Mon app va utiliser de façon intensive les webviews, et va avoir besoin de s'interfacer avec celles-ci. D'emblée je pense partir sur react native, parce que c'est là que j'aurais le plus d'aide, de plugins, de support IDE... qu'en pensez-vous ?

[Orhin]

C'est quoi ton besoin niveau webviews ?

[Awake]

Des choses assez avancées malheureusement, avec de la 3d webgl, des 2d canvas conséquents, des structures HTML flex très imbriquées, et
en gros du dev déjà fait pour le web qui serait pour ainsi dire impossible à convertir.

Edit : j'ai besoin de passer par une app car je dois forcer l'orientation landscape sur certaines vues.

[Orhin]

Et niveau accès API téléphone, t'auras besoin de quoi ?

[Awake]

Pas grand chose. Les photos. A terme le play store / app store pour les paiements.

(Tu vas me dire de faire une PWA non ?)

[Orhin]

Ben en vrai si t'as pas besoin d'accès API avancés, y'a pas spécialement de mauvaise solution dans les trucs cross-plateforme.
Pars ce que tu préfères en techno.

[Awake]

D'acc merci Je vais partir sur React Native + Typescript car une bonne partie du projet est déjà en TS.

[raaaahman]

Quel projet? Let's Role?

Attention React Native ne lis pas les fichiers CSS. Il a un moteur de mise en page qui a été recréé et qui lui permet d'interpréter le CSS-in-JS, mais il y a quelque différences subtiles, et pas toutes les APIs ne sont disponibles (pas de CSS Grid à mes souvenirs). Si tu pars d'un projet existant, qui plus est conséquent, je pense que viser la PWA / le bundle Cordova / Capacitor impliquerait moins de transformations. Je parle sans expérience professionnelle de ces technos par contre...

EDIT: Dans le genre truc que je n'ai jamais expérimenté, j'essaie d'utiliser Playwright pour le test de composants React, quelqu'un a déjà tenté ce genre de sorcellerie? J'ai ouvert un billet Stack Overflow si vous vous sentez d'humeur charitable à gagner des points de réputation.

EDIT²: Okay j'ai trouvé le problème. Mais pas de solution...

[Awake]

Quel projet? Let's Role?

Attention React Native ne lis pas les fichiers CSS. Il a un moteur de mise en page qui a été recréé et qui lui permet d'interpréter le CSS-in-JS, mais il y a quelque différences subtiles, et pas toutes les APIs ne sont disponibles (pas de CSS Grid à mes souvenirs). Si tu pars d'un projet existant, qui plus est conséquent, je pense que viser la PWA / le bundle Cordova / Capacitor impliquerait moins de transformations. Je parle sans expérience professionnelle de ces technos par contre...

C'est pour ça que je vais utiliser des webviews pour certains trucs impossibles à convertir en natif.

Cela dit ma première journée de dev m'a montré à quel point les technos et env de dev ont évolués depuis que j'ai commencé le dev mobile (y'a plus de 10 ans avec titanium appcellerator, c'était l'horreur ce truc) mais que c'est toujours blindé de petits bugs chiants et d'exceptions de partout.

Ça me conforte dans l'idée de surtout rester dans les standards et là ou il y aura le plus d'aide et le plus de réactivité sur les bugs.

[Shurin]

C'est pour ça que je vais utiliser des webviews pour certains trucs impossibles à convertir en natif.

Cela dit ma première journée de dev m'a montré à quel point les technos et env de dev ont évolués depuis que j'ai commencé le dev mobile (y'a plus de 10 ans avec titanium appcellerator, c'était l'horreur ce truc) mais que c'est toujours blindé de petits bugs chiants et d'exceptions de partout.

Ça me conforte dans l'idée de surtout rester dans les standards et là ou il y aura le plus d'aide et le plus de réactivité sur les bugs.

Et encore, tu n'as pas testé Flutter pour parler d'évolution, ça va te faire un choc

[Awake]

Petit relance du topic avec un retour d'expérience !

Je cherchais à me former sur de nouvelles techniques, et j'ai commencé à m'intéresser aux infras serverless.

Au départ j'ai été refroidi par les soucis de Cold Starts (jeu de mot ), jusqu'à ce que j'apprenne que CloudFlare propose une solution serverless, sans cold starts grâce à leur service de workers. De plus les tarifs sont carrément intéressants.

J'ai donc développé un site avec la stack JAM (Javascript, API, Markup), avec une appli React qui communique avec des workers (le site en question : https://abreakfrom.work).

Les workers sont connectés à un système de cache (nommé KV) ainsi qu'à une base de données (D1). Un worker va par exemple retourner une url d'une image de chat aléatoire. Un autre worker, plus complexe, va chercher un titre d'article wikipedia en base de données, regarder si l'article est en cache, le cas contraire aller le récupérer sur l'API de wikipedia, puis retourner le contenu dans un json.

Je dois dire que c'est assez magique à mettre en place. Et savoir que le site peut scale pour ainsi dire à l'infini, sans avoir besoin d'intervenir à aucun moment, enlève une sacré dose de stress. Tout est répliqué aux quatre coins du globe automatiquement.

Evidemment, on ne peut pas faire tout ce qu'on veut, les workers sont hyper limités (entre autres, je ne suis pas sûr qu'il est possible de faire de l'authentification classique simplement via cookies). Mais pour de l’événementiel, des sites vitrine, ou des sites basiques à fort traffic, c'est génial. Et à un coût dérisoire, 5€ par mois pour avoir les workers activés, avec beaucoup de marge avant d'avoir à payer plus (le premier MILLIARD de read sur la base de données est gratuit). Et avec CloudFlare la bande passante est gratuite


Bref excellente découverte, et j'aimerais beaucoup avoir vos retours si vous avez déjà fait du serverless, par exemple avec AWS Lambda et node

[ursule15]

Et avec CloudFlare la bande passante est gratuite

Dans les T&C pour les plans de base (free et ceux a 20 et 200 eur), il y a une limite assez basse. Sauf qu'ils n'agissent pas quand ca depasse. Je tiens ca d'inge sales chez Cloudflare que j'avais questionne sur le sujet quand on avait passe un client d'un plan a 20 euro a un plan enterprise (qui lui est bien restreint niveau bande passante). Le prix etait passe de 20 a 1500 euros (je ne parle que de la bande passante, j'exclue le cote plan enterprise qui etait deja couvert par ailleurs).
Mais oui, dans la pratique tu as raison

Et les workers, on utilise un peu mais ca coute bien trop cher (pour ce qu'on en fait), on se limite pas mal du coup. Mais oui nos utilisateurs adoreraient pouvoir utiliser ca plus souvent.

[Awake]

Pour la bande passante ça doit dépendre du service utilisé, le CDN n'est peut-être pas sur les même volumes que Pages et R2 ? Pour R2 par exemple ils annoncent haut et fort qu'il n'y a pas de frais de bp.

Mais pour les workers je suis curieux de savoir ce que tu fais pour que $0.5 le million de hits te revienne trop cher

[Dross]

Bref excellente découverte, et j'aimerais beaucoup avoir vos retours si vous avez déjà fait du serverless, par exemple avec AWS Lambda et node

Oui j'utilise de temps à autre les Azure Functions : équivalent des AWS Lambda mais compatible .NET (et autre frameworks).

Mon plus gros projet avec a été la mise en place d'un pipeline de traitement : en gros, j'abonnais des évènements de ressources Azure (comme sur Azure Blob, le truc pour gérer des binaires) à des AzFunctions qui alors faisaient des traitements quand une API ou autre uploadais des trucs dessus, puis passaient des ordres sur des Azure Queue pour la suite qui étaient eux même abonnés à d'autres AzFunctions.

C'était assez rapide à mettre en place, très résilient, par contre attention aux problèmes de debugage c'est comme avec les micro-services : si c'est mal architecturé ça peux rapidement devenir un véritable enfers.


Sinon j'en utilise aussi des toutes simples : avec des trigger REST et/ou temporels, par exemple j'ai des services qui ping une AzFunction sur son endpoint REST et qui sauvegarde le dernier appel en date, et une AzFunction temporelle qui vérifie toute les heures qui est mort et qui est vivant, et préviens par email au besoin.

L'intérêt c'est que ça coûte rien : les premiers appels étant gratuits et ce genre d'usage restant bien en dessous de la limite (et au pire le coût / appel est risible). Et que c'est hyper résilient : peu de chances que ton superviseur/notification soit HS.

L'inconvénient... franchement j'en vois pas d'autres que d'être dépendant d'une plateforme cloud.

[GrandFather]

J'avais utilisé AWS Lambda pour un besoin assez trivial (envoi d'un formulaire de contact par mail après authentification), et j'avais trouvé que c'était une grosse usine à gaz. Lambda en soi est relativement simple mais quand tu dois le coupler aux modules d'utilisateurs, d'API, au backend, à ton client javascript, ça se complique assez vite. Par contre comme dit Dross l'offre gratuite est plutôt généreuse, tu peux évaluer l'ensemble sans avoir rien à débourser.

[ursule15]

Pour la bande passante ça doit dépendre du service utilisé, le CDN n'est peut-être pas sur les même volumes que Pages et R2 ? Pour R2 par exemple ils annoncent haut et fort qu'il n'y a pas de frais de bp.

Mais pour les workers je suis curieux de savoir ce que tu fais pour que $0.5 le million de hits te revienne trop cher

Oui tu a raison je parlais du CDN.
Pour les workers, dans ma boite plusieurs equipes se sont jetees dessus et ont fait marche arriere quand ils ont recu la facture. Et mon equipe avait aussi envie de les utiliser mais du coup, pas possible.
Une de nos utilisations aurait ete de monitorer le comportement de sites web cote client (les sites comportant du .js qui va declencher un message a chaque requete http - pas a chaque page) afin de detecter "des trucs" (desole pour le flou). Un peu genre notif CSP qui declenche des messages via les notif.
(alors je suis flou pour pas en dire trop, mais je suis aussi un peu loin de tout ca, donc pas sur de tout capter correctement)

[raaaahman]

J'ai donc développé un site avec la stack JAM (Javascript, API, Markup), avec une appli React qui communique avec des workers (le site en question : https://abreakfrom.work).

Bonne pioche! https://imgur.com/a/eWP6fAS