Angular Routing | LazyLoading | AuthGuard | multiple router-outlet | all in one video

Поделиться
HTML-код
  • Опубликовано: 23 июл 2021
  • In this video you will learn all about angular routing so that you can start building your dream project soon.
    Source code Link: github.com/Tariqu/routing
    =============================================
    For any Business/Freelancing enquiry contact us
    Gmail :- tarique.rkl@gmail.com
    WhatsApp :- +917978073704
    =============================================
    ng-bootstrap link : ng-bootstrap.github.io/#/home
    Angular-FortAwesome Link : github.com/FortAwesome/angula...
    Generate an application with routing enabled
    ng new angular-routing --routing
    The following command uses the Angular CLI to generate a basic Angular application with an application routing module, called AppRoutingModule, which is an NgModule where you can configure your routes. The application name in the following example is angular-routing.
    Add components for routing
    ng generate component login
    To use the Angular router, an application needs to have at least two components so that it can navigate from one to the other. To create a component using the CLI, enter the following at the command line where login is the name of your component
    Repeat this step for a second component but give it a different name. Here, the new name is forgot-password.
    ng generate component forgot-password
    again for not-found
    ng generate component not-found
    Defining a basic route
    we first define all the basic route using routerLink for login, forgot-password,
    then
    Setting up wildcard routes
    { path: '**', component: }
    if user type or try to go to a path which is not present in the application then we will redirect the user to page-not found component
    Lazy loading
    You can configure your routes to lazy load modules, which means that Angular only loads modules as needed, rather than loading all modules when the application launches. Additionally, you can preload parts of your application in the background to improve the user experience.
    Preventing unauthorized access
    Use route guards to prevent users from navigating to parts of an application without authorization. The following route guards are available in Angular:
    ---- CanActivate
    ```
    export class YourGuard implements CanActivate {
    canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {
    // your logic goes here
    }
    }
    ```
    watch this video till the very end manything you will learn about a real world project

Комментарии • 174

  • @user-sr4nk3fk7p
    @user-sr4nk3fk7p 17 дней назад +1

    In half an hour u have done a smart work bro... Thanks a lot

  • @gandamraviteja7019
    @gandamraviteja7019 9 дней назад

    Thank you so much for ur work just with 30 mins you cleared several problems in my mind and you made my work more n more simpler
    thanks is really very tiny for ur work

  • @rakhipramanik2439
    @rakhipramanik2439 2 года назад +27

    I would like to tell all the beginners, you have to follow this it's really Amazing you have to watch this till end.

    • @TechnicalBabaji1
      @TechnicalBabaji1  2 года назад +4

      Thank you so much 😊 I really appreciate

    • @uditbalyan
      @uditbalyan 2 года назад +4

      Yeah. Its the most appropriate tutorial in proper quick time. 👏👏

  • @vinaymahadevan2161
    @vinaymahadevan2161 2 года назад +1

    Thanks. You saved 3 days of web searching with simple very clear video.

  • @prodbyovie6481
    @prodbyovie6481 11 месяцев назад +1

    Best Angular tutorial i have watched so far...Love it!!

  • @pavanbhat5573
    @pavanbhat5573 2 года назад +8

    Amazing video. Though this was a 30 minutes video, the content covered was actually much! Angular is awesome and please create more projects as this one. Thank you so much

  • @KhushiParihar_Youtube_Channel
    @KhushiParihar_Youtube_Channel 2 года назад

    Very helpful for Begginers . Great Quick start.

  • @joaocorreiafreitas712
    @joaocorreiafreitas712 2 года назад +1

    @TB thanks for this great Vídeo..short but provide very clear logic in routing management. Cheers

  • @user-ky1yj7gy7u
    @user-ky1yj7gy7u 4 месяца назад +1

    very good video with simple explanation

  • @suryaguthula6531
    @suryaguthula6531 2 года назад

    Excellent simple sharp and clear ThanksBro for your efforts.

  • @DebasmitSamal294
    @DebasmitSamal294 2 года назад +1

    Excellent... awesome. Very nice video which covers great thing for Angular developers. You made my day brother.

  • @vaibhavtripathi200
    @vaibhavtripathi200 2 года назад +1

    You are one of the finest content creator. Great work...

  • @namanjain2449
    @namanjain2449 2 года назад +1

    Hi Tarique,
    Very usefull and informative tutorial.
    Thank you🙏

  • @hackerhunter6212
    @hackerhunter6212 2 года назад +1

    Yes, you are talented. there are lot more theories in this video about angular we cannot found in months

  • @saoudiwalid
    @saoudiwalid 2 года назад

    The best video out there addressing Angular routing, 30 mins full of information, Great Job Tarik and Keep it Up

  • @ehrazahmed8190
    @ehrazahmed8190 Год назад +1

    This cleared all my concepts for routing using angular

  • @neethuananthu5477
    @neethuananthu5477 2 года назад +1

    Very Informative video, thank you

  • @joeyvico
    @joeyvico Год назад

    A fantastic video! Thank you for your efforts

  • @simranmishra3776
    @simranmishra3776 Год назад

    Awesome video. Thankyou

  • @atifsaeedkhan9207
    @atifsaeedkhan9207 Год назад

    Excellent nd to the point with details. Thanks.

  • @akash4952
    @akash4952 2 года назад +2

    great content loved it

  • @raghibhussain1375
    @raghibhussain1375 Год назад

    this one is awesome, in very less time, described whole routing

  • @tharunnair8344
    @tharunnair8344 Год назад

    Fantastic!!!..Many Thanks

  • @ManishSharma-jz2hw
    @ManishSharma-jz2hw 2 года назад +1

    Awesome.. Appreciate your efforts.

  • @maheshmhamane893
    @maheshmhamane893 2 года назад

    great tutorial every thing is here in
    simple way

  • @ninjatechstudio
    @ninjatechstudio 2 года назад

    I need this video. Awesome Explained 👍

  • @jayantiroy1476
    @jayantiroy1476 2 года назад

    Thanks a lot, Bahut kuch samaj meh aaya .

  • @priyankabhasakhetre3099
    @priyankabhasakhetre3099 2 года назад +1

    Very well explained it's very useful 😀

  • @vietanho5262
    @vietanho5262 Год назад

    That's awsome video

  • @rizwanshah6634
    @rizwanshah6634 2 года назад

    great work brother, easy to understand
    keep it up

  • @revtikale2546
    @revtikale2546 7 месяцев назад

    awesome work!!!!!

  • @enamulhaque1338
    @enamulhaque1338 Год назад

    Awesome... You have cleared all concepts

  • @saumyaneekhara6000
    @saumyaneekhara6000 2 года назад +1

    Thanks for the help and amazing channel

  • @uttamnandi124
    @uttamnandi124 Год назад

    Thanks for such an excellent tutorial.

  • @QuotesAibyYatin
    @QuotesAibyYatin Год назад

    one of the best video for beginners !! thank you soo much bro

  • @iamzb3006
    @iamzb3006 2 года назад +1

    Thank you brother, for your efforts.

  • @sandeepsethy8943
    @sandeepsethy8943 Год назад

    Very informative and on point. keep up the good work brother.

  • @price-action-trading
    @price-action-trading 11 месяцев назад

    Awesome... Thank you very much

  • @Viswanadhc
    @Viswanadhc 2 года назад

    Best Way of explanation.

  • @Hacon30
    @Hacon30 Год назад

    Beautiful tutorial boss!!! Well done!!!

  • @dev.maazqureshi
    @dev.maazqureshi Год назад

    clear and concise,..thanks!

  • @hemantsingh2962
    @hemantsingh2962 2 года назад

    This video cleared my my routing doubts thanks

  • @engincelik7740
    @engincelik7740 Год назад

    Very useful video . Thanks

  • @charvisarang4803
    @charvisarang4803 Год назад

    This video is amazing to learn, thank u so much sir

  • @imyuvraj29
    @imyuvraj29 2 года назад +6

    Awesome... Most recomended video guys.
    This is one of the best Angular router videos till now.
    I had lots of doubts about routing before but after this video, I have to say you won my heart.
    Thank you so much for this video. I really appreciate the efforts.. A Big Like from my side and subscribe button hit.
    I hope we will get such videos in the future.

  • @MohitChauhan-ve9jw
    @MohitChauhan-ve9jw Год назад

    really superb

  • @rainaveed438
    @rainaveed438 Год назад

    Really very helpful

  • @sss3421
    @sss3421 2 года назад

    Hi your explanation is very very nice. this is very very useful video

  • @karamjitsinghsehdev3451
    @karamjitsinghsehdev3451 2 года назад

    Nice Video Tarik.

  • @ashfannm7674
    @ashfannm7674 2 года назад +1

    Thank you very much sir. very helpful

  • @ramanbhardwaj6855
    @ramanbhardwaj6855 2 года назад

    thank you sir it help me a lot understanding the basic root and structure of an angular application

  • @jptechnoservice9013
    @jptechnoservice9013 2 года назад

    Nice video

  • @supersid-qt1mn
    @supersid-qt1mn 18 дней назад

    Awesome buddy ❤❤

  • @ayush_patel534
    @ayush_patel534 2 года назад

    Thanks for this information 👍😊

  • @priyanshusingh7812
    @priyanshusingh7812 2 года назад

    fantastic as always !!!

  • @abhishekdutt1019
    @abhishekdutt1019 2 года назад

    appericable very nice dude

  • @Anuj_Kumar_1
    @Anuj_Kumar_1 2 года назад

    thanks for this router video.....😊

  • @danpride2804
    @danpride2804 Год назад

    Very well Done ! Thanks

  • @mosharofhossen9680
    @mosharofhossen9680 Год назад

    really very good tutorial. thank you so mush brother.

  • @Viswanadhc
    @Viswanadhc 2 года назад +1

    Really Hatsoff Bro

  • @alexandrasimbolon3002
    @alexandrasimbolon3002 2 года назад

    wow amazing tutorial sir

  • @sanmitsarkar2382
    @sanmitsarkar2382 Год назад

    Very helpful

  • @kisshore3853
    @kisshore3853 7 месяцев назад

    Good tutorial and Explanation! thanks for the effort!! ❣

  • @bazirakeeric7244
    @bazirakeeric7244 2 года назад

    wao! a good video , it helps me at least

  • @nouchance
    @nouchance 10 месяцев назад

    Amazing SIR!

  • @poojapoojitha9114
    @poojapoojitha9114 2 года назад

    Thank you so much for the video

  • @indrajiths4826
    @indrajiths4826 2 года назад

    Asome bro .. 👍

  • @aaroncampos8948
    @aaroncampos8948 2 года назад +1

    Thank you so much, you help me a lot

  • @CodeCatalyst
    @CodeCatalyst 2 года назад

    amazing explanation

  • @thakurjaswantsingh148
    @thakurjaswantsingh148 2 года назад

    best tutorial on angular rroutinng

  • @simran-3181
    @simran-3181 2 года назад +1

    Best explanation

  • @pratikparmar346
    @pratikparmar346 2 года назад

    Nice tutorial ....

  • @Amit-jb5xt
    @Amit-jb5xt 2 года назад

    Thank you sir after this
    I've created user role and given path
    Sored role in session
    And role based routing I've done

  • @rajeshkumarramachandran6883
    @rajeshkumarramachandran6883 9 месяцев назад +1

    Perfect demo

  • @gowtham4383
    @gowtham4383 Год назад

    Thanks a lot 👍

  • @hariharan8986
    @hariharan8986 2 года назад +1

    Very easy to understand. Awesome work man!! can you please create a video for state management using ngrx

  • @gouthamshiv2543
    @gouthamshiv2543 2 года назад

    instant like and subscribe
    amazing content!!

  • @abdulrenishr
    @abdulrenishr 8 месяцев назад

    Awesome bro

  • @rohitkamble4769
    @rohitkamble4769 Год назад

    Thanks brother!

  • @rajeevprajapati5083
    @rajeevprajapati5083 2 года назад

    eye opener

  • @shamavlogsnepal
    @shamavlogsnepal 2 года назад

    Very easy to understand

  • @vijbca
    @vijbca 8 месяцев назад

    Best video

  • @ram_2211
    @ram_2211 2 года назад

    Thanks a lot

  • @ashutoshbisoyi8074
    @ashutoshbisoyi8074 Год назад

    thanks. this helped

  • @hmzza1
    @hmzza1 2 года назад

    Great

  • @surajkumarshukla681
    @surajkumarshukla681 2 года назад

    Really great video, please make video about authentication and user management.

  • @chrisventer6490
    @chrisventer6490 2 года назад

    Thank you.

  • @muhammadbilalnoor6003
    @muhammadbilalnoor6003 2 года назад +1

    Thank You so much.

  • @DeepakKumar-gz7qv
    @DeepakKumar-gz7qv 2 года назад

    Perfect

  • @srinivaspatnala696
    @srinivaspatnala696 2 года назад +1

    Thank you so much bro

  • @SetsunaKiryuKengan
    @SetsunaKiryuKengan Год назад

    Man's a Legend

  • @Amit-jb5xt
    @Amit-jb5xt 2 года назад

    Thank you

  • @aktech9006
    @aktech9006 2 года назад

    tysm sir this helped me a lot 🤩😇

  • @vishnutechbuddy3106
    @vishnutechbuddy3106 2 года назад

    Awesome

  • @tsukiyomi84
    @tsukiyomi84 2 года назад +18

    Overall a good tutorial, next time I would recommend having two sets of code people can download.
    One with the starting project, with all the html, styles and anything non-router related already added, and one with the finished project for reference.
    Its easier for people to absorb information on a subject if they don't have to go through a lot of unrelated information first. The video is about routing but anyone following along will need to install and configure a bunch of packages and copy and paste a bunch of code. Thats unnecessary.

  • @jptechnoservice9013
    @jptechnoservice9013 2 года назад

    Please post more about angular videos

  • @trustyourself867
    @trustyourself867 2 года назад

    all funtion are working perfectly.super video.and my suggestion form validation in used this program and more useful it.please add the formvalidation..otherwise all are very good.keep it top bro

  • @BalaBmyprof
    @BalaBmyprof Год назад

    Thank u❤

  • @kppranave2682
    @kppranave2682 2 года назад

    This is Gem

  • @prasanth.rm26
    @prasanth.rm26 2 года назад

    Thanks