[Feature Request] docs: full express authentication example

[Eliav2]

I think this project is amazing. And the docs? We'll, beyond amazing! I really enjoyed reading the entire docs including your blogs, I learned a lot even as a senior Full-Stack developer.

You focus a lot on authorization, but not much on authentication. I would very much enjoy to read similar blog demonstrating implementing authentication using zenstack and backend framework such express or fastify, while explaining how to manage tokens and sessions with zenstack(with OAuth2 or email-password). And that's it, then your site would be really complete.

[ymc9]

I think this project is amazing. And the docs? We'll, beyond amazing! I really enjoyed reading the entire docs including your blogs, I learned a lot even as a senior Full-Stack developer.

You focus a lot on authorization, but not much on authentication. I would very much enjoy to read similar blog demonstrating implementing authentication using zenstack and backend framework such express or fastify, while explaining how to manage tokens and sessions with zenstack(with OAuth2 or email-password). And that's it, then your site would be really complete.

Hi @Eliav2 , thank you for the love for the project and blog. Your feedback is very encouraging, and we'll strive to continue creating value for the community!

Yes, lots of the content is focused on authorization. It's mainly because ZenStack is authentication-agnostic and it offers a simple and generic way to interface with any authentication system. However, I agree with you that for developers who seek content to help them build full-stack web apps they'll need both AuthN and AuthZ. I'll think about how to better cover both sides in future content. Thank you!

[Eliav2]

Hey @ymc9 The main struggle for me was that most of the examples using Authjs using next, while our requirement was decoupled frontend and backend. This means fastify or express for the backend, and Authjs does not support express or fastify in stable way yet(I tried. Too many bugs). And there is no example for express authentication with SSO

However I was able to get it right in the end. Using express+passport with sso for github on the backend and react on the frontend. I would like to offer this template as additional example. it is not public app, but I can extract the relevant part as an starter template "zenstack--express-passport-sso--react"

[ymc9]

Hey @ymc9 The main struggle for me was that most of the examples using Authjs using next, while our requirement was decoupled frontend and backend. This means fastify or express for the backend, and Authjs does not support express or fastify in stable way yet(I tried. Too many bugs). And there is no example for express authentication with SSO

However I was able to get it right in the end. Using express+passport with sso for github on the backend and react on the frontend. I would like to offer this template as additional example. it is not public app, but I can extract the relevant part as an starter template "zenstack--express-passport-sso--react"

Hi @Eliav2 , yes, such a sample will be very helpful! I believe many people use ZenStack in projects with decoupled frontend and backend. If you have it, I'd love to link to it in the README and doc site. Thank you!

[Eliav2]

hey @ymc9 i've created good template for decoupled frontend and backend monorepo.

backend: zenstack+express+sso github auth
frontend: react+tanstack-query+tanstack-rotuer+mui5 on vite devserver

also smart mapping are done on vite.config.ts and tsconfig.json files to flawless importing behavior on the client side. This template is made from actual project that was stripped down to include only the common use cases when starting new project.

here https://github.com/Eliav2/zenstack-warehouse-demo

this template can be awesome starting point for people looking for using zenstack with express backend with sso authentication

[ymc9]

hey @ymc9 i've created good template for decoupled frontend and backend monorepo.

backend: zenstack+express+sso github auth frontend: react+tanstack-query+tanstack-rotuer+mui5 on vite devserver

also smart mapping are done on vite.config.ts and tsconfig.json files to flawless importing behavior on the client side. This template is made from actual project that was stripped down to include only the common use cases when starting new project.

here https://github.com/Eliav2/zenstack-warehouse-demo

this template can be awesome starting point for people looking for using zenstack with express backend with sso authentication

Thanks for working on this, @Eliav2 ! It looks pretty nice. I'll link to it in the docs. It'll be very helpful for folks who want a similar architecture.

Quick question: I see there are two zmodel schemas in the backend project. The dev one is not needed, right?

[Eliav2]

absolutely right. just removed it😁. i just re-checked and removed anything that was unnecessary for the template, if you see anything unnecessary let me know

[Eliav2]

I'm closing this issue as you linked my repo at the docs @ymc9

Thanks