Hello! I'm planning on writing an app with next.js...
# support-questions-legacy
k
Hello! I'm planning on writing an app with next.js on the frontend and nest.js on the backend. Is it possible to integrate supertokens in such app? I've seen that docs describe how to interact with both of these frameworks, but integration with next.js seems - at a quick glance - more like the app would be written purely in just next.js. So I was just wondering if such combination is possible? Thanks for replies in advance
r
Yup.
k
I started following the docs for integrating a Nestjs and it's rough here and there sometimes. I gathered all of what've stumbled upon.
https://supertokens.com/docs/passwordless/nestjs/guide#convert-to-a-dynamic-module Add an quote about auth middleware - I think this code example is initially confusing in general, as the middleware is undefined at the moment of reading the tutorial, and later in part 6. the tutorial explicitly states, that AuthModule should implement method and use the middleware https://supertokens.com/docs/passwordless/nestjs/guide#add-service-code I get a TS error for using private config: TS6138: Property  config  is declared but its value is never read. Changing private to protected worked. Might be due to my tsconfig though.
Also I feel that there's an error with how
nest g
is used, as the resulting file structure for me was:
Copy code
SRC
├───auth
│   ├───auth
│   ├───session
│   └───supertokens
// ...
This resulted in a lot of classes being moved to
/auth/auth
, meanwhile the docs imports them from the same level, for example take the middleware:
Copy code
ts
import { AuthMiddleware } from './auth.middleware';
whereas after tutorial it looks like this:
Copy code
ts
import { AuthMiddleware } from "./auth/auth.middleware";
Don't take this of course as some negative criticism. I just wanted to signal, that the docs here aren't 1:1 with the actual code. This problem is of a minor scale, as everything works and nothing is missing in the end
r
this is awesome @kuba_huba ! Thank you so much for this feedback. Will take a note :))
k
no problem:)
I have one more question - I wanted to setup a dashboard, so I've added a
Dashboard.init()
to the recipe list on the backend (nestjs) side. If I understand correctly, the dashboard should be available under
/auth/dashboard
, so in pair with the API host it will be
localhost:3000/auth/dashboard
for me. However only the html page is being loaded while scripts are not due to CSP
Alright, here's a solution for anyone who's going to read that in the future: if you're using helmet middleware then you have to specify CSP. The simplest way is to disable it for development and enable it for production. reference: https://github.com/graphql/graphql-playground/issues/1283 Whether this is a good or not - make your own judgement
I was just blind. It was just at the bottom of the docs
r
Thanks @kuba_huba
k
I just wanted to say thank you! I managed to get the authentication going in just a single day, and everything just works so far. Tested with a provided react frontend just to see if everything works and I'm delighted with how simple everything was. Also thanks for all the docs, especially the integration with Nest.js as I'm new to it
r
Great! Appreciate the kind feedback. And also, thanks for your feedback earlier
4 Views