https://github.com/spa5k/kratos-next

Ory Kratos Next.Js Self Service Ui Example on typescript
https://github.com/spa5k/kratos-next

kratos nextjs ory ory-kratos typescript

Last synced: 6 months ago
JSON representation

Ory Kratos Next.Js Self Service Ui Example on typescript

• Host: GitHub
• URL: https://github.com/spa5k/kratos-next
• Owner: spa5k
• Created: 2021-08-25T12:18:18.000Z (about 4 years ago)
• Default Branch: main
• Last Pushed: 2023-02-24T22:20:41.000Z (over 2 years ago)
• Last Synced: 2024-11-06T20:44:25.518Z (12 months ago)
• Topics: kratos, nextjs, ory, ory-kratos, typescript
• Language: TypeScript
• Homepage:
• Size: 342 KB
• Stars: 24
• Watchers: 0
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-ory - Ory Kratos Next.js self service UI
• awesome-ory - Ory Kratos Next.js self service UI

README

          
# Ory Kratos Next.Js Self Service Ui Example on typescript.

![kratos](public/kratosLogo.svg)

Extremely simple and minimal self service ui example on implementation of Kratos on Next.js without much abstraction for easier understanding of basic principles.

![sample](public/kratosMe.png)

## Steps.

1. Run the docker by doing `docker-compose up`.

2. It starts the Kratos server at `127.0.0.1:4433`.

3. Run the next js by doing `yarn dev`.

4. Open next js page on `127.0.0.1:3000`.

## Things to consider.

Remember that this example is using github oidc, so before starting it, add client secret and client id in [config](/config/kratos.yml) otherwise it won't start.

## Flows implemented.

- [x] Login

- [x] Register

- [x] Recovery

- [x] Verification

- [x] Dashboard

- [x] Oidc

### FAQs.

There are many things left to implement like unlinking and linking the accounts from settings, but that's out of the scope of this minimal example. I believe rest things can be easily implemented after reading the code.