2020-11-15 21:42:02 +00:00
|
|
|
import React from "react";
|
|
|
|
|
import clsx from "clsx";
|
|
|
|
|
import Layout from "@theme/Layout";
|
|
|
|
|
import Link from "@docusaurus/Link";
|
2023-05-31 10:51:45 +00:00
|
|
|
import Head from "@docusaurus/Head";
|
2021-04-19 15:25:26 +00:00
|
|
|
import BrowserOnly from "@docusaurus/core/lib/client/exports/BrowserOnly";
|
2020-11-15 21:42:02 +00:00
|
|
|
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
|
|
|
|
|
import useBaseUrl from "@docusaurus/useBaseUrl";
|
|
|
|
|
import styles from "./styles.module.css";
|
2023-07-27 09:44:50 +00:00
|
|
|
import Comparison from "../components/Comparison";
|
2022-05-09 19:22:41 +00:00
|
|
|
import "react-before-after-slider-component/dist/build.css";
|
2023-07-27 09:44:50 +00:00
|
|
|
import { NewsBar } from "../components/NewsBar";
|
|
|
|
|
import { TextSlide } from "../components/TextSlide";
|
2020-11-15 21:42:02 +00:00
|
|
|
|
|
|
|
|
function Feature({ imageUrl, title, description }) {
|
|
|
|
|
const imgUrl = useBaseUrl(imageUrl);
|
|
|
|
|
return (
|
|
|
|
|
<div className={clsx("col col--4", styles.feature)}>
|
|
|
|
|
{imgUrl && (
|
|
|
|
|
<div className="text--center">
|
|
|
|
|
<img
|
|
|
|
|
className={styles.featureImage}
|
|
|
|
|
src={imgUrl}
|
|
|
|
|
alt={title}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
)}
|
|
|
|
|
<h3>{title}</h3>
|
|
|
|
|
<p>{description}</p>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function Home() {
|
|
|
|
|
const context = useDocusaurusContext();
|
|
|
|
|
const { siteConfig = {} } = context;
|
|
|
|
|
return (
|
|
|
|
|
<Layout title="Welcome" description={siteConfig.tagline}>
|
2023-05-31 10:51:45 +00:00
|
|
|
<Head>
|
|
|
|
|
<meta
|
|
|
|
|
name="go-import"
|
|
|
|
|
content="goauthentik.io git https://github.com/goauthentik/authentik"
|
|
|
|
|
></meta>
|
|
|
|
|
</Head>
|
2020-11-15 21:42:02 +00:00
|
|
|
<header className={clsx("hero hero--primary", styles.heroBanner)}>
|
|
|
|
|
<div className="container">
|
2023-07-27 09:44:50 +00:00
|
|
|
<div className={clsx("row", styles.headerRow)}>
|
2020-11-15 21:42:02 +00:00
|
|
|
<div className="col padding-top--lg">
|
2023-07-27 09:44:50 +00:00
|
|
|
<h1
|
|
|
|
|
className={clsx(
|
|
|
|
|
"hero__title",
|
|
|
|
|
styles.ak_hero__title,
|
|
|
|
|
)}
|
|
|
|
|
>
|
|
|
|
|
<div>Replace</div>
|
|
|
|
|
<TextSlide
|
|
|
|
|
words={[
|
|
|
|
|
"Active Directory",
|
|
|
|
|
"Okta",
|
|
|
|
|
"Auth0",
|
|
|
|
|
]}
|
|
|
|
|
></TextSlide>
|
|
|
|
|
<div>with a unified platform.</div>
|
2020-11-15 21:42:02 +00:00
|
|
|
</h1>
|
|
|
|
|
<p className="hero__subtitle">
|
2023-09-01 14:52:13 +00:00
|
|
|
Unify all of your identity needs into a single
|
|
|
|
|
platform
|
2020-11-15 21:42:02 +00:00
|
|
|
</p>
|
|
|
|
|
<div className={styles.buttons}>
|
|
|
|
|
<Link
|
|
|
|
|
className={clsx(
|
2023-07-27 09:44:50 +00:00
|
|
|
"button button--outline button--primary button--lg",
|
2020-11-15 21:42:02 +00:00
|
|
|
)}
|
2021-12-13 17:57:13 +00:00
|
|
|
to={useBaseUrl("docs/installation/")}
|
2020-11-15 21:42:02 +00:00
|
|
|
>
|
|
|
|
|
Get Started
|
|
|
|
|
</Link>
|
2023-07-27 09:44:50 +00:00
|
|
|
<Link
|
|
|
|
|
className={clsx(
|
|
|
|
|
"button button--outline button--primary button--lg",
|
|
|
|
|
)}
|
|
|
|
|
to="#comparison"
|
|
|
|
|
>
|
|
|
|
|
Reasons to switch
|
|
|
|
|
</Link>
|
2020-11-15 21:42:02 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2023-07-27 09:44:50 +00:00
|
|
|
<div
|
|
|
|
|
className={clsx(
|
|
|
|
|
"col text--center",
|
|
|
|
|
styles.heroImage,
|
|
|
|
|
styles.hiddenOnMobile,
|
|
|
|
|
)}
|
|
|
|
|
>
|
2022-05-09 19:22:41 +00:00
|
|
|
<img
|
|
|
|
|
alt="authentik logo"
|
2023-09-15 16:31:46 +00:00
|
|
|
src={useBaseUrl("img/landing_login_card.png")}
|
2022-05-09 19:22:41 +00:00
|
|
|
/>
|
2020-11-15 21:42:02 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</header>
|
|
|
|
|
<main>
|
|
|
|
|
<section className={styles.features}>
|
|
|
|
|
<div className="container">
|
2023-07-27 09:44:50 +00:00
|
|
|
<div className={clsx("row", styles.row)}>
|
|
|
|
|
<Feature
|
|
|
|
|
title="Easy to use"
|
|
|
|
|
description={
|
|
|
|
|
<>
|
|
|
|
|
Identity made easy. authentik makes
|
|
|
|
|
single-sign on (SSO), user enrollment,
|
|
|
|
|
and access control simple.
|
|
|
|
|
</>
|
|
|
|
|
}
|
|
|
|
|
/>
|
|
|
|
|
<Feature
|
|
|
|
|
title="Realize your workflow"
|
|
|
|
|
description={
|
|
|
|
|
<>
|
|
|
|
|
authentik lets you build your workflow
|
|
|
|
|
as you need it, no limitations.
|
|
|
|
|
</>
|
|
|
|
|
}
|
|
|
|
|
/>
|
|
|
|
|
<Feature
|
|
|
|
|
title="Powered by Python"
|
|
|
|
|
description={
|
|
|
|
|
<>
|
|
|
|
|
Implement custom verification or access
|
|
|
|
|
control logic using Python code.
|
|
|
|
|
</>
|
|
|
|
|
}
|
|
|
|
|
/>
|
2020-11-15 21:42:02 +00:00
|
|
|
</div>
|
2023-07-27 09:44:50 +00:00
|
|
|
</div>
|
|
|
|
|
<div
|
|
|
|
|
className={clsx(
|
|
|
|
|
"row",
|
|
|
|
|
styles.rowDark,
|
|
|
|
|
styles.rowFullWidth,
|
|
|
|
|
styles.newsBar,
|
|
|
|
|
styles.hiddenOnMobile,
|
|
|
|
|
)}
|
|
|
|
|
>
|
|
|
|
|
<div className="container">
|
|
|
|
|
<NewsBar />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="container">
|
|
|
|
|
<div className={clsx("row", styles.row)}>
|
2020-11-15 21:42:02 +00:00
|
|
|
<div className="col col--5">
|
2023-07-27 09:44:50 +00:00
|
|
|
<BrowserOnly>
|
|
|
|
|
{() => {
|
|
|
|
|
const ReactBeforeSliderComponent = require("react-before-after-slider-component");
|
|
|
|
|
return (
|
|
|
|
|
<ReactBeforeSliderComponent
|
|
|
|
|
firstImage={{
|
|
|
|
|
id: 1,
|
|
|
|
|
imageUrl: useBaseUrl(
|
|
|
|
|
"img/landing_screen_apps_dark.jpg",
|
|
|
|
|
),
|
|
|
|
|
}}
|
|
|
|
|
secondImage={{
|
|
|
|
|
id: 2,
|
|
|
|
|
imageUrl: useBaseUrl(
|
|
|
|
|
"img/landing_screen_apps_light.jpg",
|
|
|
|
|
),
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
);
|
|
|
|
|
}}
|
|
|
|
|
</BrowserOnly>
|
2020-11-15 21:42:02 +00:00
|
|
|
</div>
|
|
|
|
|
<div className="col col--5 col--offset-2 padding-vert--xl">
|
2020-12-05 21:08:42 +00:00
|
|
|
<h2>What is authentik?</h2>
|
2020-11-15 21:42:02 +00:00
|
|
|
<p>
|
2022-05-09 19:22:41 +00:00
|
|
|
authentik is an open-source Identity
|
|
|
|
|
Provider focused on flexibility and
|
|
|
|
|
versatility. You can use authentik in an
|
|
|
|
|
existing environment to add support for new
|
|
|
|
|
protocols, implement sign-up/recovery/etc.
|
|
|
|
|
in your application so you don't have to
|
|
|
|
|
deal with it, and many other things.
|
2020-11-15 21:42:02 +00:00
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2023-07-27 09:44:50 +00:00
|
|
|
<div className={clsx("row", styles.row)}>
|
2020-12-05 21:08:42 +00:00
|
|
|
<div className="col col--5 col--offset-2 padding-vert--xl">
|
2020-12-29 19:17:35 +00:00
|
|
|
<h2>Utmost flexibility</h2>
|
2020-12-05 21:08:42 +00:00
|
|
|
<p>
|
|
|
|
|
You can adopt authentik to your environment,
|
2022-05-09 19:22:41 +00:00
|
|
|
regardless of your requirements. Need an
|
|
|
|
|
Active-Directory integrated SSO Provider? Do
|
|
|
|
|
you want to implement a custom enrollment
|
|
|
|
|
process for your customers? Are you
|
|
|
|
|
developing an application and don't want to
|
|
|
|
|
deal with User verification and recovery?
|
2020-12-05 21:08:42 +00:00
|
|
|
authentik can do all of that, and more!
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="col col--5">
|
2023-07-27 09:44:50 +00:00
|
|
|
<BrowserOnly>
|
|
|
|
|
{() => {
|
|
|
|
|
const ReactBeforeSliderComponent = require("react-before-after-slider-component");
|
|
|
|
|
return (
|
|
|
|
|
<ReactBeforeSliderComponent
|
|
|
|
|
firstImage={{
|
|
|
|
|
id: 1,
|
|
|
|
|
imageUrl: useBaseUrl(
|
|
|
|
|
"img/landing_screen_admin_dark.jpg",
|
|
|
|
|
),
|
|
|
|
|
}}
|
|
|
|
|
secondImage={{
|
|
|
|
|
id: 2,
|
|
|
|
|
imageUrl: useBaseUrl(
|
|
|
|
|
"img/landing_screen_admin_light.jpg",
|
|
|
|
|
),
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
);
|
|
|
|
|
}}
|
|
|
|
|
</BrowserOnly>
|
2020-12-05 21:08:42 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2020-11-15 21:42:02 +00:00
|
|
|
</div>
|
|
|
|
|
</section>
|
2021-03-18 21:02:04 +00:00
|
|
|
<section>
|
2023-07-27 09:44:50 +00:00
|
|
|
<div className="container">
|
|
|
|
|
<Comparison></Comparison>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
<section>
|
|
|
|
|
<div
|
|
|
|
|
className={clsx(
|
|
|
|
|
styles.footerCTA,
|
|
|
|
|
styles.rowAuthentik,
|
|
|
|
|
styles.rowFullWidth,
|
|
|
|
|
)}
|
|
|
|
|
>
|
|
|
|
|
<h1>Try authentik now!</h1>
|
|
|
|
|
<div className={styles.buttons}>
|
|
|
|
|
<Link
|
|
|
|
|
className={clsx(
|
|
|
|
|
"button button--outline button--primary button--lg",
|
|
|
|
|
)}
|
|
|
|
|
to={useBaseUrl("docs/installation/")}
|
|
|
|
|
>
|
|
|
|
|
Get Started
|
|
|
|
|
</Link>
|
|
|
|
|
<Link
|
|
|
|
|
className={clsx(
|
|
|
|
|
"button button--outline button--primary button--lg",
|
|
|
|
|
)}
|
|
|
|
|
to={useBaseUrl("pricing/")}
|
|
|
|
|
>
|
|
|
|
|
Learn about enterprise
|
|
|
|
|
</Link>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2021-03-18 21:02:04 +00:00
|
|
|
</section>
|
2020-11-15 21:42:02 +00:00
|
|
|
</main>
|
|
|
|
|
</Layout>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default Home;
|
