thanks for this playlist... 2:19 => first we have to set it up : [ ctrl + shift + i ] -> [ ctrl + shift + p ] -> (make sure you are on application ) enter then we can just use [ ctrl + shift + i ] to open application section
i can only say awesome series. I started nextjs with another awesome tutorial that served me as a good starting point, and i stumbled on your tutorial which was the best selection to take at the level i currently am now.
Very good series, and I love the explanation! Can we have next series on RBAC with Next.js with AWS Cognito user pool and identity with amplify. I am very excited to learn.
Hitesh, You have Brilliantly explained how a reactJS/expressJS developer can switch to nextJS. However, NextJS boasts about a lot of features in authentication. It is a very complicated system. I would request you to kindly explain how we can do, exactly the same, but using authJSv5/next-auth features. As it is said that it does many things magically. I wonder how the magic works and how we can make it work for us. Can we expect such a tutorial from you. 🤔
first of all awesome tutorial and thanks a lot. Second of all what is this INSANE extension that gives you the request response on the vscode editor???
In getDataFromToken helper file, do we really need connect()? because when we are using User model in that we have called connect(). Really great series, thanks for such insightful videos 👍
sir the last part of video make me completely confused how that getuserdetails and the code written in helpers part how data is getting fetched how can i clear this doubt
Sir I had one query is it a good practice to do connect() on every API page or does it happen only once even if we call it multiple times on every page kinda like a Singleton class?
Hey guys , i need your help i stuck on this error in AxiosError: Request failed with status code 404 when I click the getUserDetails button to fetch / display the id.
Hey hitesh, why I can't get the cookies like you get, I try several way, but I didn't get it , it's says always empty and I believe most to the dev get's error when they try to get the token value or maybe not, but is there any one who get token like hitesh get
I found a security issue where you can type in the user can just put value name token and any value to sign in but i fixed it by verifying the token then redirecting i couldnt do the verifying in the middleware so i did it i the me route
bro thank you so much, i love you for this video. i like how you didnt use next auth and was helpful for me that wanted to build my custom login. i have a request also, can you do one for google login as well?
sir i think there is an issue regarding the model, when i first fetch the id to profile it working fine and also when i visit the [id] it showing fine but when i go back and re click on the getdetail button in profile.tsx it is generating error which is saying like OverwriteModelError: Cannot overwrite `User` model once compiled.
Next Js does not support the bootstrap js library because of Server Side rendering can you provide a solution for It? The reason there are main things in Js library table search table HTML button which take massive time in tailwind
use client doesn't work because the js library applies on DOM so it gives a document not found error those solutions present in StackOverflow don't work for the next js upgraded to version 13.4
You didn't check If the jwt Token is valid or not like if I put anything with the name of token in the cookies I can login to the page. I implemented that verifying token in my project like this you can modify as your need : middleware.js : import { NextResponse } from "next/server"; import { verifyJwtToken } from "./app/libs/auth"; export async function middleware(req) { const token = req.cookies.get("jwt")?.value; const path = req.nextUrl.pathname; const isPublicPath = path === "/login" || path === "/register"; const verifiedToken = token && (await verifyJwtToken(token).catch((err) => { console.log(err); })); if (isPublicPath && token && verifiedToken) { return NextResponse.redirect(new URL("/", req.nextUrl)); } if (!isPublicPath && (!token || !verifiedToken)) { return NextResponse.redirect(new URL("/login", req.nextUrl)); } } export const config = { matcher: ["/login", "/register", "/"], }; libs/auth.js : btw "jose" is a npm package that allows to verify the jwt token in the frontend and it returns true or false if the token is valid or not. import { jwtVerify } from "jose"; export const getJwtSecretKey = () => { const secret = process.env.JWT_SECRET; if (!secret || secret.length === 0) { throw new Error("The environment variable JWT_SECRET is not set."); } return secret; }; export async function verifyJwtToken(token) { try { const verified = await jwtVerify( token, new TextEncoder().encode(getJwtSecretKey()) ); return verified.payload; } catch (error) { throw new Error("Your token is expired"); } }
You are the gem in the coding community that literally saved me from figuring out where to learn nextjz from basic to advanced
thanks for this playlist...
2:19 => first we have to set it up : [ ctrl + shift + i ] -> [ ctrl + shift + p ] -> (make sure you are on application ) enter
then we can just use [ ctrl + shift + i ] to open application section
Noice ❤
after making this project i start the journey of new world in javascript framework thanks sir
Great methodology to explain the core things. We have learnt a lot about the prices of authentication.
Well done Ritesh SIR
He is hitesh; not ritesh
However there is a Itesh😂
i can only say awesome series. I started nextjs with another awesome tutorial that served me as a good starting point, and i stumbled on your tutorial which was the best selection to take at the level i currently am now.
Great contents, Thanks.
02:12 -> in chrome you can create your own shortcut and set the Application trigger directly.
how ?
This is the best next js course 🤩🤯
19:07 i was confused about middleware but you made it easier. Thanks
Happy to help
Wow wow this is so unexpected 😍 3 in a row thank u
🎉
Love the series.
Time stamps for the topic are required sir.
Go ahead and add them. Comments should also add value
at 5:57 can we use "response.cookies.delete('token')" intead of manually setting it as using "response.cookies.set(...)" ?
Very good series, and I love the explanation! Can we have next series on RBAC with Next.js with AWS Cognito user pool and identity with amplify. I am very excited to learn.
Sir which extensions to used for auto suggestion. Please suggest.
Thanks brother, I was looking for this thing since long time.❤❤❤❤😁😁
sir uninstall the color indent extension that will fix the messed up indentation and use prettier
Wait, what full stack king is here? He never disappoints his viewers
😁😁
Hitesh, You have Brilliantly explained how a reactJS/expressJS developer can switch to nextJS. However, NextJS boasts about a lot of features in authentication. It is a very complicated system. I would request you to kindly explain how we can do, exactly the same, but using authJSv5/next-auth features. As it is said that it does many things magically. I wonder how the magic works and how we can make it work for us.
Can we expect such a tutorial from you. 🤔
A greate teacher in tech
legendary content
which theme you are using hitesh sir ?
in middlewre how to implement it for user roles like admin and normal user for specific path
first of all awesome tutorial and thanks a lot.
Second of all what is this INSANE extension that gives you the request response on the vscode editor???
great series sir. how to make the toast work?
if
matcher: [
'/',
'/profile',
'/login',
'/signup',
'/profile/:path*'
]
is updated with :path* then we cannot visit any URL after /profile
so happy i found that it is one-of -kind content. btw what is the plugin that showed the data here 38:02
sir lovely explain pls keep it ! would you use redux?
Series is finished in one day. woah
Not finished, more to come.
Thank you! I did not expect to enjoy, but I did thanks to you!
which extensions are using in vs code for suggest code
what extentions are you using can you please give us a video for that or give me names of those???
In getDataFromToken helper file, do we really need connect()? because when we are using User model in that we have called connect().
Really great series, thanks for such insightful videos 👍
Sir which suggestions extensions are you using🥲♥️
sir whicj extansion you are using for auto css code genarate
Damn that is so fast! Thank you sir!
You are welcome
i'm having error 21:00 after create a middleware error: `source` does not start with / for route {"source":"login"}
Error: Invalid middleware found
sir the last part of video make me completely confused how that getuserdetails and the code written in helpers part how data is getting fetched how can i clear this doubt
Sir I had one query is it a good practice to do connect() on every API page or does it happen only once even if we call it multiple times on every page kinda like a Singleton class?
i have doubt is it completely okay to get started with mern stack development with no prior experience in full stack like php sql .. and all thaT
Thank you bro making this kind of awesome video, Bro could you please tell me which AI Autocompletion extension you used in your video?
What theme are you using?
From where are you getting the profile UI idea? 😂😂
Hey guys , i need your help i stuck on this error in AxiosError: Request failed with status code 404 when I click the getUserDetails button to fetch / display the id.
How do we fetch user data from a server component?
what select("-password") do? i think we findOne user by Id and grab all data and send throw request.json ..
I can't sent cookie through header from server components
I really like your video it help me alot❤❤
Hey hitesh, why I can't get the cookies like you get, I try several way, but I didn't get it , it's says always empty and I believe most to the dev get's error when they try to get the token value or maybe not,
but is there any one who get token like hitesh get
I found a security issue where you can type in the user can just put value name token and any value to sign in but i fixed it by verifying the token then redirecting i couldnt do the verifying in the middleware so i did it i the me route
bro thank you so much, i love you for this video. i like how you didnt use next auth and was helpful for me that wanted to build my custom login. i have a request also, can you do one for google login as well?
love your series
want more
thank you
sir i think there is an issue regarding the model, when i first fetch the id to profile it working fine and also when i visit the [id] it showing fine but when i go back and re click on the getdetail button in profile.tsx it is generating error which is saying like OverwriteModelError: Cannot overwrite `User` model once compiled.
It's because you are creating model everytime api calls..
can we use session instead of cookies. another thing i want to know that can anybody bypass the cookiee or is it secure?
Awesome! thank you!
What are your thoughts on zig language?
😅
there must be some issue bhaiya for every new user a have to close the nextjs application ,then to restart it.Same for verifying also.
how vs code is showing that all request details
love the series
Anyone please help me, I am doing same but token not saving in cookie storage
Thanks man u are the best
hey what;s the vs code theme name
Next Js does not support the bootstrap js library because of Server Side rendering can you provide a solution for It? The reason there are main things in Js library table search table HTML button which take massive time in tailwind
Try to use "use client" directive in the component where you want apply the bootstrap.
use client doesn't work because the js library applies on DOM so it gives a document not found error those solutions present in StackOverflow don't work for the next js upgraded to version 13.4
What extension is autocompleting you code ?
Copilot
Upload remaining videos also
Great job!!!!!!!!!
Do we have this course in learncodeonline??
I don’t own learncodeonline anymore. It’s sold.
bookmark
27:19
Awesome.
Thanks 🙏
Most welcome 😊
34:40 yeahhhh (yeahhh boy) 😂😂
👌👌👌
*process
👋👋👍👍
❤❤❤
❤
Thanks ❤
Welcome!
love from pakistan
🙏👍
oooooooppppssssss❤😂
💣💣💣 in a row 😅
Same for tomorrow
okay im leaving it : |
why?
@@morshedulislamriaad6496 I can't really understand it , so I'm going through my revisions of JS and React so understand it better
@@kushsharma862 Correct Choice! ❤
Error: The edge runtime does not support Node.js 'crypto' module getting this error in jwt.verify code
You didn't check If the jwt Token is valid or not like if I put anything with the name of token in the cookies I can login to the page.
I implemented that verifying token in my project like this you can modify as your need :
middleware.js :
import { NextResponse } from "next/server";
import { verifyJwtToken } from "./app/libs/auth";
export async function middleware(req) {
const token = req.cookies.get("jwt")?.value;
const path = req.nextUrl.pathname;
const isPublicPath = path === "/login" || path === "/register";
const verifiedToken =
token &&
(await verifyJwtToken(token).catch((err) => {
console.log(err);
}));
if (isPublicPath && token && verifiedToken) {
return NextResponse.redirect(new URL("/", req.nextUrl));
}
if (!isPublicPath && (!token || !verifiedToken)) {
return NextResponse.redirect(new URL("/login", req.nextUrl));
}
}
export const config = {
matcher: ["/login", "/register", "/"],
};
libs/auth.js : btw "jose" is a npm package that allows to verify the jwt token in the frontend and it returns true or false if the token is valid or not.
import { jwtVerify } from "jose";
export const getJwtSecretKey = () => {
const secret = process.env.JWT_SECRET;
if (!secret || secret.length === 0) {
throw new Error("The environment variable JWT_SECRET is not set.");
}
return secret;
};
export async function verifyJwtToken(token) {
try {
const verified = await jwtVerify(
token,
new TextEncoder().encode(getJwtSecretKey())
);
return verified.payload;
} catch (error) {
throw new Error("Your token is expired");
}
}
I have touched the verification part in “me” route.
Also, agree with your approach.
Bhaiya love the way you teach things thanks a lot🫡❤❤