Scribd
Upload
488 views6 pages

Keycloak Documentation

The document provides instructions for installing and configuring Keycloak for authentication on React and Nestjs applications. For React, developers need to install Keycloak dependencies, setup the Keycloak instance, and wrap the app with the Keycloak provider. For Nestjs, developers need to install Keycloak dependencies, create a Keycloak module, and can either create a custom strategy or use AuthGuard for token validation and authentication. The document also provides reference links for more information on securing apps with Keycloak.

Uploaded by

Yonas
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
488 views6 pages

Keycloak Documentation

The document provides instructions for installing and configuring Keycloak for authentication on React and Nestjs applications. For React, developers need to install Keycloak dependencies, setup the Keycloak instance, and wrap the app with the Keycloak provider. For Nestjs, developers need to install Keycloak dependencies, create a Keycloak module, and can either create a custom strategy or use AuthGuard for token validation and authentication. The document also provides reference links for more information on securing apps with Keycloak.

Uploaded by

Yonas
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Keycloak Installation and Configuration

1 Download keycloak

2. Setup keycloak server

3. Create realm
4. Create Client
5. Create Role
NOTE: To be continued . . .

Keycloak Configuration on React

1. Install dependencies

❖ @react-keycloak/web
❖ Keycloak-js

2. Setup Keycloak instance with keycloak configuration containing

❖ Realm
❖ Client Id
❖ Server URL
❖ Secret, and more to be added if necessary

3. Wrap the app with Keycloak Provider

4. Create a login page component or Use built-in login page from keycloak

Keycloak Configuration on Nestjs

1. Install dependencies

❖ nest-keycloak-connect
❖ passport
❖ @nestjs/passport
❖ Passport-keycloak

2. Create Keycloak Module with the keycloak configuration containing


❖ Realm
❖ Client Id
❖ Server URL
❖ Secret, and more to be added if necessary

3. Create keycloak strategy or use AuthGuard to validate token

❖ Both can be used to validate tokens and authentications with both having their pros and cons.
❖ Keycloak Strategy: You can create a custom strategy by extending the KeycloakStrategy class.
This approach provides more flexibility and allows you to implement a complex and flexible
authentication process.
❖ AuthGuard: provided by nestjs-keycloak. This approach offers simplicity, convenience, and
requires less code. The AuthGuard handles token validation and authentication automatically.

4. Protect Routes

Reference

• https://medium.com/devops-dudes/secure-nestjs-rest-api-with-keycloak-745ef32a2370
• https://www.javahabit.com/2023/03/14/Securing-react-app-keycloak/
• Github Repo: https://github.com/dasniko/keycloak-reactjs-demo

You might also like