https://github.com/limone-eth/lemon-frame

Lemon Frame
https://github.com/limone-eth/lemon-frame

Last synced: 1 day ago
JSON representation

Lemon Frame

• Host: GitHub
• URL: https://github.com/limone-eth/lemon-frame
• Owner: limone-eth
• License: mit
• Created: 2024-01-28T21:20:44.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-01-28T21:47:46.000Z (9 months ago)
• Last Synced: 2024-04-14T02:12:57.302Z (7 months ago)
• Language: TypeScript
• Homepage: https://lemon-frame.vercel.app
• Size: 1.9 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-frames - Simple Lemon frame

README

        
# A Frame in 100 lines (or less)

Farcaster Frames in less than 100 lines, and ready to be deployed to Vercel.

Have fun! ⛵️

## Files

### `app/page.tsx`

```tsx

import { getFrameMetadata } from '@coinbase/onchainkit';

import type { Metadata } from 'next';

const frameMetadata = getFrameMetadata({

  buttons: ['Next image'],

  image: 'https://zizzamia.xyz/park-1.png',

  post_url: 'https://zizzamia.xyz/api/frame',

});

export const metadata: Metadata = {

  title: 'zizzamia.xyz',

  description: 'LFG',

  openGraph: {

    title: 'zizzamia.xyz',

    description: 'LFG',

    images: ['https://zizzamia.xyz/park-1.png'],

  },

  other: {

    ...frameMetadata,

  },

};

export default function Page() {

  return (

    <>

      
zizzamia.xyz

    >

  );

}

```


### `app/layout.tsx`

```tsx

export const viewport = {

  width: 'device-width',

  initialScale: 1.0,

};

export default function RootLayout({ children }: { children: React.ReactNode }) {

  return (

    

      {children}

    

  );

}

```

### `app/api/frame/route.ts`

```ts

import { getFrameAccountAddress } from '@coinbase/onchainkit';

import { NextRequest, NextResponse } from 'next/server';

async function getResponse(req: NextRequest): Promise {

  let accountAddress = '';

  try {

    const body: { trustedData?: { messageBytes?: string } } = await req.json();

    accountAddress = await getFrameAccountAddress(body, { NEYNAR_API_KEY: 'NEYNAR_API_DOCS' });

  } catch (err) {

    console.error(err);

  }

  return new NextResponse(`

    

    

    

    

  `);

}

export async function POST(req: NextRequest): Promise {

  return getResponse(req);

}

export const dynamic = 'force-dynamic';

```

## Resources

- [Official Farcaster Frames docs](https://warpcast.notion.site/Farcaster-Frames-4bd47fe97dc74a42a48d3a234636d8c5)

## License

This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details

# lemon-frame

# lemon-frame