> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: About Auto Patterns

## Article: About Auto Patterns

## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/design/auto-patterns/about-auto-patterns.md

## Article Content:

# About Auto Patterns
<blockquote class="caution">

__Alpha:__
The [AI app builder](https://dev.wix.com/docs/build-apps/develop-your-app/build-with-ai/about-the-ai-app-builder.md) is currently in alpha. This feature is subject to change and may have bugs, issues, and limitations. We're actively improving it based on your feedback.

</blockquote>


Auto Patterns is a configuration-driven library that helps you build dashboard pages for your Wix apps. Instead of manually building dashboards with React components, you define everything in a JSON configuration file that conforms to the [`AppConfig` type](#the-appconfig-type). 

Auto Patterns is built on top of [Patterns](https://www.wix-pages.com/wix-patterns/), an advanced component library that extends the [Wix Design System](https://dev.wix.com/docs/build-apps/develop-your-app/design/about-the-wix-design-system.md) and provides reusable React components. Auto Patterns uses these components and configures them automatically based on your configuration file, handling the connections between components, hooks, and providers so you can skip manual setup. 

This configuration-driven approach reduces development time, simplifies maintenance, and makes the app experience more intuitive and predictable.

## The patterns.json file

The `patterns.json` file is a JSON file that defines the structure, style, and behavior of your dashboard pages.

## The AppConfig type

`AppConfig` is a TypeScript type that defines the structure and format of your dashboard configuration. The `patterns.json` file conforms to this type, ensuring your configuration matches the expected format.

Auto Patterns supports a wide range of components and features for customizing your dashboard pages that are defined as an `AppConfig` type. For a complete list of available features, see [About Auto Patterns Features](https://dev.wix.com/docs/build-apps/develop-your-app/design/auto-patterns/about-auto-patterns-features.md).

## The AutoPatternsApp component

The `AutoPatternsApp` component renders your dashboard based on configuration you provide.

## Usage

Import your configuration from `patterns.json` and pass it to the `AutoPatternsApp` component as the `configuration` prop:

```tsx
import React, { type FC } from 'react';
import { WixDesignSystemProvider } from '@wix/design-system';
import '@wix/design-system/styles.global.css';
import { WixPatternsProvider } from '@wix/patterns/provider';
import { PatternsWizardOverridesProvider, AutoPatternsApp, type AppConfig } from '@wix/auto-patterns';
import { withDashboard } from '@wix/patterns';
import config from './patterns.json';

const CollectionPage: FC = () => {
  return (
    <WixDesignSystemProvider features={{ newColorsBranding: true }}>
      <WixPatternsProvider>
        <PatternsWizardOverridesProvider value={{}}>
          <AutoPatternsApp configuration={config as AppConfig} />
        </PatternsWizardOverridesProvider>
      </WixPatternsProvider>
    </WixDesignSystemProvider>
  );
};

export default withDashboard(CollectionPage);
```

## See also

- [About Auto Patterns Features](https://dev.wix.com/docs/build-apps/develop-your-app/design/auto-patterns/about-auto-patterns-features.md)
- [Get started with the AI app builder](https://dev.wix.com/docs/build-apps/develop-your-app/build-with-ai/get-started-with-the-ai-app-builder.md)
- [About the AI app builder](https://dev.wix.com/docs/build-apps/develop-your-app/build-with-ai/about-the-ai-app-builder.md)