keycloakify-custom/README.md

67 lines
1.9 KiB
Markdown
Raw Normal View History

2022-09-06 17:22:23 +00:00
<p align="center">
2024-06-06 07:12:34 +00:00
<i>🚀 <a href="https://keycloakify.dev">Keycloakify</a> v10 starter 🚀</i>
2023-03-17 14:05:28 +00:00
<br/>
<br/>
2022-09-06 17:22:23 +00:00
</p>
2024-06-06 03:26:06 +00:00
This starter is based on Vite. There is also [a Webpack based starter](https://github.com/keycloakify/keycloakify-starter-cra).
2022-09-06 17:22:23 +00:00
# Quick start
```bash
2023-04-20 00:22:43 +00:00
git clone https://github.com/keycloakify/keycloakify-starter
cd keycloakify-starter
2024-06-07 03:20:57 +00:00
yarn install
# Generate the dist_keycloak/.jar file that you can import in Keycloak
yarn build-keycloak-theme
2022-09-06 17:22:23 +00:00
```
2024-06-06 07:12:34 +00:00
# Storybook
2023-04-17 00:58:17 +00:00
```bash
2024-06-06 07:12:34 +00:00
npx keycloakify add-story # Select the pages you want to add stories for
yarn storybook # Start Storybook
2023-04-17 00:58:17 +00:00
```
2024-06-06 07:12:34 +00:00
# Test in a real Keycloak environment
2022-09-06 17:22:23 +00:00
2024-06-06 07:12:34 +00:00
Test your theme in a local Keycloak docker container.
2022-09-06 17:22:23 +00:00
```bash
2024-06-06 07:12:34 +00:00
npx keycloakify start-keycloak
2022-09-06 17:22:23 +00:00
```
2024-06-06 07:12:34 +00:00
# Advanced customization
2022-09-06 17:22:23 +00:00
2024-06-07 03:20:57 +00:00
The starter only enables you to implement CSS level customization. To take full ownership
of some pages use the command:
2022-09-06 17:22:23 +00:00
```bash
2024-06-06 07:12:34 +00:00
npx keycloakify eject-page
2022-09-06 17:22:23 +00:00
```
2024-06-06 07:42:01 +00:00
# GitHub Actions
2024-06-07 03:20:57 +00:00
The starter comes with a generic GitHub Actions workflow that builds the theme and publishes
2024-06-06 07:42:01 +00:00
the jars [as GitHub releases artifacts](https://github.com/keycloakify/keycloakify-starter/releases/tag/v7.1.0).
2024-06-07 03:20:57 +00:00
To release a new version **just update the `package.json` version and push**.
To enable the workflow go to your fork of this repository on GitHub then navigate to:
`Settings` > `Actions` > `Workflow permissions`, select `Read and write permissions`.
2024-06-06 07:42:01 +00:00
# Removing the account theme
If you don't need to customize [the account theme pages](https://storybook.keycloakify.dev/?path=/story/account-account--default).
2024-06-07 03:20:57 +00:00
You can remove the `src/account` directory.
2024-06-06 07:42:01 +00:00
This will significantly reduce the the size of the jar and the build time.
2024-06-07 03:20:57 +00:00
Don't forget to update `src/main.tsx` and `src/vite-env.d.ts`.
2024-06-06 07:42:01 +00:00
# Email theme
Keycloakify lets you bundle an email theme however customization can't be made with React yet.
2024-06-07 03:20:57 +00:00
To initialize the email theme run:
2024-06-06 07:42:01 +00:00
```bash
npx keycloakify initialize-email-theme
```