Merci pour ton retour ! Si tu débutes sur les Observables, je viens tout juste de publier une vidéo à ce sujet, ça pourrait t'intéresser czcams.com/video/53ATR2bGrRE/video.html 😉
merci pour la vidéo c'est la 2 ieme vidéo que je regarde de toi et ça m'a beaucoup aidé à comprendre rxjs, ça à toujours été une galère pour moi et la ça va déja mieux. La vidéo avant que tu as fait sur les test unitaires était top aussi. Merci
Merci pour ton retour, très content que les vidéos te soient utiles ! 😁 RxJS peut être compliqué à prendre en main au début, mais une fois que tu es plus à l’aise avec, c’est vraiment très agréable à utiliser !
Merci pour cette super vidéo, qui est devenue ma référence absolue depuis 1 semaine ! Petite question: comment tu ferais pour gérer les erreurs potentielles retournées par le back?
Hello ! Si tu souhaites gérer les erreurs retournées par ton back, tu peux utiliser l'opérateur catchError, dans lequel tu passeras uniquement s'il y a une erreur de levée dans ton observable. À partir de là tu peux faire tout ce que tu veux avec (ex: afficher un message d'erreur, ne pas mettre à jour ta recherche, etc) 😁
Très bonne vidéo, très claire et bien faite ! Par contre pour moi les observables utilisés à outrance dans Angular sont une mauvaise idée. L'utiliser pour des évenements comme un utilisateur qui remplie un form pour gagner 10 lignes de code c'est juste compléxifier le code pour aucune bonne raison. Je passe de React à Angular pour le boulot et je dois apprendre toutes ces choses, mais c'est vraiment difficille d'apprendre Angular. Les devs ont tellement compléxifié la manière de faire sans bonnes raisons que rien n'est intuitif, les Promese native du JS suffise pour 99.99% des cas mais on se retrouve avec des switchMap, concatMap etc partout, et chaque valeur devient un observable. Je pense que c'est cette compléxité inutile sur une bonne partie de la manière de coder en Angular qui rend ce framework bien moins populaire que React. (je compare le nombre de téléchargement par semaine sur npm de angular et de react, 3M vs 22M c'est énnorme)
Merci pour ton retour ! Je comprends ton ressenti, je pense que la principale difficulté avec RxJS au début c'est qu'on y est pas habitués et qu'on cherche à utiliser les Observables de la même manière qu'on travaille avec les Promise (alors qu'ils s'agit de deux concepts bien différents). L'avantage c'est que depuis les dernière versions d'Angular, tu peux utiliser les Signals pour avoir un code qui ressemble plus à ce dont tu peux être habitué, et conserver l'utilisation d'Observables et RxJS quand tu as besoin de travailler avec de l'asynchrone ou d'appliquer des traitements plus complexes ! 😁
@@ArthurLannelucq Les concepts sont assez similaire quand même, dans les 2 cas on attend un trigger (la fin d'une action dans la quasi totalité des cas) pour continuer le code ou débuter ou nouvelle action. Je n'ai rien contre les Observables en soit, pour moi c'est juste des Promese un peu plus ou moins pratique dans certains cas. C'est juste les devs Angular qui l'utilise partout qui rende Angular aussi chian a comprendre. Je pense que si on enlève rxjs de Angular le framework serait bien plus populaire et tout aussi pratique et performant, car Angular est un bon framework au même titre que React ou Vue. Et oui les Signals c'est génial, j'en utilise pas malheureusement mais quelle technologie incroyable ! :D
@@thomasbisson8523 Je me permets de donner mon avis , au début je pensais comme toi mais si tu prends l'exemple du combinelatest on se rend vite compte de la puissance de RXJS On a un flux de données qui grâce à cette fonction permet de prendre en charge plusieurs éléments de champs de recherche sans avoir à gérer tous les cas de figure de combinaisons de clés de recherche. Moi je suis fan car une fois tu que l'as fait, le code est quasi réutilisable Avec Arthur ce qu'il y a de bien c'est qu'il a bien compris qu'on a besoin d'exemples dans le cadre de notre travail , du coup ce post illustre parfaitement la puissance de RXJS , et de ce que l'on peut retrouver en entreprise. En dev on a souvent le défaut de croire que l'on peut se soustraire à certains concepts nouveaux car retourner à un apprentissage peut être barbant, et on se dit je vais le faire comme je sais faire . Sauf que ces concepts éprouvés en haut lieu par des têtes pensantes comme RXJS nous tombe tout cuit, et c'est une chance. cdlt
C'est vraiment intéressant ton tuto. J'ai juste une question, comment récupérer les erreurs pour les afficher côté front? Est ce qu'il faut appeler un subscribe dans ce cas la?
Super vidéo ! Pour les observables, si on a un system d'ajout et de modification, il faut que quand on fait une action sur les données refaire un appel a l'api a chaque fois où si je modifie la donnée dans le json observé, cela va se faire automatiquement ? Que ca soit rajouter/modifier/supprimer Merci :)
Merci pour ton retour ! Ce comportement n’est pas lié aux observables, tu peux tout à fait faire en sorte de ne pas refaire d’appel à ton API en mettant à jour l’observable qui contient tes données 😁
C'est exactement ce qu'il me manquait, un exemple concret avec les observables. Merci beaucoup 😀! J'ai une question, comment tu gères les fuites de mémoires avec tous ces observables?
Merci pour ton commentaire ! Effectivement , lorsque tu t’abonnes à un observable, il est également important de t’y désabonner lorsque tu cesses de vouloir écouter dessus (ex: quand ton composant est destroy), au risque d’avoir des fuites mémoires. Pour cela tu n’as besoin de te désabonner que sur l’observable auquel tu t’es abonné (donc tu n’as rien à faire sur les observables « intermédiaires »). En plus de te permettre de simplifier les traitements, le fait de combiner tes observables te permet de limiter le nombre d’abonnements. Pour te désabonner d’un observable, tu peux par exemple : * Utiliser le pipe async dans le template (comme utilisé dans cette vidéo), qui te permet de déléguer l’abonnement/désabonnement à Angular * Utiliser l’opérateur takeUntil, qui te permet d’arrêter d’écouter les valeurs émises par un observable à partir du moment où l’observable passé en paramètre de l’opérateur émet une valeur (c’est généralement utilisé en écoutant sur l’émission d’un Subject, sur lequel tu vas émettre une valeur dans le ngOnDestroy). À partir de la version 16 d’Angular, tu peux simplifier avec l’opérateur takeUntilDestroy
@@ArthurLannelucq Merci beaucoup pour ces précisions 😀! J'avais peur de devoir repasser sur tous mon code 😅. Comme j'ai utilisé async dans le template tous va bien alors^^.
Bonjour. J'aurai une question. J'utilise le pipe async pour importer une liste de tâches depuis une api. Sur la page, une ligne du tableau affiche les informations. L'autre ligne ne les affiche pas. Alors qu'il devrait bien y avoir deux lignes. Sur Swagger et Postman , L'Api fonctionne correctement. Pourrais-tu m'aider ? Cordialement.
Hello ! Si tu rencontres ce genre d’erreur, il s’agit généralement d’une erreur lorsque tu affiches ta donnée (ex: un pipe qui tombe en erreur). D’ailleurs, même si tu affiches la première ligne, est-ce que tous tes champs sont affiches ou tu t’arrêtes à un certain moment ? Si tu regardes la console, tu devrais également voir un message d’erreur avec plus d’informations sur le champ qui pose problème. J’espère que ça te permettra d’avancer, tiens moi au courant 😁
Merci pour ton retour ! Est-ce que tu constates aussi ça sur des vidéos plus récentes ? J’ai changé de micro au bout de quelques vidéos, le son est de meilleure qualité depuis 😁
Effectivement, j’ai mis à jour le code sur le GitHub dans une autre vidéo (sur l’utilisation des Observables avec des Signals) 😅 J’espère que tu as quand même réussi à suivre la vidéo !
@@ArthurLannelucq merci poir ta réponse j'adore ce que tu fais tu es de loin le meilleur sur Angular. Pense tu faire une vidéo mais cette fois ci avec un CRUD et sans signal ?
Merci pour ton retour, content que mes vidéos te soient utiles ! 🤩 Si tu ne l’as pas déjà vue, j’ai déjà publié une vidéo qui devrait correspondre à ce que tu recherches : czcams.com/video/zSC5Qwso304/video.html 😁
Juste très pro comme tuto
Bravo !! c'est très explicite
Merci pour ton retour !
Si tu débutes sur les Observables, je viens tout juste de publier une vidéo à ce sujet, ça pourrait t'intéresser czcams.com/video/53ATR2bGrRE/video.html 😉
Merci, c'est la prémière fois que je visualise ton contenu et j'avoue que j'ai été tout de suite emballé.
Merci pour la connaissance en plus.
Merci beaucoup pour ton retour 🤩
Merci beaucoup pour cette vidéo, très clair 👌👏
merci pour la vidéo c'est la 2 ieme vidéo que je regarde de toi et ça m'a beaucoup aidé à comprendre rxjs, ça à toujours été une galère pour moi et la ça va déja mieux. La vidéo avant que tu as fait sur les test unitaires était top aussi. Merci
Merci pour ton retour, très content que les vidéos te soient utiles ! 😁
RxJS peut être compliqué à prendre en main au début, mais une fois que tu es plus à l’aise avec, c’est vraiment très agréable à utiliser !
C’est exactement le cas de figure avec lequel je me suis battu cette semaine. Merci pour les explications !
Je trouve que c’est le cas typique qui permet de se rendre compte à quel point les observables sont pratiques, content que ça t’ait été utile ! 😁
tes videos sont top. je suis accro
Merci pour ce retour ! 🤩
Très bien présenté, merci à toi
Merci pour ton commentaire ! 😁
Top du top ! 💙Merci
Merci pour cette super vidéo, qui est devenue ma référence absolue depuis 1 semaine ! Petite question: comment tu ferais pour gérer les erreurs potentielles retournées par le back?
Hello ! Si tu souhaites gérer les erreurs retournées par ton back, tu peux utiliser l'opérateur catchError, dans lequel tu passeras uniquement s'il y a une erreur de levée dans ton observable. À partir de là tu peux faire tout ce que tu veux avec (ex: afficher un message d'erreur, ne pas mettre à jour ta recherche, etc) 😁
@@ArthurLannelucq Génial, merci beaucoup pour ta réponse!
Très bonne vidéo, très claire et bien faite !
Par contre pour moi les observables utilisés à outrance dans Angular sont une mauvaise idée. L'utiliser pour des évenements comme un utilisateur qui remplie un form pour gagner 10 lignes de code c'est juste compléxifier le code pour aucune bonne raison. Je passe de React à Angular pour le boulot et je dois apprendre toutes ces choses, mais c'est vraiment difficille d'apprendre Angular. Les devs ont tellement compléxifié la manière de faire sans bonnes raisons que rien n'est intuitif, les Promese native du JS suffise pour 99.99% des cas mais on se retrouve avec des switchMap, concatMap etc partout, et chaque valeur devient un observable.
Je pense que c'est cette compléxité inutile sur une bonne partie de la manière de coder en Angular qui rend ce framework bien moins populaire que React. (je compare le nombre de téléchargement par semaine sur npm de angular et de react, 3M vs 22M c'est énnorme)
Merci pour ton retour !
Je comprends ton ressenti, je pense que la principale difficulté avec RxJS au début c'est qu'on y est pas habitués et qu'on cherche à utiliser les Observables de la même manière qu'on travaille avec les Promise (alors qu'ils s'agit de deux concepts bien différents).
L'avantage c'est que depuis les dernière versions d'Angular, tu peux utiliser les Signals pour avoir un code qui ressemble plus à ce dont tu peux être habitué, et conserver l'utilisation d'Observables et RxJS quand tu as besoin de travailler avec de l'asynchrone ou d'appliquer des traitements plus complexes ! 😁
@@ArthurLannelucq Les concepts sont assez similaire quand même, dans les 2 cas on attend un trigger (la fin d'une action dans la quasi totalité des cas) pour continuer le code ou débuter ou nouvelle action. Je n'ai rien contre les Observables en soit, pour moi c'est juste des Promese un peu plus ou moins pratique dans certains cas. C'est juste les devs Angular qui l'utilise partout qui rende Angular aussi chian a comprendre. Je pense que si on enlève rxjs de Angular le framework serait bien plus populaire et tout aussi pratique et performant, car Angular est un bon framework au même titre que React ou Vue.
Et oui les Signals c'est génial, j'en utilise pas malheureusement mais quelle technologie incroyable ! :D
@@thomasbisson8523 Je me permets de donner mon avis , au début je pensais comme toi mais si tu prends l'exemple du combinelatest on se rend vite compte de la puissance de RXJS
On a un flux de données qui grâce à cette fonction permet de prendre en charge plusieurs éléments de champs de recherche sans avoir à gérer tous les cas de figure de combinaisons de clés de recherche.
Moi je suis fan car une fois tu que l'as fait, le code est quasi réutilisable
Avec Arthur ce qu'il y a de bien c'est qu'il a bien compris qu'on a besoin d'exemples dans le cadre de notre travail , du coup ce post illustre parfaitement la puissance de RXJS , et de ce que l'on peut retrouver en entreprise.
En dev on a souvent le défaut de croire que l'on peut se soustraire à certains concepts nouveaux car retourner à un apprentissage peut être barbant, et on se dit je vais le faire comme je sais faire .
Sauf que ces concepts éprouvés en haut lieu par des têtes pensantes comme RXJS nous tombe tout cuit, et c'est une chance.
cdlt
C'est vraiment intéressant ton tuto. J'ai juste une question, comment récupérer les erreurs pour les afficher côté front? Est ce qu'il faut appeler un subscribe dans ce cas la?
Si tu as besoin de gérer des erreurs, tu peux utiliser l’opérateur catchError dans le pipe et faire les traitements associés 😁
@@ArthurLannelucq Merci, une foi de plus super tuto
Super vidéo !
Pour les observables, si on a un system d'ajout et de modification, il faut que quand on fait une action sur les données refaire un appel a l'api a chaque fois où si je modifie la donnée dans le json observé, cela va se faire automatiquement ? Que ca soit rajouter/modifier/supprimer
Merci :)
Merci pour ton retour ! Ce comportement n’est pas lié aux observables, tu peux tout à fait faire en sorte de ne pas refaire d’appel à ton API en mettant à jour l’observable qui contient tes données 😁
C'est exactement ce qu'il me manquait, un exemple concret avec les observables. Merci beaucoup 😀!
J'ai une question, comment tu gères les fuites de mémoires avec tous ces observables?
Merci pour ton commentaire !
Effectivement , lorsque tu t’abonnes à un observable, il est également important de t’y désabonner lorsque tu cesses de vouloir écouter dessus (ex: quand ton composant est destroy), au risque d’avoir des fuites mémoires.
Pour cela tu n’as besoin de te désabonner que sur l’observable auquel tu t’es abonné (donc tu n’as rien à faire sur les observables « intermédiaires »). En plus de te permettre de simplifier les traitements, le fait de combiner tes observables te permet de limiter le nombre d’abonnements.
Pour te désabonner d’un observable, tu peux par exemple :
* Utiliser le pipe async dans le template (comme utilisé dans cette vidéo), qui te permet de déléguer l’abonnement/désabonnement à Angular
* Utiliser l’opérateur takeUntil, qui te permet d’arrêter d’écouter les valeurs émises par un observable à partir du moment où l’observable passé en paramètre de l’opérateur émet une valeur (c’est généralement utilisé en écoutant sur l’émission d’un Subject, sur lequel tu vas émettre une valeur dans le ngOnDestroy). À partir de la version 16 d’Angular, tu peux simplifier avec l’opérateur takeUntilDestroy
@@ArthurLannelucq Merci beaucoup pour ces précisions 😀! J'avais peur de devoir repasser sur tous mon code 😅. Comme j'ai utilisé async dans le template tous va bien alors^^.
Hello, serait-t-il possible d'avoir le code source via Github ou qqch de ce style ?
Hello ! Yes bien sûr, le code est disponible ici : github.com/alannelucq/angular-rxjs-tutorial 😁
Bonjour. J'aurai une question. J'utilise le pipe async pour importer une liste de tâches depuis une api. Sur la page, une ligne du tableau affiche les informations. L'autre ligne ne les affiche pas. Alors qu'il devrait bien y avoir deux lignes. Sur Swagger et Postman , L'Api fonctionne correctement. Pourrais-tu m'aider ?
Cordialement.
Hello !
Si tu rencontres ce genre d’erreur, il s’agit généralement d’une erreur lorsque tu affiches ta donnée (ex: un pipe qui tombe en erreur). D’ailleurs, même si tu affiches la première ligne, est-ce que tous tes champs sont affiches ou tu t’arrêtes à un certain moment ?
Si tu regardes la console, tu devrais également voir un message d’erreur avec plus d’informations sur le champ qui pose problème.
J’espère que ça te permettra d’avancer, tiens moi au courant 😁
@@ArthurLannelucq Bonjour. Problème résolu. Merci de ta réponse.
Merci pour ta vidéo.
Sinon le volume de tes vidéos sont en général très basse ce qui dérange un peu.
Merci pour ton retour !
Est-ce que tu constates aussi ça sur des vidéos plus récentes ? J’ai changé de micro au bout de quelques vidéos, le son est de meilleure qualité depuis 😁
le lien github est different de ce que tu as en video c dommage sinoon super video , perso les signals pour le moment ca ne m'interesse pas .
Effectivement, j’ai mis à jour le code sur le GitHub dans une autre vidéo (sur l’utilisation des Observables avec des Signals) 😅
J’espère que tu as quand même réussi à suivre la vidéo !
@@ArthurLannelucq merci poir ta réponse j'adore ce que tu fais tu es de loin le meilleur sur Angular. Pense tu faire une vidéo mais cette fois ci avec un CRUD et sans signal ?
Merci pour ton retour, content que mes vidéos te soient utiles ! 🤩
Si tu ne l’as pas déjà vue, j’ai déjà publié une vidéo qui devrait correspondre à ce que tu recherches : czcams.com/video/zSC5Qwso304/video.html 😁
@@ArthurLannelucq 👍👍🤯🤯
Le Graal 😂😂
pas clair du tout
Quels sont les points qui ne te semblent pas clair ? Histoire de pouvoir les prendre en compte pour les futures vidéos 😉