Instuction about how to integrate with non CRA projects
This commit is contained in:
parent
055263a3da
commit
a8daf175ea
41
README.md
41
README.md
@ -44,6 +44,8 @@ Here is `keycloakify` for you 🍸
|
|||||||
<img src="https://user-images.githubusercontent.com/6702424/114332075-c5e37900-9b45-11eb-910b-48a05b3d90d9.gif">
|
<img src="https://user-images.githubusercontent.com/6702424/114332075-c5e37900-9b45-11eb-910b-48a05b3d90d9.gif">
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
**TL;DR**: [Here](https://github.com/garronej/keycloakify-demo-app) is a Hello World React project with Keycloakify set up.
|
||||||
|
|
||||||
*NOTE: No autocomplete here just because it was an incognito window.*
|
*NOTE: No autocomplete here just because it was an incognito window.*
|
||||||
|
|
||||||
If you already have a Keycloak custom theme, it can be easily ported to Keycloakify.
|
If you already have a Keycloak custom theme, it can be easily ported to Keycloakify.
|
||||||
@ -52,6 +54,8 @@ If you already have a Keycloak custom theme, it can be easily ported to Keycloak
|
|||||||
|
|
||||||
|
|
||||||
- [Motivations](#motivations)
|
- [Motivations](#motivations)
|
||||||
|
- [Requirements](#requirements)
|
||||||
|
- [My framework doesn’t seem to be supported, what can I do?](#my-framework-doesnt-seem-to-be-supported-what-can-i-do)
|
||||||
- [How to use](#how-to-use)
|
- [How to use](#how-to-use)
|
||||||
- [Setting up the build tool](#setting-up-the-build-tool)
|
- [Setting up the build tool](#setting-up-the-build-tool)
|
||||||
- [Changing just the look of the default Keycloak theme](#changing-just-the-look-of-the-default-keycloak-theme)
|
- [Changing just the look of the default Keycloak theme](#changing-just-the-look-of-the-default-keycloak-theme)
|
||||||
@ -61,7 +65,6 @@ If you already have a Keycloak custom theme, it can be easily ported to Keycloak
|
|||||||
- [Support for Terms and conditions](#support-for-terms-and-conditions)
|
- [Support for Terms and conditions](#support-for-terms-and-conditions)
|
||||||
- [Some pages still have the default theme. Why?](#some-pages-still-have-the-default-theme-why)
|
- [Some pages still have the default theme. Why?](#some-pages-still-have-the-default-theme-why)
|
||||||
- [GitHub Actions](#github-actions)
|
- [GitHub Actions](#github-actions)
|
||||||
- [Requirements](#requirements)
|
|
||||||
- [Limitations](#limitations)
|
- [Limitations](#limitations)
|
||||||
- [`process.env.PUBLIC_URL` not supported.](#processenvpublic_url-not-supported)
|
- [`process.env.PUBLIC_URL` not supported.](#processenvpublic_url-not-supported)
|
||||||
- [`@font-face` importing fonts from the `src/` dir](#font-face-importing-fonts-from-thesrc-dir)
|
- [`@font-face` importing fonts from the `src/` dir](#font-face-importing-fonts-from-thesrc-dir)
|
||||||
@ -71,9 +74,29 @@ If you already have a Keycloak custom theme, it can be easily ported to Keycloak
|
|||||||
- [Kickstart video](#kickstart-video)
|
- [Kickstart video](#kickstart-video)
|
||||||
- [Email domain whitelist](#email-domain-whitelist)
|
- [Email domain whitelist](#email-domain-whitelist)
|
||||||
|
|
||||||
# How to use
|
# Requirements
|
||||||
|
|
||||||
**TL;DR**: [Here](https://github.com/garronej/keycloakify-demo-app) is a Hello World React project with Keycloakify set up.
|
Tested with the following Keycloak versions:
|
||||||
|
- [11.0.3](https://hub.docker.com/layers/jboss/keycloak/11.0.3/images/sha256-4438f1e51c1369371cb807dffa526e1208086b3ebb9cab009830a178de949782?context=explore)
|
||||||
|
- [12.0.4](https://hub.docker.com/layers/jboss/keycloak/12.0.4/images/sha256-67e0c88e69bd0c7aef972c40bdeb558a974013a28b3668ca790ed63a04d70584?context=explore)
|
||||||
|
|
||||||
|
This tool will be maintained to stay compatible with Keycloak v11 and up, however, the default pages you will get
|
||||||
|
(before you customize it) will always be the ones of Keycloak v11.
|
||||||
|
|
||||||
|
This tool assumes you are bundling your app with Webpack (tested with 4.44.2) .
|
||||||
|
It assumes there is a `build/` directory at the root of your react project directory containing a `index.html` file
|
||||||
|
and a `build/static/` directory generated by webpack.
|
||||||
|
For more information see [this issue](https://github.com/InseeFrLab/keycloakify/issues/5#issuecomment-832296432)
|
||||||
|
## My framework doesn’t seem to be supported, what can I do?
|
||||||
|
|
||||||
|
Currently Keycloakify is only compatible with `create-react-app` apps.
|
||||||
|
It doesn’t mean that you can't use Keycloakify if you are using Next.js, Express or any other
|
||||||
|
framework that involves SSR but your Keycloak theme will need to be a standalone project.
|
||||||
|
Find specific instructions about how to get started [**here**](https://github.com/garronej/keycloakify-demo-app#keycloak-theme-only).
|
||||||
|
|
||||||
|
To share your styles between your main app and your login pages you will need to externalize your design system by making it a
|
||||||
|
separate module. Checkout [ts_ci](https://github.com/garronej/ts_ci), it can help with that.
|
||||||
|
# How to use
|
||||||
## Setting up the build tool
|
## Setting up the build tool
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
@ -258,18 +281,6 @@ for the `login-otp.ftl` page. You can use it as a model for implementing other p
|
|||||||
[Here is a demo repo](https://github.com/garronej/keycloakify-demo-app) to show how to automate
|
[Here is a demo repo](https://github.com/garronej/keycloakify-demo-app) to show how to automate
|
||||||
the building and publishing of the theme (the .jar file).
|
the building and publishing of the theme (the .jar file).
|
||||||
|
|
||||||
# Requirements
|
|
||||||
|
|
||||||
Tested with the following Keycloak versions:
|
|
||||||
- [11.0.3](https://hub.docker.com/layers/jboss/keycloak/11.0.3/images/sha256-4438f1e51c1369371cb807dffa526e1208086b3ebb9cab009830a178de949782?context=explore)
|
|
||||||
- [12.0.4](https://hub.docker.com/layers/jboss/keycloak/12.0.4/images/sha256-67e0c88e69bd0c7aef972c40bdeb558a974013a28b3668ca790ed63a04d70584?context=explore)
|
|
||||||
|
|
||||||
This tool will be maintained to stay compatible with Keycloak v11 and up, however, the default pages you will get
|
|
||||||
(before you customize it) will always be the ones of Keycloak v11.
|
|
||||||
|
|
||||||
This tool assumes you are bundling your app with Webpack (tested with 4.44.2) .
|
|
||||||
It assumes there is a `build/` directory at the root of your react project directory containing a `index.html` file
|
|
||||||
and a `build/static/` directory generated by webpack.
|
|
||||||
|
|
||||||
**All this is defaults with [`create-react-app`](https://create-react-app.dev)** (tested with 4.0.3)
|
**All this is defaults with [`create-react-app`](https://create-react-app.dev)** (tested with 4.0.3)
|
||||||
|
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "keycloakify",
|
"name": "keycloakify",
|
||||||
"version": "1.0.2",
|
"version": "1.0.3",
|
||||||
"description": "Keycloak theme generator for Reacts app",
|
"description": "Keycloak theme generator for Reacts app",
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
Loading…
x
Reference in New Issue
Block a user