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

[@youssefnajjar7468]

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

[@BoualiAli]

Happy to know that!

[@iuliusciorica282]

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

[@BoualiAli]

Enjoy it

[@moussathioune7769]

I'm verry glade to wait you sir

[@BoualiAli]

most welcome

[@oxomsna]

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

[@eddykokokenfack1362]

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

[@BoualiAli]

More to come!

[@fahadgaliwango4502]

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

[@BoualiAli]

The pleasure is mine

[@ahmedtiba386]

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

[@BoualiAli]

My pleasure ❤️❤️

[@nihedattia2398]

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

[@BoualiAli]

Enjoy it

[@az910]

Thank you mister Ali 🎉

[@BoualiAli]

Welcome

[@Therapy__10]

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

[@BoualiAli]

Thank you so much brother. I really appreciate it

[@nothing-ic9fz]

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

[@BoualiAli]

you are most welcome

[@nicholasferrara8028]

Keep up the good work

[@BoualiAli]

Thanks you, I will

[@atalibcodinglevel7518]

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]

Wow, thank you

[@habiboulayediallo6804]

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

[@BoualiAli]

thank you, much appreciated

[@faixan13]

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

[@BoualiAli]

Glad to hear that

[@GeoffreyAulombard]

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

[@BoualiAli]

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

[@aziztolearn]

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

[@BoualiAli]

Yes, soon

[@youssefnajjar7468]

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

[@BoualiAli]

Thank you, I appreciate it

[@allabout6860]

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]

Thank you. Working on it

[@uditnagar7905]

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]

Thanks a ton I will create some react videos too

[@emilbeyerov3278]

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

[@programer8]

@@emilbeyerov3278 Angular

[@craigwebber2270]

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

[@BrianFreijomil]

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]

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

[@aadiraj6126]

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

[@user-cz6gq9st3k]

❤❤❤❤❤❤

[@sidof8065]

good

[@BoualiAli]

Thanks

[@felipolis1]

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

[@BoualiAli]

first contributor

[@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?

[@3xperttt]

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?

[@LjubisaNesic88]

+1 :D

[@user-hd1mn9hh8b]

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]

Thanks for the idea!

[@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

[@user-dg9vc3ts1y]

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]

Noted

[@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?

[@maximilianlamm2122]

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.

[@HaseebSajid-pv9rq]

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

[@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

[@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 .

[@yosefhagos4788]

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

[@felipolis1]

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

[@BoualiAli]

good job

[@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?

[@trabelsimaher9176]

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.

[@codertravel99]

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]

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

[@codertravel99]

@@BoualiAliokay sir

[@khalilnasreddine2558]

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]

Keycloak

[@felipolis1]

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

[@BoualiAli]

Surprise .D

[@codingispassion6376]

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

[@mendaxassange4465]

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]

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

[@aadiraj6126]

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]

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]

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

[@user-hl4di4gt3e]

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

[@kyawzawhtet5623]

please make angular course

[@BoualiAli]

Already done. Check the playlists

[@alitauseefreza7577]

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

[@andiuptown1711]

Did he?

[@belguitidhx8660]

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

[@BoualiAli]

draw.io

[@belguitidhx8660]

@@BoualiAli thank you man

[@ImadBELATTAR-df2it]

how to make such animated diagrams?

[@xtrange2152]

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]

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

[@abeDeveloper]

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]

can you explain?

[@abeDeveloper]

@@BoualiAli like enable and disable user who logged in

[@abeDeveloper]

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

[@BoualiAli]

@@abeDeveloper already explained

[@abeDeveloper]

@@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

[@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]

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

[@issamgharbi4801]

Email verification from spring pls

[@BoualiAli]

Already done. Check the book social network playlist

[@ForAkirah]

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

[@BoualiAli]

in the description

[@ForAkirah]

@@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]

@@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]

the github doesnt work, can you share the source code

[@BoualiAli]

issue fixed. check it again

[@mrngwozdz]

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]

Too bad that isn't with standalone component

[@abeDeveloper]

Zanzibar State University of Zanzibar(suza)

[@BoualiAli]

most welcome

[@hamzaelbouzidi7720]

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

[@Garkolym]

Typical German Stack

[@BoualiAli]

really?

[@thomasandolf7365]

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]

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.