S
SolidJS•4d ago
ken_binta

Best approach to having protected routes in SolidJs?

Hello, I'm working on securing certain routes in my application to ensure they are protected if a user is not logged in. There are about 10-15 pages that need to be restricted. I'm currently using Better-Auth for authentication and have switched to client-side rendering only for now.
6 Replies
ken_binta
ken_bintaOP•3d ago
Also I am using an external API, and using axios to fetch data
peerreynders
peerreynders•3d ago
Typically you want to create a route layout which verifies authentication and redirects to /login when not authenticated while all the protected routes are nested within the “protected” layout.
zulu
zulu•3d ago
https://docs.solidjs.com/solid-start/advanced/auth
Auth - SolidDocs
Documentation for SolidJS, the signals-powered UI framework
zulu
zulu•3d ago
No description
zulu
zulu•3d ago
peerreynders
peerreynders•3d ago
Example: 
|-- routes/
  |-- (protected).tsx // layout checks auth
  |-- (protected)     // protected routes inside
    |-- index.tsx     // example.com (protected)
    |-- user
      |-- [id].tsx    // example.com/user/{id} (prot)
  |-- login.tsx       // example.com/login (not)
  |-- about
    |-- index.tsx     // example.com/about (not)
|-- routes/
  |-- (protected).tsx // layout checks auth
  |-- (protected)     // protected routes inside
    |-- index.tsx     // example.com (protected)
    |-- user
      |-- [id].tsx    // example.com/user/{id} (prot)
  |-- login.tsx       // example.com/login (not)
  |-- about
    |-- index.tsx     // example.com/about (not)
- Route Groups - Nested Layouts - Nested Routes keywords: protected file system routes

Did you find this page helpful?