MENU

Fun & Interesting

Build a WhatsApp Clone With Spring Boot, Angular 19, Keycloak & WebSockets

Bouali Ali 54,380 lượt xem 3 months ago
Video Not Working? Fix It Now

Join this channel to get access to the bootcamp:
https://www.youtube.com/channel/UC_mRM-418WkU2SgpvNG3jKA/join

Buy me a coffee: https://ko-fi.com/boualiali

Build a WhatsApp Clone: Full-Stack Tutorial (Spring Boot & Angular 19)

Learn how to build a real-time WhatsApp clone app from scratch! In this step-by-step tutorial, we’ll use Spring Boot, Angular 19, Keycloak, WebSockets, and Bootstrap to create a secure, responsive, and fully functional messaging app.

Perfect for developers of all levels, this project will enhance your full-stack development skills. Watch now and start building your portfolio!

#SpringBoot #Angular19 #WebSockets #Keycloak #FullStack

Source code: https://github.com/ali-bouali/whatsapp-clone

CONNECT WITH ME:
👨‍💻. Website: https://aliboucoding.com
👨‍🏫 Facebook: https://www.facebook.com/groups/589612651142975
📸 Instagram: https://www.instagram.com/alibou_coding
🎮 GitHub: https://github.com/ali-bouali
🏘️ Discord: https://discord.gg/Ded93eKfAB

Recommended Courses:
🎬 Spring Boot security & JWT token: https://www.youtube.com/watch?v=BVdQ3iuovg0
🎬 Spring Boot security & JWT token with Angular: https://youtu.be/xqhdRrFzLFY
🎬 Spring security - Roles and permissions: https://www.youtube.com/watch?v=mq5oUXcAXL4
🎬 Spring Boot - Microservices architecture: https://www.youtube.com/watch?v=KJ0cSvYj41c
🎬 Spring Security - KeyCloak integration: https://www.youtube.com/watch?v=vmEWywGzWbA
🎬 DevOps - Docker for Beginners: https://www.youtube.com/watch?v=LNL0h66FXu0
🎬 DevOps - AWS EC2 deployment: https://www.youtube.com/watch?v=ua0cb2LjCW4
🎬 Angular - Full course from scratch: https://www.youtube.com/watch?v=VTEDh2pNSBQ
🎬 Spring Boot - Swagger UI & OpenApi Decomentation :https://www.youtube.com/watch?v=2o_3hjUPAfQ
🎬 Spring Boot - Reactive programming & WebFlux:https://www.youtube.com/watch?v=EnUsNVHveyU
🎬 Spring Data JPA & Hibernate: https://www.youtube.com/watch?v=eY9riN5Y2mQ&list=PL41m5U3u3wwkS8BU0fIeRQwY3hK4VlFlX&pp=gAQBiAQB
🎬 Apache Kafka tutorial: https://youtu.be/KQDTtvZMS9c
🎬 Ultimate Spring boot tutorial: https://youtu.be/6r-MpAWVw6c
🎬 Ultimate Spring Data JPA tutorial: https://youtu.be/mcl_nibV39s

00:00 Intro
06:53 Entity Relationship Diagram (ERD)
10:47 Infrastructure setup
17:18 Create the spring boot project
20:37 Keycloak configuration
23:27 Project configuration
29:45 Security configuration
47:28 Creating the entities and the relationships
01:11:38 Create the named queries
01:23:35 Sychronize the users with keycloak
01:38:50 Implement the chat domain
01:55:38 Implement the message domain
02:22:25 Implement the file service
02:34:22 Implement the user domain
02:40:32 Websocket configuration
02:46:28 Implement the notification service
02:56:17 Add the OpenApi
03:02:07 Test the backend
03:09:38 Create and configure the frontend project
03:18:49 Keycloak configuration
03:29:21 Add and configure the Http Interceptor
03:36:16 Implement the main interface
03:51:16 Implement the chat list component
04:23:49 Implement the messages list UI
04:57:59 Implement sending messages with emojis
05:23:58 Implement the websocket
06:04:23 Implement the media upload
06:10:38 Add auto scroll
06:12:45 Full application demo
06:17:25 Outro

Comment