Kratos Self Service UI With React Example

For anyone that’s interested I’ve made some good progress on a kratos-selfservice-ui-node React clone. You can view it here.

Some quick architecture notes:

  • For simplicity, NGINX is used instead of Oathkeeper
  • Browser checks for isAuthenticated flag in local storage before attempting to set authentication session, preventing multiple unnecessary API calls
  • isAuthenticated flag is set on the callback route, which the user is redirected to after a login or registration
  • Headers are not available to React, so only the cookie based security method is available

A couple of todo’s for now, but it looks pretty good:

  • Implement error page
  • Implement session refresh
  • Implement configurable Kratos config
  • Investigate Kratos client bundle size
  • OIDC support
3 Likes

Awesome!