What Single Page App example do you want to see for ORY Kratos?

Unfortunately we don’t give out timelines for open source projects. We will probably start with some documentation first.

1 Like

Sure,

I do work on React, happy to have a look and help before ready for public consumption if it’s useful for you guys

2 Likes

I’m a React developer but maybe is better to leave things simple in that case. I would suggest VanillaJS or jQuery just to understand the concept: watch network requests and which info we must save in local storage. I can help to write with some guidance.

I really cant wait to see that example! when more or less it will be released ? Is there any way to contribute ?

I have a one more question, login/registration forms will be coded in react or app will be redirecting to the kratos login page ?

They will be coded in react

1 Like

vuejs!

1 Like

I’m actually working on an example React implementation if anyone is interested in taking a look: https://github.com/ellioseven/kratos-ss-ui-react/tree/master

3 Likes

:tada:

That’s a great example! But I just wonder how you develop locally when using React? I encounter lots of CORS problems when I develop my frontend. When developing, the frontend and Kratos must be in the different origins right? So I just wondering if there are any CORS settings in Kratos to walkaround it

I’m build a JAMstack app with Sapper and will try integrating Kratos into it. I’d be willing to publish a plug and play example/template of the basic flow of the app that you could use as an example. (Perhaps in exchange for some support if I get stuck with something Kratos specific :slight_smile:)

This is definitely not good for a main example, as Svelte is still not widely adopted, but as it’s a rapidly growing frontend framework (fourth by growth rate on github, right after react, angular and vue) and there’s no good, plug and play, full stack and open source identity service setup for it around.

It could be a decent source of exposure to your project, and very useful to have in the OSS community.

2 Likes

Any one made an working Angular example ? I have included kratos-client in my package.json but when i initialized new PublicApi() i had error "Uncaught TypeError: Cannot read property ‘prototype’ of undefined " , tks for helping me
Note: im using Angular 9

It would be just super! Can I take a look at your repository?

Yes, that sounds great!

We would definitely publish this in some form if you get it done :slight_smile: .
Or you publish it somewhere else and we link to it in the documentation.

Thanks for sharing. To be clear: is this (going to be) the official react implementation or is this a community led one?

(in any case, super helpful)

In the example I use a simple NGINX reverse proxy so that all services live under the same origin. This prevents any CORS related problems.

The React example is just something I made and thought I’d share with the community. It seems like ORY have created their own empty official repository.

Yes, we’re working on a react and react native reference implementation :slight_smile:

1 Like

This is what I did these days

https://github.com/UkonnRa/doorknob-react

2 Likes

That looks great, I’m using svelte with SSR but this is very helpful (thank you).
Edit: do you think we could improve the UX if this was a universal app? Example:

user: press registration/login button
client: xhr request to server on custom route (domain/api/registration|login)
server: request to “/.ory/kratos/public/self-service/browser/flows/registration|login” on behalf of user in order to get redirect_url and request-id + additional checks
client: receives response from server with either an error or a url + request-id and renders the form if it’s the same site, otherwise redirects to the redirect location.

I think of going this way but seems like a lot of glue code to write. Do you see any obvious security issues with this?

1 Like