README.md.clerk

# Clerk Authentication Setup

This project uses [Clerk](https://clerk.com/) for authentication. Follow these steps to set up Clerk in your local development environment:

## Setup Instructions

1. **Install Dependencies**
   
   The project already includes `@clerk/nextjs` in the package.json. Run the following command to install all dependencies:
   
   ```bash
   npm install
   ```

2. **Environment Variables**
   
   Create a `.env.local` file in the root of the project with the following variables:
   
   ```
   NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_publishable_key_here
   CLERK_SECRET_KEY=your_secret_key_here
   ```
   
   You can get these keys from your Clerk dashboard after creating a project.

3. **Clerk Configuration**
   
   The project is already configured with Clerk:
   
   - `middleware.ts` at the root of the project uses `clerkMiddleware()` from `@clerk/nextjs/server`
   - `app/layout.tsx` wraps the application with `<ClerkProvider>`
   - The Navbar component uses Clerk authentication UI components (`SignInButton`, `SignUpButton`, `UserButton`)

4. **Start the Development Server**
   
   ```bash
   npm run dev
   ```

5. **Testing Authentication**
   
   Once the development server is running, you can test the authentication by:
   
   - Clicking the Sign In or Sign Up buttons in the navbar
   - Creating an account or signing in
   - After signing in, you should see the UserButton in the navbar

## Additional Resources

- [Clerk Documentation](https://clerk.com/docs)
- [Clerk Next.js Quickstart](https://clerk.com/docs/quickstarts/nextjs)