> ## Documentation Index
> Fetch the complete documentation index at: https://docs.crefy.xyz/llms.txt
> Use this file to discover all available pages before exploring further.
# Quick Start
> Get started with Crefy Connect in minutes
# Quick Start
Get Crefy Connect integrated into your application in just a few steps.
## Installation
Install Crefy Connect from npm:
```bash theme={null}
npm install crefy-connect
```
or
```bash theme={null}
yarn add crefy-connect
```
or
```bash theme={null}
pnpm add crefy-connect
```
or
```bash theme={null}
bun add crefy-connect
```
## 🪪 Get Your Crefy Connect App ID
Before integrating Crefy Connect, you'll need an App ID - this uniquely identifies your project when connecting users and managing authentication.
Visit [Crefy Connect Dashboard](https://connect.crefy.xyz/) to get started.
Create a new account or sign in to your existing account.
Click on "Create New Application" in your dashboard.
Fill in your application details (name, description, etc.).
Once created, copy your App ID - you'll use it inside the `CrefyConnectProvider`.
## Usage
### 1️⃣ Vite.js + TypeScript
**main.tsx**
```tsx theme={null}
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import { CrefyConnectProvider } from "crefy-connect";
import "./index.css";
ReactDOM.createRoot(document.getElementById("root")!).render(
);
```
**App.tsx**
```tsx theme={null}
import { AuthModal } from "crefy-connect";
export default function App() {
return (
);
}
```
### 2️⃣ Next.js 13+ (App Router)
**app/layout.tsx**
```tsx theme={null}
"use client";
import { CrefyConnectProvider } from "crefy-connect";
import "./globals.css";
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
{children}
);
}
```
**app/page.tsx**
```tsx theme={null}
"use client";
import { AuthModal } from "crefy-connect";
export default function Home() {
return (
Crefy Connect Example
);
}
```
## Next Steps
Learn about provider configuration and props.
Customize the authentication modal component.
Access authentication state and user details.
Send ETH and interact with the blockchain.
**Need help?** Check our [GitHub Issues](https://github.com/crefy/crefy-connect/issues) or join our [Discord](https://discord.gg/crefy).