Build Generalized DRY Angular Code with Generics

แชร์
ฝัง
  • เผยแพร่เมื่อ 15 ต.ค. 2024

ความคิดเห็น • 138

  • @roman6504
    @roman6504 3 หลายเดือนก่อน +5

    I consider myself very lucky that I accidentally saw it in the recommendations for your channel, Deborah. Thank you very much

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      I am too! Thanks for watching!

  • @gasparsantillan5357
    @gasparsantillan5357 3 หลายเดือนก่อน +6

    Signals + Typescript tricks? We needed this!!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Glad to hear that! Thanks!

  • @HoNow222
    @HoNow222 3 หลายเดือนก่อน +10

    PLEASE more videos about Generics and Signals! 😍

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Great idea! Thanks!

  • @theintjengineer
    @theintjengineer 2 หลายเดือนก่อน +1

    Came for Angular and stayed for the TypeScript gold lessons/hints🤷🏾‍♂️.
    Thank you🫶. Love you❤.

    • @deborah_kurata
      @deborah_kurata  2 หลายเดือนก่อน +1

      So great to hear that the videos are useful! Thank you!

  • @dinysanchez
    @dinysanchez 3 หลายเดือนก่อน +38

    Please continue creating this amazing content! It's hard to find advanced Angular content elsewhere. As always, Thank you!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +2

      Glad to hear it's useful. Thank you!

  • @yonester7
    @yonester7 16 วันที่ผ่านมา

    This is one of those things I've seen around a bunch but never really understood thoroughly enough to use. Your explanation cleared this up perfectly for me. Thank you so much for all these videos, they're immensely helpful. I think I'll make this required training for my team :)

    • @deborah_kurata
      @deborah_kurata  วันที่ผ่านมา

      That's wonderful to hear. Thank you!

  • @ArchitecturalAesthetics2046
    @ArchitecturalAesthetics2046 2 หลายเดือนก่อน

    so informative. never even heard of `extends keyof` operator. thank you Deborah.

    • @deborah_kurata
      @deborah_kurata  หลายเดือนก่อน

      So glad to hear it was useful! Thank you for watching!

  • @julienr8114
    @julienr8114 3 หลายเดือนก่อน +1

    Best TH-cam Content for Angular. Thks a lot Deborah.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Wow, thank you! 😊

  • @ajaykarwal
    @ajaykarwal 13 วันที่ผ่านมา

    Brain explode gif is about right.
    Might have to watch this again an delve deeper but that was very informative and something worth trying to grasp

    • @deborah_kurata
      @deborah_kurata  วันที่ผ่านมา

      Glad to hear that it was interesting and informative. All the best!

  • @kettenbach
    @kettenbach 3 หลายเดือนก่อน +4

    Always love your content Deborah. Been a fan for many many years. You're my goto source for the latest Angular features. Things are clear and concise and easy to digest. Thank you! 🙏

    • @richarddefortune1329
      @richarddefortune1329 3 หลายเดือนก่อน +3

      I learned angular by watching Deborah's courses on Pluralsight. She's the best.

    • @kettenbach
      @kettenbach 3 หลายเดือนก่อน

      @@richarddefortune1329 same. Learned Rxjs too

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Wow, thank you! 😊

  • @RsPippen
    @RsPippen 3 หลายเดือนก่อน +1

    Amazing as always! I would love to see a video on unit testing best practices in Angular when using a declarative approach. I always get stuck and usually have to revert my code back to an imperative style

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Thank you!
      Yes! I had been putting off doing any testing content because the testing libraries Angular supports has changed (Karma, Jasmine, Jest, ngMocks, cypress, Playwright. But maybe it's time to get back to that!
      In the mean time, this could be helpful: angular.dev/guide/testing/services

  • @MrPankoPanko
    @MrPankoPanko 3 หลายเดือนก่อน +1

    I am impressed. Really good quality video! Looking for more angular tutorials!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Thank you so much! 😊
      You can find my Angular playlists here: th-cam.com/play/PLErOmyzRKOCrzJ9zUEGgC1zVzVGt3hMmV.html
      And here: th-cam.com/play/PLErOmyzRKOCr07Kcnx75Aqh6PWSbIokPB.html

  • @07bakabaka
    @07bakabaka 9 วันที่ผ่านมา

    Amazing , hero of angular beginners!!!

  • @jackiecooper9439
    @jackiecooper9439 3 หลายเดือนก่อน +1

    Deborah , you are the best!
    No comparison.
    Waiting for your Angular 18 Getting Started course🤗

  • @EnriqueMartinezInter
    @EnriqueMartinezInter 26 วันที่ผ่านมา

    This content is simply...AMAZING!!

  • @selektahx
    @selektahx 3 หลายเดือนก่อน

    Your content is amazing. Please continue to share your knowledge. You are great!

  • @joeyvico
    @joeyvico 3 หลายเดือนก่อน

    Love these advanced / expert tutorials on both Angular and Typescript. Thanks Deborah

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Glad it was helpful! Thanks!

  • @osamaabozahra
    @osamaabozahra 3 หลายเดือนก่อน

    Thank you for the fantastic video, Deborah.
    I was opening the video saying to myself what is going to be new in generics, I already know them 😅
    Then I learnt "K extends keyof T" and it was mind blowing moment.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Yay! It's so great to hear that the video was useful! Thanks!

  • @rolygonz1964
    @rolygonz1964 3 หลายเดือนก่อน

    You are the best . Please continue creating this amazing content. Thank you !

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      That's kind of you to say. Thank you!

  • @lacerdae
    @lacerdae 3 หลายเดือนก่อน

    Ma'am, you are the best! So much I have learned with your Angular content. Keep it up

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      That's great to hear. Thank you! 😊

  • @ranjan4elex
    @ranjan4elex 3 หลายเดือนก่อน

    Awesome content as always.. love the way you explain complex concepts in very easy to understand way, Thank you!!!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you so much for the kind words! 😊

  • @MarcoPinheiro
    @MarcoPinheiro 3 หลายเดือนก่อน

    This is pure gold Deborah, thanks for this awesome resource!!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Great to hear. Thank you!

  • @richarddefortune1329
    @richarddefortune1329 3 หลายเดือนก่อน

    Thanks so much for this video. You present typescript better than their own website.

  • @mohitpandey2388
    @mohitpandey2388 3 หลายเดือนก่อน

    What an amazing & knowledgeable video. Keep up the good work❤️

  • @en818
    @en818 3 หลายเดือนก่อน

    You explained things so well 🙌

  • @stevewitman
    @stevewitman 3 หลายเดือนก่อน

    AWESOME video Deborah! My knowledge and ability to use generics is only that I know they exist.
    I have this video on my list to revisit this weekend, to type out and explain out loud several times until I can reproduce this all on my own. Thanks!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you! Let me know if you have any questions. Have fun!
      (I have the link to my stackblitz in the video notes if you want the code I used.)

  • @ChessPuzzlesVideo
    @ChessPuzzlesVideo 3 หลายเดือนก่อน +1

    Another great content in a simple language 👍. Can you also make video on SOLID design principle (in angular)

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you! And great idea! I'll add it to the list. 😊

  • @positivenegativ
    @positivenegativ 3 หลายเดือนก่อน

    I simply cannot thank you enough

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      So happy to hear that it was useful! Thank you!

  • @pazzuto
    @pazzuto 3 หลายเดือนก่อน

    Great content! Generics seem easy at first, but can get pretty crazy quick. I remember when they were first introduced in C# back in early 2000 (I think) - It was an interesting concept to grasp, but I can't imagine coding without it now. When it comes to TypeScrpt, it kinda feels the same as back ~2000, the syntax can really give you a headache, but it's definitely worth using it.
    Thank you for a great explanation!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you! And yep!
      This topic is definitely more straightforward for those coming to Angular with a .NET background! For many that come to Angular from HTML or vanilla JavaScript, generics are completely new. I'm sure it must be a big mental shift to "think generically". 😊

  • @denberghvanmartijn
    @denberghvanmartijn 3 หลายเดือนก่อน

    This is awesome! would also love a video about best practices in terms of project and folder structure.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Thanks! Great idea!

  • @BJAnderson
    @BJAnderson 3 หลายเดือนก่อน

    Amazing explanation. I understand generics, but wanted to see your take on them. Went from too easy to brain melting in 15 minutes, and all while keeping it clear and understandable. Great job :)

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Now I have that image from "Raiders of the Lost Ark" in my head. LOL!
      Thank you so much for the kind words! 😊

  • @janis666
    @janis666 3 หลายเดือนก่อน

    very informative! always enjoying to watch your tutorials. thanks!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      That's kind of you to say. Thank you!

  • @lijiklevi827
    @lijiklevi827 หลายเดือนก่อน

    Great content & explanation, Thank you❤

  • @valikonen
    @valikonen 3 หลายเดือนก่อน +1

    Fantastic example! Let me give you an example: I have a http req. and the response from the backend it's very different from what I must use in front and I created two interfaces, one from the response from the backend and one for UI after I map the values. Can I use a generic in that case? One option it's to use a map operator in pipe...Thank you for your great content!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Thank you!
      This is how I've done it (as you said, with 'map'), where ProductFromAPI is one interface and Product is the other:
      productsFromAPI$ = this.http.get('api/productsFromAPI')
      .pipe(
      map(products => products.map(product => ({
      id: product.p_id,
      productName: product.p_nam,
      productCode: product.p_cd,
      description: product.p_des,
      categoryId: product.p_c_fk_id,
      price: product.p_p * 1.5
      }) as Product)),
      catchError(this.handleError)
      );
      My first thought is that you wouldn't be able to do something like this with generics because each object would require specific mapping. Unless the mappings for your different object types are very generalized, generics won't be able to help much.

  • @enverusta7811
    @enverusta7811 3 หลายเดือนก่อน

    Awesome content! I was just tackling these kind of things on my projects. Awesome coinsidence.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Perfect! Great to hear the info will be useful! Thanks!

  • @_perfectCTO
    @_perfectCTO 3 หลายเดือนก่อน

    The community owes you big time, Deborah. I hope you never lack the energy to keep going for a long, long time. Just curious, how do you dive into and explore these sometimes new other times advanced concepts? How much trial and error does it involve, or do you have specific places to look beyond documentation?

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      That's very kind of you to say.
      I came from Visual Basic -> C# -> JavaScript -> TypeScript, so many of these concepts (like Generics) I already knew from my VB.NET/C# days. I do spent quite a bit of time experimenting, to see how to actually *use* the techniques in an Angular app. Having a specific purpose makes it easier to explain and apply that technique. Then a good amount of googling to ensure I haven't missed or misunderstood something. 😊

  • @dougl765
    @dougl765 3 หลายเดือนก่อน

    You're the best! Thank-you so much for you skills!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      That is kind of you. Thanks!

  • @PanDaNWS
    @PanDaNWS 3 หลายเดือนก่อน

    Love your video, it helps me improve my coding better.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Great to hear! Thank you!

  • @DraaElMizan
    @DraaElMizan 3 หลายเดือนก่อน

    Amazing, thanks Deborah.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Thanks for listening! 😊

  • @KiffinGish
    @KiffinGish 3 หลายเดือนก่อน

    Nicely done again!

  • @EmilioDegiovanni
    @EmilioDegiovanni 3 หลายเดือนก่อน

    Excellent video Deborah!

  • @Nabulio85
    @Nabulio85 3 หลายเดือนก่อน

    ❤ for you
    ❤️ for your content
    😊
    Thank you again.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      That is very kind. Thank you! 🧡

  • @andsons159
    @andsons159 3 หลายเดือนก่อน

    My all time teacher,

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      That is kind of you to say. Thank you!

  • @rippan23452
    @rippan23452 3 หลายเดือนก่อน

    Great video as always! Very elegant, I wonder if it’s possible to make the generic update function to set multiple props?

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you!
      TypeScript has variadic tuple types that support a generic spread operator. More information here: www.typescriptlang.org/docs/handbook/release-notes/typescript-4-0.html#variadic-tuple-types. You could possibly use something like that to take in any number of properties/values. (I haven't had the need for something like this, so don't have an example for you. Maybe a future video? 😄)
      Or maybe more straightforward, use a key/value pair to pass in property/values as an array?

  • @joepersonbelgica3980
    @joepersonbelgica3980 3 หลายเดือนก่อน

    Very helpful. Thanks

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Glad it was helpful! Thank you! 😊

  • @cathyf5449
    @cathyf5449 3 หลายเดือนก่อน

    Awesome video as always. Thanks!😄

  • @nope7843
    @nope7843 3 หลายเดือนก่อน

    Awesome as always thanks for sharing it with us 🙏

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน +1

      Great to hear. Thank you!

  • @codewithmenow1412
    @codewithmenow1412 3 หลายเดือนก่อน

    WOW Amazing as usual 🤩

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you so much 😀

  • @araujomartin
    @araujomartin 3 หลายเดือนก่อน

    Very usefull! Excellent video

  • @houseofgames6099
    @houseofgames6099 3 หลายเดือนก่อน

    Hello I have completed your couple of courses on plurasight.. really loved it.. I mean I was lucky to find you as an instructor for Angular courses.. Could you please do a course on Javascript please. not basic Js language but more of a little above begineer to super Advanced concepts and beauty of js language. So if anyone ask me any advanced/tricky concepts of js I should be able to solve it. More like book series "You don't know Js".. Please!!!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you so much! 😊
      I did a JavaScript course here on TH-cam. Here's the playlist: th-cam.com/play/PLErOmyzRKOCpmitTOazq3_p74Y-yTQB6A.html
      I also have a general "JavaScript Topics" playlist you can find here: th-cam.com/play/PLErOmyzRKOCqpYd2OvTxg74DUj9McAjbL.html
      This playlist includes a video on immutability and several lesser known array methods.
      You could check out those videos and see if I cover anything more "advanced beginner" that would be useful for you.
      Are there any other specific JS topics you'd be interested in?

  • @daringuL
    @daringuL 10 วันที่ผ่านมา

    Very nice tutorial❤

  • @AlexLikeGolf
    @AlexLikeGolf 3 หลายเดือนก่อน

    You just taught Typescript Generic in 15 minutes. Can you create a deep-dive Angular Getting Started with your narration style? I enjoyed your Pluralsight videos, but I no longer have access to them.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you for watching!
      I have been considering doing some type of "Getting Started" content here. But I haven't quite figured out what that would look like in a TH-cam environment. Maybe a set of build-along videos? Thanks for the suggestion.

  • @syedmohammadnejat
    @syedmohammadnejat 3 หลายเดือนก่อน

    As Always Perfect Video :P

  • @vd2828
    @vd2828 3 หลายเดือนก่อน

    Amazing video, Thank you so much. Could you please consider about a video demonstrating how to generically pass input values from a parent component to child component?

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thanks!
      Could you elaborate on your suggestion? What's the scenario?
      The new input doesn't require a type, so it's already somewhat generalized: employee = input(); The parent component can pass anything.
      The child can *require* a type using something like this: employee = input();
      And you can do something like this:
      export class FilterComponent {
      someArray = input.required();
      }
      Is that what you are picturing?

    • @vd2828
      @vd2828 3 หลายเดือนก่อน +1

      Hi @@deborah_kurata, Thank you for your reply.
      export class FilterComponent {
      someArray = input.required();
      }
      The class component with the type was what I looking for. We don't need to declare the type of any for the input variable, then we can call the generic function. This is great.

  • @rkumar.lnct24
    @rkumar.lnct24 3 หลายเดือนก่อน

    Awesome explanation 🎉

  • @zaferdemir4680
    @zaferdemir4680 3 หลายเดือนก่อน

    Super. Thanks

  • @epoppy
    @epoppy 3 หลายเดือนก่อน

    this is awesome 🎉

  • @hamadykais9318
    @hamadykais9318 3 หลายเดือนก่อน

    Powerful!!

  • @DejanFilipov-gv8qz
    @DejanFilipov-gv8qz 2 หลายเดือนก่อน

    Teacher 💜

  • @mibi2007
    @mibi2007 3 หลายเดือนก่อน

    thanks 😊

  • @martinflores9611
    @martinflores9611 หลายเดือนก่อน

    wow very good video

  • @Ali-cx7sy
    @Ali-cx7sy 3 หลายเดือนก่อน

    Please about SOLID in Angular

  • @matheusluz2318
    @matheusluz2318 3 หลายเดือนก่อน

    hi there! love your videos! if you can, please make a sequel about subscribe vs toSignal and async pipe (as mentioned in the video: Use takeUntilDestroyed to Unsubscribe from Angular's Observables 10:17)

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Thank you so much! Great suggestion! I'll add it to my list.

  • @Ali-cx7sy
    @Ali-cx7sy 3 หลายเดือนก่อน

    Bilbo, Frodo, Drogo!

  • @kyawswarthwin6451
    @kyawswarthwin6451 27 วันที่ผ่านมา

    🎉🎉🎉

  • @miloszivkovic6607
    @miloszivkovic6607 3 หลายเดือนก่อน

    I love you.

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      I assume you mean you love my content. 😊 Thank you!

    • @miloszivkovic6607
      @miloszivkovic6607 3 หลายเดือนก่อน

      @@deborah_kurata Content is amazing. And the content creator as you is a good human being who is spreading his knowledge to society... If 10M+ people can express love to music, movie stars and other entertainment content, why shouldn't I do the same for someone like yourself? Nothing personal, but this is entertainment for me, so i wanted to express it, exactly like I did, because you are a Rock Star!
      ( with a pretty nice and calming voice :D ).
      Joke aside. As a human to another human, thank you! Keep up with good and honorable work, we need you!

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      That is so very kind of you to say! Thank you! 😊💖

  • @dragonstore6308
    @dragonstore6308 28 วันที่ผ่านมา +1

    To be honest, I think you're forcing the principles and making the code harder to read.

    • @deborah_kurata
      @deborah_kurata  วันที่ผ่านมา +1

      These techniques are not for everyone and not for every project. They are definitely aimed at larger teams that are trying to build generic reusable code for use in multiple parts of an application, or even multiple applications.
      It's way overkill for straightforward, standard applications.

  • @bibbychung
    @bibbychung 3 หลายเดือนก่อน

    It's so hard ^^|||..

    • @deborah_kurata
      @deborah_kurata  3 หลายเดือนก่อน

      Is there anything I can clarify?