KEYCLOAK with Spring Boot & Angular | Step by Step Guide

Buy me a coffee: ko-fi.com/boualiali In this Spring boot Angular course you will learn how to integrate keycloak with spring boot and angular application.
Walking through all the configurations: creating a realm, client, users, roles, groups, localisation, social authentication, keycloak events, ...
🎟 Join this channel to get access to perks: / @boualiali
Source code (Keycloak integration): github.com/ali-bouali/book-so...
Source code (CI/CD Pipeline): github.com/ali-bouali/book-so...
Recommended Courses:
🎬 Book Social Network Application: • Book Social Network (F...
🎬 Spring Boot security & JWT token: • Spring boot 3.0 - Secu...
🎬 Spring Boot security & JWT token with Angular: • JWT | Spring boot & An...
🎬 Spring security - Roles and permissions: • Spring boot 3 & Spring...
🎬 Spring Boot - Microservices architecture: • Microservices tutorial...
🎬 Spring Security - KeyCloak integration: • Spring boot 3 Keycloak...
🎬 DevOps - Docker for Beginners: • Docker tutorial for be...
🎬 DevOps - AWS EC2 deployment: • 🚀 Deploy Spring boot a...
🎬 Angular - Full course from scratch: • Angular Tutorial For B...
🎬 Spring Boot - Swagger UI & OpenApi Decomentation : • Spring boot 3 - OpenAp...
🎬 Spring Boot - Reactive programming & WebFlux: • Reactive Programming w...
🎬 Spring Data JPA & Hibernate: • Spring Data JPA - The ...
🎬 Apache Kafka tutorial: • Apache Kafka Tutorial ...
🎬 Ultimate Spring boot tutorial: • The ULTIMATE Spring Bo...
🎬 Ultimate Spring Data JPA tutorial: • The ULTIMATE Guide for...
CONNECT WITH ME:
👨‍💻. Website: aliboucoding.com
👨‍🏫 Facebook: / 589612651142975
📸 Instagram: / alibou_coding
🎮 GitHub: github.com/ali-bouali
🏘️ Discord: / discord
#springboot #fullstack #web #angular #keycloak #docker #book_social_network #githubactions
00:00 Intro
07:17 Reminder
08:58 Keycloak authentication flow
14:12 Setup keycloak with docker
17:31 Create a new keycloak realm and client
26:19 Keycloak integration with angular
55:12 Keycloak integration with Spring boot
01:44:54 Keycloak advanced configuration
02:21:40 Export keycloak realm
02:28:12 Outro

Пікірлер: 128

  • @Tomasm21
    @Tomasm213 күн бұрын

    Keycloak? Never heard of it. I thought Spring Security is on top for everything. Thank you for Keycloak explanation.

  • @nihedattia2398
    @nihedattia23983 ай бұрын

    finally the course is here I needed for my final year project

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Enjoy it

  • @youssefnajjar7468
    @youssefnajjar74683 ай бұрын

    finally the course is here :D can't wait to watch it

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Happy to know that!

  • @iuliusciorica282
    @iuliusciorica2823 ай бұрын

    Finally what I have been waiting for a long time, thank you!

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Enjoy it

  • @fahadgaliwango4502
    @fahadgaliwango45023 ай бұрын

    Another opportunity to learn, your content is complete and am glad to learn from you

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    The pleasure is mine

  • @eddykokokenfack1362
    @eddykokokenfack13622 ай бұрын

    Amazing course, i like it so much!!! Waiting the keycloak masterclass and others videos coming ... like microservice. Really thankful Ali

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    More to come!

  • @oxomsna
    @oxomsna2 ай бұрын

    Salam aalikoum Ali. Bravo. C'est vraiment bien expliqué. Allah yi barek.

  • @ahmedtiba386
    @ahmedtiba3863 ай бұрын

    Thank you for the fantastic Keycloak tutorial! I'm immensely grateful for the effort you've put into creating such informative content

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    My pleasure ❤️❤️

  • @moussathioune7769
    @moussathioune77693 ай бұрын

    I'm verry glade to wait you sir

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    most welcome

  • @habiboulayediallo6804
    @habiboulayediallo68043 ай бұрын

    You're producing nuggets right now, you deserve a million followers and lots of likes.

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    thank you, much appreciated

  • @aziztolearn
    @aziztolearn2 ай бұрын

    thanks for new videos Ali. Could you create a video about microservices and spring security, how it works together??

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    Yes, soon

  • @uditnagar7905
    @uditnagar79053 ай бұрын

    Sir, your projects are AWESOME....They includes industry level standards like CI/CD , proper authentication with Email, Docker etc.....But SIr please bring a Project with all these Industry standards with REACT or NEXT.JS pleaseeeeeeeeeeeeeeeee sir......

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thanks a ton I will create some react videos too

  • @emilbeyerov3278

    @emilbeyerov3278

    3 ай бұрын

    ​​@@BoualiAli which frontend framework you recommend us for learning

  • @programer8

    @programer8

    2 ай бұрын

    @@emilbeyerov3278 Angular

  • @craigwebber2270

    @craigwebber2270

    Ай бұрын

    You are one of the only spring youtubers please don’t leave spring

  • @youssefnajjar7468
    @youssefnajjar74683 ай бұрын

    literally this is the best keycloak course that you can find in the internet

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thank you, I appreciate it

  • @Therapy__10
    @Therapy__103 ай бұрын

    man i wan say that i love u so much about all this effort from morocco

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thank you so much brother. I really appreciate it

  • @az910
    @az9103 ай бұрын

    Thank you mister Ali 🎉

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Welcome

  • @Awil-b5n
    @Awil-b5n12 күн бұрын

    Thank you Brother

  • @GeoffreyAulombard
    @GeoffreyAulombard3 ай бұрын

    Amazing serie of vidéos, that was pretty interesting. It could be nice to add another vidéo about implementing an api gateway with nginx, manage load balancing with it, and see how to deploy all of this in you VPS.

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    this will be part of the next serie (micro services)

  • @nothing-ic9fz
    @nothing-ic9fz3 ай бұрын

    Thank you sir , I do't know how I to praise you .Thank you so much. sir

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    you are most welcome

  • @atalibcodinglevel7518
    @atalibcodinglevel75183 ай бұрын

    Alibou you are the est tutor I have ever seen. You change life of many students worldwide you are the best ❤ all I can say is thank you thank you. All this for freee

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Wow, thank you

  • @nicholasferrara8028
    @nicholasferrara80283 ай бұрын

    Keep up the good work

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thanks you, I will

  • @allabout6860
    @allabout68603 ай бұрын

    Thanks man it helps a lot for me as an intern. More power to you... 🎉 Can you please make any industry level project with atleast minimum number of microservices. ?

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thank you. Working on it

  • @faixan13
    @faixan132 ай бұрын

    MashAllah awesome as always. thoroughly understand keycloak, looking fwd to explore more features myself as well.

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    Glad to hear that

  • @sanketkalokhe3548
    @sanketkalokhe3548Ай бұрын

    Hey ali, this tutorial is just brilliant really loved it but I was thinking on how can we implement the oauth2 login using bff pattern or even how to implement the entire login flow by ourself if possible can you please make a tutorial on these?

  • @BrianFreijomil
    @BrianFreijomil3 ай бұрын

    This video is great, you deserve the subscription and like. Just one thing, it's been a while since I found a video or documentation that perfectly explains how to customize the keycloak login using docker. If one day you could make a video explaining how to solve it, I would greatly appreciate it. Great video, greetings!🚀🚀

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thanks for the sub! I will show how to customize the keycloak theme

  • @aadiraj6126

    @aadiraj6126

    2 ай бұрын

    ​@@BoualiAlioh! that will be fun..🎉 thanks from my end too😊 Keycloak makes life so easy😅

  • @yazansadieh6991
    @yazansadieh69912 күн бұрын

    So thank you very much for the very helpful tutorial. I do have a question for u: If in need to add a custom key to my jwt, like as tenantId for MultitenantId app or Multi-Database App. How to customise the generated JWT from Keyloak? Dose Keyloak provide such as mechanism to modify or add some new properties to jwt? Especially by login with a custo input in the login template, where the user has to provide a unique id (the tenantId) and add it in the JWT ? If i add a new attribute to the register and login template, where can i add this attribute value to the jwt? And can i asign create a function that check if there is a group for this attribute? So if there is no group with the same value name i will not register the user or logged him in the app if he is not in the group! I need this customization for a multiclient web app that use for each client a different DB with same schemata. For that i need to have a tenantId in my JWT that identifies the DB to get the data from it. I know it is a little bit advaced but it will help me alot to just to know if it is possible or not😊. I hope that my question is clear enough 😅

  • @aiexplore7700
    @aiexplore7700Ай бұрын

    Your book social network project is really awesome ,I practiced different things like CI/CD pipeline using your video,but keycloak is not working with angular 17 , could you please explain how to do it on perform keycloak authentication using angular 17 or above

  • @felipolis1
    @felipolis13 ай бұрын

    I like the idea of a open source project to create keycloak theames...

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    first contributor

  • @maximilianlamm2122
    @maximilianlamm21222 ай бұрын

    Thank for the good video I have been asking myself for a long time, how do I do this if I have an e commerce store? Can I have an address table in my Spring App and map the data into the token? In keycloak you can include the address, you just have to select it.

  • @user-dg9vc3ts1y
    @user-dg9vc3ts1y2 ай бұрын

    Hi Ali, thanks for great tutorials. I know that maybe will be too much , but can you make keycloak tutorial for user federations. Maybe for example with users from bsn. Thanks in advance sir

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    Noted

  • @sidof8065
    @sidof80653 ай бұрын

    good

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thanks

  • @3xperttt
    @3xperttt2 ай бұрын

    Thank you so much Ali, I have a question: after I created my realm and created a client and a user, when i logout to login again with the new user it doesnt work, but if i login with admin i can see i have the new user but can't use it to login. Any suggestions?

  • @trabelsimaher9176
    @trabelsimaher91762 ай бұрын

    Merci beaucoup pour ce tuto, Est-ce que tu peux nous montrer comment on peux profiter du keycloak sans avoir rediriger le client vers l'interface d'accueils keycloak. Merci d'avance.

  • @benhammoudaabderrazzek1023
    @benhammoudaabderrazzek1023Ай бұрын

    thank you very much for this tutoriel but i want to know howa to create permession and ressource when you use a public client if i can't what should i do to integrate keycloack in angular and springboot and create permission in the same time and thank you .

  • @user-cz6gq9st3k
    @user-cz6gq9st3kАй бұрын

    ❤❤❤❤❤❤

  • @user-hd1mn9hh8b
    @user-hd1mn9hh8b2 ай бұрын

    Nice video! Can you do a video using springAI since it s new! Maybe you can create a chatbot App who where you can upload a PDF and the chatbot can answer your questions concerning the pdf you uploaded in the DB. Sounds a good challenge and it will be helpful !

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    Thanks for the idea!

  • @hantrinhviet3028
    @hantrinhviet302811 күн бұрын

    Hi ser, is there any to using our own form in angular for auth instead of using the default login page from keycloak. Please help me, thank you!

  • @HaseebSajid-pv9rq
    @HaseebSajid-pv9rq27 күн бұрын

    can you please make a video on spring security with React js?

  • @yosefhagos4788
    @yosefhagos47882 ай бұрын

    Hi Ali, first of all I would like to express my gratitude for all the very detailed videos and your content. I followed the video series in great detail and coded it, but unfortunately it doesn't work with gmail and the generated app password. I have also tried other email providers, but without success. When testing the connection between Keycloak and Gmail, I can't find any information in the Keycloak (container) log or the web console that can help me solve the problem. Do you have any idea what the problem is? Thank you very much

  • @codertravel99
    @codertravel993 ай бұрын

    It’s awesome can you implement this code as standards implementation and in all combination also there is one another client wso2 which I think is advanced security management tool if it is possible then please focus on that also

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    watch the video and you get the answer. otherwise let me know what you are missing

  • @codertravel99

    @codertravel99

    3 ай бұрын

    @@BoualiAliokay sir

  • @codingispassion6376
    @codingispassion63762 ай бұрын

    Sir How can I add the resources in the keycloak user token payload? I have created the resources, scopes, policies and permissions in the keycloak now i want to add the resources according to the user roles in the user token. please ans

  • @braveheartask1
    @braveheartask1Ай бұрын

    Great content Ali. A question through, Angular being SPA, isn't it better to implement OAuth2 with PKCE? Can you please include that as well if possible? The matters get confusing when we start dealing with Code_Verifier and Code_Challenge which are necessary for PKCE and for my life I am not able to figure it out with Angular, Keycloak and Spring Boot

  • @felipolis1
    @felipolis13 ай бұрын

    what will be the next video of this serie? Im excited to the websocket one

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Surprise .D

  • @khalilnasreddine2558
    @khalilnasreddine25583 ай бұрын

    I watched the old jwt video and i want to watch the new version of it but you also replied on a conment to study this one. In your advice what should i learn keycloak or jwt? Or they both are related and should study both of them?

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Keycloak

  • @anandathakur4937
    @anandathakur4937Ай бұрын

    Hi @ Hello - if we are using keycloak.. does that mean mean we don't need to manage any table for user roles , groups in our application databasen?

  • @ThilankaPathum
    @ThilankaPathumАй бұрын

    Thank you for the course Ali !!! I'm getting 'ERROR Reference Error: document is not defined' at 38:39. Checked many places, but couldn't find a solution. Can you please explain why could it happen?

  • @mohamednibras53

    @mohamednibras53

    15 күн бұрын

    I'm also getting same error.

  • @LjubisaNesic88
    @LjubisaNesic882 ай бұрын

    +1 :D

  • @aadiraj6126
    @aadiraj61262 ай бұрын

    Can you tell me how to bring back book owner name in book-card. I spent 2-3 whole night but unable to fix it. I tried via keyclock jwt, keyclock api, etc. but only null is coming. Right now we are using bookdb which doesn't have owner name. Actually user_entity table, inside keyclock db in different postgres db, have that owner name. Though connectedUser.getName() gives primary key for keyclock db, but unable to fetch data as it's another db(not sync with our jpa). I can write Code to fetch data from two db implementation, but just to get owner name will be too heavy, there must be some easy way around. Please help me. Guide me.

  • @toydegg4708
    @toydegg47083 ай бұрын

    new subscriber here,i see that you started with an old project of yours, can you please tell me which videos i need to start with to end up here, i want to start with you from scratch pls

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    just check the playlist and follow the publish order: Book Social Network

  • @user-hl4di4gt3e
    @user-hl4di4gt3eАй бұрын

    getting this error, not sure why, A 'Keycloak' instance can only be initialized once.

  • @mendaxassange4465
    @mendaxassange44653 ай бұрын

    Hey, Grate Videos.. I am very lucky to be born in this time... Request: A video on how to create custom dialect for Hibernate. for example in Native Query if i use SELECT ARR_AGG(userDB.name) as userName, ARR_AGG(userDB.age) as userAge FROM (SELECT name, age FROM user) as userDB How i can project it to a Interface or Class.

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    You can use projection. check the Book social network application and you will find an example there

  • @ImadBELATTAR-df2it
    @ImadBELATTAR-df2it2 ай бұрын

    how to make such animated diagrams?

  • @Harry96mega
    @Harry96mega15 күн бұрын

    Didn’t work for me the email verification. It says the test connection failed 😢

  • @alitauseefreza7577
    @alitauseefreza75772 ай бұрын

    @BoualiAli Swagger UI is now working, please commit the changes in the git repo which you shared.

  • @andiuptown1711

    @andiuptown1711

    Ай бұрын

    Did he?

  • @felipolis1
    @felipolis13 ай бұрын

    Personal checkpoint control: 2:28:54 (DONE)

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    good job

  • @belguitidhx8660
    @belguitidhx86603 ай бұрын

    hey ali , which web site you use to create those screnn shoot diagram

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    draw.io

  • @belguitidhx8660

    @belguitidhx8660

    3 ай бұрын

    @@BoualiAli thank you man

  • @kyawzawhtet5623
    @kyawzawhtet56233 ай бұрын

    please make angular course

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Already done. Check the playlists

  • @abeDeveloper
    @abeDeveloper2 ай бұрын

    Hello Alibou i follow along with your security video now can you help to give another videos which will manage user who loged in either to block user and allow the user helpfully you will work with this also

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    can you explain?

  • @abeDeveloper

    @abeDeveloper

    2 ай бұрын

    @@BoualiAli like enable and disable user who logged in

  • @abeDeveloper

    @abeDeveloper

    2 ай бұрын

    Admin can enable auser disbale user like in Twitter the Admin can block you to login

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    @@abeDeveloper already explained

  • @abeDeveloper

    @abeDeveloper

    2 ай бұрын

    @@BoualiAli sorry my brother for your time im a fans and follow all your video but which video you explain it Mr sorry for disturbance

  • @IonGuzun-k6l
    @IonGuzun-k6l10 күн бұрын

    how can i deploy a angular springboot app?

  • @BoualiAli

    @BoualiAli

    10 күн бұрын

    Check the deployment video

  • @Porrsotemimtao
    @PorrsotemimtaoАй бұрын

    can you make a new integration keycloak and angular for angular 18 without the -no-standalone? this tutorial is not possible to follow without the -no-standalone while creating the project ....

  • @magadiflo-dev

    @magadiflo-dev

    Ай бұрын

    if you want to create a module-based app, use --no-standalone flag. Example: ng new proyect --no-standalone

  • @issamgharbi4801
    @issamgharbi48013 ай бұрын

    Email verification from spring pls

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Already done. Check the book social network playlist

  • @ForAkirah
    @ForAkirah3 ай бұрын

    i,m not able to find github repo for this one ?

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    in the description

  • @ForAkirah

    @ForAkirah

    3 ай бұрын

    @@BoualiAli i have a question in my project i have implemented jwt with role based access ,if i replace jwt with keycloak will rest of the functionalities work as expected without changing anything , actually it has a huge code base with lot of roles

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    @@ForAkirah I experienced the same situation. in my case I had to do some changes. it depends on the design of your application. even if it takes sometime, I highly recommend that you migrate to keycloak

  • @appscastle
    @appscastle3 ай бұрын

    the github doesnt work, can you share the source code

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    issue fixed. check it again

  • @mrngwozdz
    @mrngwozdz2 ай бұрын

    Ok, but there is nothing about assigning resources to roles. Right now there is no difference between admin and user because both of them have access to all resources.

  • @Lucas-qi6vu
    @Lucas-qi6vu2 ай бұрын

    Too bad that isn't with standalone component

  • @abeDeveloper
    @abeDeveloper3 ай бұрын

    Zanzibar State University of Zanzibar(suza)

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    most welcome

  • @hamzaelbouzidi7720
    @hamzaelbouzidi77202 ай бұрын

    The Arab community needs you, brother. Please do not forget, we need videos by arabic

  • @Garkolym
    @Garkolym2 ай бұрын

    Typical German Stack

  • @BoualiAli

    @BoualiAli

    2 ай бұрын

    really?

  • @thomasandolf7365
    @thomasandolf73653 ай бұрын

    Why are you overcomplicating the extractions of scopes to GrantedAuthorities and writing a custom converter when there is a class named JwtGrantedAuthoritiesConverter that is specifically designed for that, It even has its own section in the docs. If you want to tech people spring security i suggest you tech them how to read the docs, and while you are writing things show and reference the docs as i have seen several of your videos providing misinformation and bad practices.

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    Thanks for the feedback. This my way of teaching things. People need to learn the why and how not only mentioning that there is a token converter provided. If you don’t like my content, feel free to leave and learn from someone else.

  • @xtrange2152
    @xtrange21523 ай бұрын

    Great video but how can user update their user -profile they password, etc... and get the username to display in the front end app and get user details information how can we acquire it

  • @BoualiAli

    @BoualiAli

    3 ай бұрын

    It was already mentioned in the video. I think you did not follow carefully