> ## Documentation Index
> Fetch the complete documentation index at: https://docs.bawabah.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Introduction

> Welcome to Bawabah Documentation

## Pre-Requirements

Before starting to use Bawabah, you have to have:

1. Bawabah Developer Account (Create if you don't have one at: [https://bawabah.app/dev/login](https://bawabah.app/dev/login)).
2. Node.js Version 18+ (Download from here: [https://nodejs.org/en/download](https://nodejs.org/en/download)).

<Card title="Ready To Start?" icon="rocket" horizontal href="/getting-started/en/quickstart">
  Navigate to Quick Start.
</Card>

## How Does it Work?

<img src="https://mintcdn.com/iehasa/3HrAqnpWMbH53XXh/images/quickstart/bawabah-login-flow-en.png?fit=max&auto=format&n=3HrAqnpWMbH53XXh&q=85&s=c97262175d4bf3457b92f2c883ef2177" alt="Bawabah Login Flow" title="Bawabah Login Flow" className="diagram mx-auto" style={{ width:"71%" }} width="1496" height="1544" data-path="images/quickstart/bawabah-login-flow-en.png" />

## Documentation Structure

<Steps>
  <Step title="Introduction" icon="book" iconType="solid">
    Implementation Preparation + Requirements.
  </Step>

  <Step title="Quick Start" icon="rocket" iconType="solid">
    To Start Quickly, with minimal setup needed.
  </Step>

  <Step title="Development" icon="code" iconType="solid">
    Learn how to implement the Login Flow with well-explained examples and diagrams.
  </Step>

  <Step title="Examples" icon="flask" iconType="solid">
    The best way to Learn is By Example.
  </Step>
</Steps>

<Columns cols={2}>
  <Card title="Quick Start" icon="rocket" iconType="regular" href="/getting-started/en/quickstart">
    Navigate to Quick Start.
  </Card>

  <Card title="Hosted Login" icon="page" href="/development/en/hosted">
    Leading Login Solution.
  </Card>

  <Card title="Form Login" icon="envelope" href="/development/en/form">
    Customize Bawabah login form on your website.
  </Card>

  <Card title="Examples" icon="flask" href="/examples/en">
    Code implementation Examples.
  </Card>
</Columns>
