SPA & Custom API

[alelor01]

Hi,

I have a React SPA and a HapiJS (Node) API.

I’ve managed to get authentication working on the React app, by following the built-in guide on the Auth0 dashboard. I haven’t got authorisation working on the API yet but I think that’s mostly on my end, so would be do-able.

I was trying to setup environment variables on React app, when I was reminded that values won’t be secret on an SPA.

Whilst I assume this has already been thought of and that exposing the client ID and domain may not be the end of the world, I would still like to handle everything on the API side.

I keep getting lost and confused in all of the documentation. I did come across this doc, which I think outlines the flow I want.

How do I do this?

My questions:

1. Do I need to represent the SPA with an Auth0 application?
2. Do I need to represent the API with an Auth0 API or an Auth0 application?
3. Is my current implementation okay anyway?
4. What is the recommended setup and flow for a custom SPA and API like this?
5. Can you recommend specific documentation for this?

Thanks,
Alex

[tyf]

Hey @alelor01 welcome to the community!

I definitely recommend checking out our architecture scenarios documentation for a high level overview:

Single-Page Applications (SPA) with API

1. Yes, you should create a SPA type application to represent your frontend application.
2. You will want to register an API in Auth0 to represent your API itself.
3. Your approach seems good to me - Although I am not sure how you would handle a React SPA API side.
4. The recommend set up is outlined in the architecture scenarios documentation I linked above.
5. Our React quickstart and subsequent sample app as well as this guide should be helpful as well!

Hope this helps!