This is a documentation of the processes and technologies used to develop an application using a microservice achitecture with keycloak IAM, krakenD api gateway, django for apis and nextjs as a frontend.
The architecture used in the MICROSERVICE ARCHTECTURE
The above mentioned architecture calls for the use of a separate authentication service. In this project, KEYCLOAK is being used for that purpose.
Also KRAKEND is being used as an API gateway.
Together these two services complete the authentication and authorization architecture for this project.
This sample project is comprised of a sample service (a django rest api backend with sample endpoints) and a nextjs frontend application that should consume the api. We will be using docker to run the projects as it is in the /project/docker-compose.yml
file. All configurations are in the /project/config/*
folder.
- django service => https://github.com/jackkweyunga/drf_oidc_example
- nextjs 13 frontent => https://github.com/jackkweyunga/nextjs-keycloack-example
Make sure docker is installed in your machine Docker installation.
git clone
cd project
docker compose up -d
Got to your system hosts files and add an entry to map keycloak
as a local domain name that resolves to 127.0.0.1
. Below is an example in windows.
-
Got to the keycloack instance at => http://localhost:8080 .
-
Login with credentials below;
- username:
admin
- password:
admin
- username:
-
Once inside, create a new real by importing a sample realm
the-ream
found in./project/config/keycloak/realm-export.json
-
After the import is successful, two clients [
ms-frontend
andsvc1
] will be available in a real calledthe-real
. -
Within the real got to the client page for
ms-frontend
andsvc1
and regenerate the client secrete. Copy the client secrets and replace with the ones in/project/config/frontend/.env
and/project/config/service1/.env
respectively.- Restart the project with command
docker compose up -d
to enact the changes.
- Restart the project with command
-
With in this realm, create a user with whom you will login in to the frontend. Remember to set the password for this user.
Go to the frontend application at => http://localhost:4000 . Once there you'll see the request made to the public endpoint of the django service backed via the krakenD api gateway. Finally click the login link to be redirected to the kecloak instance for authentication. After authentication, the protected pages of the frontend will accessible.
If everything works correctly, you should be able to see the following in the frontend;