Create a YouTube sidebar clone with Angular Material Components! (Part 1)

Sdílet
Vložit
  • čas přidán 25. 08. 2024
  • #Angular #Sidebar #Collapse
    Get the final code from my shop!
    www.buymeacoff...
    📽️ Full stack Angular + Firebase course (50% off):
    www.udemy.com/...
    ✍️Blog version of the complete tutorial:
    zoaibkhan.com/...
    In this series of videos, I'll be showing you how to create a CZcams sidebar clone using Angular Material Components!
    Follow for more Angular tutorials, tips and tricks:
    Twitter - / zoaibdev
    Facebook - / thisiszoaib
    LinkedIn - / zoaib-khan-b6456815
    Cheers :)

Komentáře • 48

  • @TheZukkino
    @TheZukkino Před 10 měsíci +1

    Incredibly clear and straightforward as always.

    • @ZoaibKhan
      @ZoaibKhan  Před 10 měsíci

      Thanks 🙏 Glad you found it clear to follow!

  • @BlackbirdStudiosBXL
    @BlackbirdStudiosBXL Před 2 měsíci

    Brilliant. I had no idea how to implement this will try today to get this woeking in our project. Thank you so much!!!

    • @ZoaibKhan
      @ZoaibKhan  Před 2 měsíci +1

      Also check out my recent followup to this - where I add the nested menu items functionality as well
      czcams.com/video/u83tICIfLWc/video.html

    • @BlackbirdStudiosBXL
      @BlackbirdStudiosBXL Před 2 měsíci

      What other tricks do you have up your sleeve im hooked. ​@@ZoaibKhan

    • @BlackbirdStudiosBXL
      @BlackbirdStudiosBXL Před 2 měsíci

      Will this work in Angular 17 and 18 probably right? You are using standalone components

    • @ZoaibKhan
      @ZoaibKhan  Před 2 měsíci

      @@BlackbirdStudiosBXL yes, the nested one esp was made in v18

  • @BlackbirdStudiosBXL
    @BlackbirdStudiosBXL Před 2 měsíci

    Thank you so much for this. Exactly what i need.

  • @user-fy8pl4sf4h
    @user-fy8pl4sf4h Před 3 měsíci

    Thank you, teacher, for these projects. Please publish more for beginners

    • @ZoaibKhan
      @ZoaibKhan  Před 3 měsíci +1

      You're welcome! Which projects will you be interested in? :)

    • @user-fy8pl4sf4h
      @user-fy8pl4sf4h Před 3 měsíci

      @@ZoaibKhan In any project

    • @user-fy8pl4sf4h
      @user-fy8pl4sf4h Před 3 měsíci

      @@ZoaibKhan project of admin dashboard & login form with validators & project to advanced

  • @hoangtoan9836
    @hoangtoan9836 Před 10 měsíci +1

    Hope Part 2 soon !!!!

    • @ZoaibKhan
      @ZoaibKhan  Před 10 měsíci

      Here you go: czcams.com/video/Sq5tdKKBz7Q/video.html

  • @mohamedbirali803
    @mohamedbirali803 Před 10 měsíci

    Keep going, lots of projects need a side bar 👍, we appreciate your time*

  • @Labiqakhan
    @Labiqakhan Před měsícem

    Thankyou.

  • @axitpoojara
    @axitpoojara Před 5 měsíci

    great explanation thanks a lot

    • @ZoaibKhan
      @ZoaibKhan  Před 5 měsíci

      You're welcome! Do like and subscribe so the video reaches more people 🙂

  • @ianvink
    @ianvink Před měsícem +1

    I bought the BuyMeCoffee full project and it works great. How do I add a 3rd level to the menu, 2 isn't enough

    • @ZoaibKhan
      @ZoaibKhan  Před 29 dny +1

      Glad you liked it! The way to add the third level is the same as the second level, but added nesting. Or we could use recursion for it to enable even more levels. Let me look at the code a bit and get back to you :)

    • @ianvink
      @ianvink Před 29 dny

      @@ZoaibKhan I’m happy to buy the next version too

    • @ZoaibKhan
      @ZoaibKhan  Před 29 dny

      No need for that. I'll send out the updated one for all those who have already bought it - when I get to update it :)

    • @ZoaibKhan
      @ZoaibKhan  Před 25 dny

      And here you go - support for multiple infinite levels added! Also, hope you don't min me mentioning you a bit in the video
      czcams.com/video/Irf4aZC3LPY/video.html
      P.S If you've not received the updated version, let me know. I'll send you a free coupon for it :)

  • @jamesquinlan2638
    @jamesquinlan2638 Před 5 měsíci

    Great stuff boss!

  • @TheAlejandro1094
    @TheAlejandro1094 Před 6 měsíci

    Awesome! Thanks so much !

  • @mahdiandalib186
    @mahdiandalib186 Před 10 měsíci

    nice man, i hope you implement youtube comment section(recursive) and also youtube scrollable slider tabs where there are two arrows on the left and right section and the suggestion tabs are in between and you could slide ....

    • @ZoaibKhan
      @ZoaibKhan  Před 10 měsíci

      Thanks man! Very helpful suggestions. Have noted them

    • @mahdiandalib186
      @mahdiandalib186 Před 10 měsíci

      thx, waiting for you to teach us@@ZoaibKhan 😍

  • @juniorngomajose9454
    @juniorngomajose9454 Před 3 měsíci

    Thank You

  • @ersispahia
    @ersispahia Před 6 měsíci

    do you have a tutorial for the whole youtube clone?

    • @ZoaibKhan
      @ZoaibKhan  Před 6 měsíci

      No, not yet anyway :) but good idea 💡

  • @franciscofdez8334
    @franciscofdez8334 Před 10 měsíci

    It would be incredible if you do a search bar google-like using angular material components❤

    • @ZoaibKhan
      @ZoaibKhan  Před 10 měsíci

      You mean the Google search input field?

    • @franciscofdez8334
      @franciscofdez8334 Před 10 měsíci

      @@ZoaibKhanyes, exactly including matAutocomplete attached to that input

  • @ysacpebes1462
    @ysacpebes1462 Před 10 měsíci

    hermoso!!!! part 2 👏🙏😊

    • @ZoaibKhan
      @ZoaibKhan  Před 10 měsíci +1

      Thank you :) Part 2 is coming soon! Please subscribe so you can get notified

  • @user-ld1pe4or8m
    @user-ld1pe4or8m Před 7 měsíci

    I don't konw if you missed something, when I click the menu button the sidenave dose NOT collapsed

    • @ZoaibKhan
      @ZoaibKhan  Před 7 měsíci

      Check the second part!

    • @user-ld1pe4or8m
      @user-ld1pe4or8m Před 7 měsíci +1

      thanks I checked with part2, and it works. good job @@ZoaibKhan 👍

    • @ZoaibKhan
      @ZoaibKhan  Před 7 měsíci +1

      @@user-ld1pe4or8m Glad you found it useful :)

  • @poojaagrawal4514
    @poojaagrawal4514 Před 5 měsíci

    shandar

  • @hagarmosleh5910
    @hagarmosleh5910 Před 6 měsíci

    What if i want to make the user change the picture?

    • @ZoaibKhan
      @ZoaibKhan  Před 6 měsíci

      You can change the pic src to a URL you get from your backend for the user. That depends on your backend server or platform such as firebase.
      Then, you can allow clicking the pic and take user to a profile page which has an upload button