NextJS

6min
Introduction
You can use NextJS API paths to define and expose your Cross-Chain﻿  Sherry Link and publish it on Vercel (or other provider).
Next.js provides built-in API routes, making it an excellent choice for projects that combine frontend and backend functionality.
Initial Setup
Create a new Next.js project
terminal
npx create-next-app@latest mini-app-metadata
cd mini-app-metadata
npx create-next-app@latest mini-app-metadata
cd mini-app-metadata
﻿
Install the SDK
npm
yarn
yarn add @sherrylinks/sdk
yarn add @sherrylinks/sdk
﻿
Open the project in your preferred editor. For example VSCode
terminal
code .
code .
﻿
Creating the Endpoint
Navigate to the pages/api/example folder and create a file named route.ts
For educational purposes, we use "Access-Control-Allow-Origin": "*", but in a production environment, you must restrict allowed origins to the official Sherry domains: staging.sherry.social and app.sherry.social.This enhances the security of your infrastructure and prevents potential unnecessary costs caused by unauthorized requests.
route.ts
corsHeaders
import { NextResponse } from "next/server";
import { createMetadata, ValidatedMetadata } from "@sherrylinks/sdk"
import { corsHeaders } from "./corsHeaders";
import { Metadata, TransferAction } from "@sherrylinks/sdk";

const actions: TransferAction[] = [
    {
        label: "0.01 CELO",
        recipientAddress: "0x5b1869D9A4C187F2EAa108f3062412ecf0526b24",
        amount: 0.01,
        chainId: "alfajores",
    },
    {
        label: "1 CELO",
        recipientAddress: "0x5b1869D9A4C187F2EAa108f3062412ecf0526b24",
        amount: 1,
        chainId: "alfajores",
    },
    {
        label: "SENT",
        chainId: "alfajores",
    }
]
const metadataOne: Metadata = {
    type: "action",
    url: "https://sherry.social/links",
    icon: "https://static.wixstatic.com/media/7b3ce2_d54b9f54f27f4575859f8de232835658~mv2.gif",
    title: "Sent me a tip to CELO",
    description: "Send me a tip to show your appreciation for my work",
    actions: actions
};

export async function GET() {
    try {
        const metadataResponse: ValidatedMetadata = createMetadata(metadataOne);
        return NextResponse.json(metadataResponse, { status: 200, headers: corsHeaders });
    } catch (error) {
        return NextResponse.json(error, { status: 500 });

    }
}
import { NextResponse } from "next/server";
import { createMetadata, ValidatedMetadata } from "@sherrylinks/sdk"
import { corsHeaders } from "./corsHeaders";
import { Metadata, TransferAction } from "@sherrylinks/sdk";

const actions: TransferAction[] = [
    {
        label: "0.01 CELO",
        recipientAddress: "0x5b1869D9A4C187F2EAa108f3062412ecf0526b24",
        amount: 0.01,
        chainId: "alfajores",
    },
    {
        label: "1 CELO",
        recipientAddress: "0x5b1869D9A4C187F2EAa108f3062412ecf0526b24",
        amount: 1,
        chainId: "alfajores",
    },
    {
        label: "SENT",
        chainId: "alfajores",
    }
]
const metadataOne: Metadata = {
    type: "action",
    url: "https://sherry.social/links",
    icon: "https://static.wixstatic.com/media/7b3ce2_d54b9f54f27f4575859f8de232835658~mv2.gif",
    title: "Sent me a tip to CELO",
    description: "Send me a tip to show your appreciation for my work",
    actions: actions
};

export async function GET() {
    try {
        const metadataResponse: ValidatedMetadata = createMetadata(metadataOne);
        return NextResponse.json(metadataResponse, { status: 200, headers: corsHeaders });
    } catch (error) {
        return NextResponse.json(error, { status: 500 });

    }
}
﻿
Save the file and start the development server:
http://localhost:3000/api/example
Deploying to Production
Deploy your project to Vercel﻿
One deployed, the metadata endpoint will be accesible at a URL like:
https://your-domain.vercel.app/api/example
Catching Errors
In the example we have implemented a try-catch to catch any run-time errors. You can create an  instance of all the errors﻿  that could occur during the execution of createMetadata. 
Updated 30 Jan 2025
Did this page help you?
Cross-Chain
Smart Contracts