Full Stack Application with Spring Boot, Next.js, Tailwind CSS & Next-Auth.js

Подписаться 106 тыс.

Просмотров 39 тыс.

50% 1

Visit brilliant.org/DailyCodeBuffer/ to get started learning STEM for free, and the first 200 people will get 20% off their annual premium subscription
In this Spring Boot tutorial, you will learn Spring Boot full stack with Next Js, Next-Auth js, and Tailwind CSS. Next Js is a Framework for React Library to build front-end apps. For this Spring Boot tutorial, you will learn how to build an API, along with a React application that will consume the API.
🗒 Project Source Code: github.com/shabbirdwd53/nextj...
📚Course Content📚
⌚ (00:00) Intro
⌚ (01:34) Application Demo
⌚ (03:48) Brilliant Message
⌚ (05:18) Building Springboot Application
⌚ (15:37) Adding REST API's
⌚ (34:25) Testing REST API's with Postman
⌚ (37:07) Creating Next JS Application
⌚ (41:50) Adding Tailwind CSS
⌚ (44:45) Navbar Component
⌚ (48:15) Creating Component to LIst all data
⌚ (57:33) Calling back end API to fetch all data
⌚ (01:06:56) Component to Add new Data
⌚ (01:22:31) Managing State for Data
⌚ (01:26:22) Save Data by calling back end API
⌚ (01:35:08) Implementing Delete Functionality
⌚ (01:40:08) Edit Data Functionality
⌚ (01:50:23) Updating the data to back end
⌚ (01:55:20) Implementing Next-auth Js with Complete Login Flow
🎟 Join this channel to get access to perks:
/ @dailycodebuffer
RECOMMENDED COURSES
🎬 Spring Boot + React Full Stack Web Application with Tailwind CSS - • Spring Boot + React Fu...
🎬 Spring Security Full Course | From Registration to Login - • Spring Security Tutori...
🎬 Microservices using SpringBoot | Full Example - • Microservices using Sp...
🎬 Event-Driven Microservices with CQRS Design Pattern - • Implement CQRS Design ...
🎬 Implement SAGA Design Pattern using Spring boot and Axon Framework - • Implement SAGA Design ...
🎬 Spring Data JPA Tutorial | Full In-depth Course - • Spring Data JPA Tutori...
🎬 Deploy Springboot Microservices to Kubernetes Cluster - • Deploy Springboot Micr...
🎬 Automate Microservices deployment with Github Actions - • GitHub Actions Tutoria...
🎬 Go / Golang Full Course for Beginners - • Golang Tutorial for Be...
🎬 Node JS Full Course for Beginners: Learn in 2 Hours - • Node JS Full Course fo...
🎬 Express.js Tutorial - Beginner | 2021 - • Express.js Tutorial - ...
🎬 Redis CLI Tutorial | Complete Course - • Redis CLI Tutorial | C...
BE MY FRIEND:
👨‍💻. Website: www.dailycodebuffer.com/
👨‍🏫 Facebook: / dailycodebuffer
🐦 Twitter: / dailycodebuffer
📸 Instagram: / dailycodebuffer
🎮 GitHub: github.com/dailycodebuffer
MY FAVOURITE GEAR:
👨‍💻 My Macbook Air M1: amzn.to/3eFXlID
💻 ASUS ROG Zephyrus G14, 14": amzn.to/32xsXhf
💻 ASUS ROG Zephyrus G14, 14" (US): amzn.to/3xa6X6m
🎤 My Main Mic: amzn.to/3qDl0z0
🎤 My Main Mic (US): amzn.to/3awzUj7
🎙 My Secondary Mic: amzn.to/3sOZCJW
🖥 My LG Monitor: amzn.to/3zhLY3e
🖱 My Mouse: amzn.to/3eDpRKT
⌨️ My Keyboard: amzn.to/32xthMZ
RECOMMENDED BOOKS:
📙 Mastering Spring Boot 2.0 (Kindle): amzn.to/3HsOiHu
📙 Mastering Spring Boot 2.0 (US): amzn.to/3tHNUy5
📙 Building Microservices(Kindle): amzn.to/3gsA1jL
📙 Building Microservices(US): amzn.to/3dDnfNn
📙 Spring Boot in Action: amzn.to/32Nf3qW
📙 Spring Boot in Action (US): amzn.to/32DkeX9
📙 Spring Microservices in Action: amzn.to/3mQ4sCH
📙 Spring Microservices in Action(US): amzn.to/32G3Hl7
🎻 MUSIC:
🎵 Hear the Noise (Sting): ru-vid.com...
“Sound effects obtained from www.zapsplat.com“
#FullStack #SpringBoot #Nextjs #Nextauthjs #TailwindCSS #authentication #DailyCodeBuffer

Наука

Опубликовано:

9 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 93

@DailyCodeBuffer 2 года назад

Visit brilliant.org/DailyCodeBuffer/ to get started learning STEM for free, and the first 200 people will get 20% off their annual premium subscription

@Atharva_kathiyawadi 2 года назад

brother can you guide me. either go with java or node?? which one is good?? for start career and future growth

@kettenbach 2 года назад

Can wait to do this. Thanks for sharing

@calintamas7576 2 года назад

Thanks Shabbir for this full stack demo video! Excellent!

@DailyCodeBuffer 2 года назад

Thanks Calin Hope you enjoy

@garyclark1058 2 года назад

Wow Shabbir! What a spectacular tutorial! I was looking for a jumpstart on creating a front end to a Spring Boot application and this was it. Great job!

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻

@pmig81 Год назад

Thanks a lot for your work.I just found your channel recently and it's so helpful since I'm really interested in Java and Spring. Keep up the wonderful work, my friend. You got a new subscriber!

@DailyCodeBuffer Год назад

Thanks 🙏🏻

@ousmanesangary658 2 года назад

Hat off to you for this awesome video Shabbir . I anticipate more React/Springboot combo from you in the future.

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻

@nitishvk8598 2 года назад

Was Waiting this. Thank you 👍

@DailyCodeBuffer 2 года назад

🙏🏻🙏🏻 hope you enjoy

@WilmanArambillete 2 года назад

congrats, a very clear explanation. Thanks for another excellent video!

@DailyCodeBuffer 2 года назад

🙏🏻

@Pedro-dw3if Год назад

Do more tutorial with spring and react/next. Thx man! Excellent content.

@GustavoLiu Год назад

Great tutorial

@sujoysaha6617 2 года назад

thanks for this tutorial. this tutorial will help me for developing my project.

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻

@ricardogayer4661 2 года назад

Great Tutorial! Thanks Sabbir

@DailyCodeBuffer 2 года назад

🙏🏻

@DennisVlaanderen 2 года назад

For everybody that wants to reduce the amount of getters and setters being called when converting entities to models or vice versa. You can also create a constructor that take the other class as a parameter, keeping all the explicit mapping to the class itself. Then when using the Stream API you can make use of inferred method calls rather than a lambda like so: entities.stream().map(Data::new).collect(Collectors.toList());

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻 This is good Stuff

@mohansriram7548 2 года назад

hi because of your video i got a job from small startup company .your video is neat and clean easily can understand

@kakashisensei5320 2 года назад

Great Something new to learn

@dandendrasingh7326 2 года назад

Thanks Sabbir for yet another full stack demo video. Can make next video on containerising these two projects in different container show how two containers can communicate each other.

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻 Great suggestion, will work on it and share

@anu789ful 2 года назад

Thank you. Much needed tutorial.

@sebastianpuscas5215 2 года назад

Thank you for the video! Would like to see how the server validates the token from Facebook, also makes sense deploying both of those , node server for next js and tomcat server for spring boot ?

@Kaushikraj9845 2 года назад

Nice ..Could we have extended css..or reuse css for many of the div. inline styles are written?

@hamedghafouri5451 6 месяцев назад

perfect

@cloudstackz Год назад

Thanks, Shabir. Is there a way to reject a social authentication from the backend, in case the user was denied for any reason (account suspended, a specific email domain is not allowed, etc. )?

@mohammedsayeed330 2 года назад

Awesome 😎👍

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻

@rajp5260 2 года назад

Excellent content bro👏👏

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻

@sambathsrey5941 2 года назад

I wonder what if we return List instead map through userEntities and return List? What the different?

@tyranitarxd2819 4 месяца назад

Did I miss something? You set up nextauth but anyone can still make requests to the spring backend

@Unknown-so7qv Год назад

Can you recommend a library for datatables for apps like this one?

@jayanthmadupalli5531 6 месяцев назад

Thank you for the video, but you entirely skipped the security part for your backend, What's the point of using using authentication only on the frontend?

@manuariichns8023 2 года назад

What about Spring Secure isnt good?

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

how do you register the user in the backend, after they used Github/Facebook to login?

@umamaheswarrao8269 3 месяца назад

How to deploy next is and spring into Jobs’s server

@paper-studio Месяц назад

Where is ACL for it? I came here for the ACL part, you are not logging in the user into your spring backend

@muhammadarshad574 2 года назад

alway great

@DailyCodeBuffer 2 года назад

Using Atom icon theme

@duongphamhai1148 Год назад

What theme are you using??

@DnKZone 9 месяцев назад

why not do the backend also in NextJs? it makes it more convenient and easy

@okontomlinson8920 2 года назад

Thank for the project. can you explain to me where do you get the database setup for the application properties.

@DailyCodeBuffer 2 года назад

From the documentation

@okontomlinson8920 2 года назад

@@DailyCodeBuffer Thanks. From the spring boot docs.

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

A very informative video to fullstack develop website. Sir, please share your vscode extension. Tq in advance

@robinborjesson8499 2 года назад

The backend is completely unprotected. What if I bypass your frontend?

@ogunodabas9332 Год назад

Which plugin I used Intellij idea looks very nice.

@DailyCodeBuffer Год назад

Xcode dark theme

@ogunodabas9332 Год назад

@@DailyCodeBuffer thank you. Is there any plugin you can recommend for eclipse? I am using DevStyle Dark Theme

@madhavkummara7150 2 года назад

what is the difference between model and entity when they both store the same values?

@emmanuelu Год назад

From what I understand a Model is more of a DTO, meaning an object that is transfered between the front end and backend. An entity is more of how the data is stored in the database.

@samuelegwoyi 2 года назад

Hi Shabbir, thanks for the videos. It has been awesome learning from you. I need your assistance, from the code snippets below, how can I show this error on the UI? if(!response.ok){ throw new Error("Something went wrong"); }

@ousmanesangary658 2 года назад

I suggest that you use the alert function instead.

@MrBillykara Год назад

Great tutorial, you explain everything so well. I just have one question, why is it that I can't click on "Edit" on the same row consecutively? I can't find a way to fix this. What I mean is that you can't open the edit menu for one user, close it and then reopen it. This problem doesn't exist with the Add User button. I would greatly appreciate your help.

@MAlves-nh8ne 6 месяцев назад

Did you manage to make it work? I have the same problem.

@MrBillykara 6 месяцев назад

@@MAlves-nh8ne i did but I don't remember the solution, sorry. It was probably something to do with the states.

@hugokuva3960 2 года назад

I'm interested to know which VS code template you are using

@DailyCodeBuffer 2 года назад

Using Xcode dark theme

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

You saved my life, thank you so much

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

Glad I could help!

@commenter9451 2 года назад

Awesome..... please make react js tutorial..there are no good tutorials on react

@DailyCodeBuffer 2 года назад

Thanks 🙏🏻, sure

@manee427 2 года назад

Thanks what is the reason of making model and entity together? is it possibl to do it only with entity? what is the advantage of making another model also? Thanks again for wondeful content

@DailyCodeBuffer 2 года назад

To make sure the object you are using to get the data from Client (UI) is different than what you use to interact with the database for the security reasons. There are best practices for the application. Hope this answers your question

@manee427 2 года назад

@@DailyCodeBuffer yes thanks perfect

@alexcondurachi8423 6 месяцев назад

@@manee427Hello it has no point to create 2 classes to store the same data, or at least what he ment to do was to create ResponseClasses, UserEditResponse for ex, UserAddResponse. The model is the entity.

@alexcondurachi8423 6 месяцев назад

@@manee427for viewing user posts for example, you may create a UserPostsResponse class, which takes a User object as a dependency and return user data and he.s posts

@manee427 6 месяцев назад

Thamks@@alexcondurachi8423