Coder Social home page Coder Social logo

tdltdl / keycloak-theme-govuk Goto Github PK

View Code? Open in Web Editor NEW

This project forked from officeforproductsafetyandstandards/keycloak-theme-govuk

0.0 0.0 0.0 4.4 MB

A Keycloak theme using GOV.UK Template and Elements

License: MIT License

FreeMarker 93.08% JavaScript 5.09% CSS 1.83%

keycloak-theme-govuk's Introduction

keycloak-theme-govuk

A Keycloak theme using GOV.UK Template and Elements.

Using

This theme has been deployed to the UK Home Office hosting platform Keycloak Docker container. To use it in your Keycloak realm:

  1. Sign into your realm's admin console.

  2. Go to the “Themes” tab in “Realm Settings”

  3. Select “govuk” as your login theme, and click on “Save”

The theme will now be used for all Keycloak log in screens on your realm - including logging in to the admin console. If you sign out, you should see the GOV.UK themed log in screen.

Developing

Building

The theme can be built using the following commands:

$ npm install
$ npm run build

The theme will then be built at /govuk, ready for use in the local Keycloak server.

Local Keycloak server

A local Keycloak server for developing and testing the theme is available as a Docker container.

To bring up the server, make sure you’ve installed and started Docker Community Edition, then use the following commands:

$ npm install
$ npm run build
$ docker-compose up

The Keycloak server will now be available on http://localhost:8080. You can log into the Administration Console using “admin” as both username and password.

To enable the GOV.UK theme in the local Keycloak server, follow steps 2 and 3 in the “Using” section above.

You will now see the GOV.UK theme when logging into the local Keycloak server. Changes made to the theme files in /govuk will be visible on the local Keycloak server when you refresh the page in your browser.

Testing Keycloak e-mails

The local Keycloak server includes MailDev, a mock SMTP server that you can use to receive and view Keycloak e-mails. It is available on http://localhost:8081.

To set up the local Keycloak server to send e-mails to MailDev:

  1. Log in to the local Keycloak server.

  2. Go to the “Email” tab in “Realm Settings”

  3. Enter the following details:

    • Host: maildev

    • From: keycloak@keycloak

  4. Click on “Save”

  5. Click on “Admin” in the top-right-hand corner of the page, and click on “Manage Account”

  6. Add an e-mail address to the admin account.

    It doesn’t matter what e-mail address you add, as all e-mails will be caught by MailDev. But you do need to add one, otherwise Keycloak will not send e-mails for this account.

The local Keycloak server should now be set up to send e-mails to MailDev. To check that it’s working:

  1. Click on the “Back to Security Admin Console” link

  2. Click on the “Login” tab in “Realm Settings”

  3. Enable “Forgot password”, and click on “Save”

  4. Sign out.

  5. On the Keycloak log in screen, click on the “Forgot your password?” link

  6. Enter your username (admin) in the text field, and submit the form.

  7. Visit MailDev. You should see a reset password e-mail from Keycloak.

Releasing

The theme can be packaged for release using the following command:

$ npm install
$ npm run build
$ npm run dist

The theme will then be packaged at /govuk.tar.gz.

TODO: deploying to the UK Home Office hosting platform Keycloak Docker container. (i.e. ask for a new Docker Keycloak image to be built and deployed to Kubernetes on https://github.com/UKHomeOffice/hosting-platform-bau/issues)

keycloak-theme-govuk's People

Contributors

paulwaitehomeoffice avatar daniel-ac-martin avatar tom-bell-softwire avatar raamsoftwire avatar kicferk1 avatar jasiekmiko avatar broder avatar pauldwaite avatar tiagosusanopinto avatar gambol99 avatar edwardhorsford avatar robinknipe avatar slorek avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.