DEV Community

Cover image for Next.js & Django JWT Authentication: Django REST, TypeScript, JWT, Wretch & Djoser

Next.js & Django JWT Authentication: Django REST, TypeScript, JWT, Wretch & Djoser

Mangabo Kolawole on February 12, 2024

If you're a software engineer, especially a full-stack developer, your job involves merging different technologies—like backend and frontend—to bui...
Collapse
 
rordrigo profile image
rodrigo

Hello! Thank you for the post. I have been working on a project which have the similar stack. I am currently trying to make the application server rendered application. So, for that it requires to fetch data in the server components. It is possible to fetch the data in the server components by also refreshing the access token and continuing the request in the server component as I am currently doing it in the client component. Is it possible to completely develop a server side next frontend app with external backend API. I have researched a lot about it and cant find the way to fetch the data and refresh the token in the server component. I am using iron-session to store the session but having difficulty in refreshing the access token and retrying the request with new token in the header. Once again thank you for the post, I am currently learning through internet and diifferent blogs. This one helped me a lot.

Collapse
 
koladev profile image
Mangabo Kolawole

Thank you for your comment @rordrigo

The pattern you are describing is possible but you will be passing the context every time to the server to retrieve the tokens.
Regarding the refresh logic, if we follow your proposed pattern, I believe that the refresh request will come from the server and I honestly do not see how you can set tokens from the server side ( I might be wrong.)

I think that it will be better to manage the refreshing on the client side unless I am missing an important implementation detail.

Collapse
 
rcmisk profile image
rcmisk

Love it!

Collapse
 
koladev profile image
Mangabo Kolawole

thank you @rcmisk

Collapse
 
serhii56465 profile image
Serhii Pastukhov

Hi! Thank you for your post.
I'm reading it now.
But I'm confused with this npm install wretch swr js-cookies react-hook-form, specifically with js-cookies.
Are you sure that we have to install js-cookies, but not js-cookie?

Collapse
 
koladev profile image
Mangabo Kolawole

Hi! this is definitely a typo. Let me correct it.

thank you!

Collapse
 
ismail212 profile image
Ismail • Edited

Hi, new learner here ! Thank you for this very useful tutorial. Can you please explain where the users data is stored once the user is registered? Isn't on the django backend or nextjs ?

Collapse
 
koladev profile image
Mangabo Kolawole

hi! it is on the Django backend. Next.js makes the HTTP request to the backend using wretch.

Collapse
 
ismail212 profile image
Ismail

Much appreciated ! Thanks