Skip to content

Extrapolate – AI Aging App

Age transformation AI app powered by Next.js, Replicate, Upstash, and Cloudflare R2 + Workers.

Framework
Use Case
Database
Publisher Steven Tey

Introduction

Extrapolate is an app for you to see how well you age by transforming your face with Artificial Intelligence. 100% free and privacy friendly.

Features

Deploy Your Own

You can deploy this template to Vercel with the button below:

Note that you'll need to:

Cloudflare R2 setup instructions

  1. Go to Cloudflare and create an R2 bucket.
  2. Create a Cloudflare Worker using the code snippet below.
  3. Bind your worker to your R2 instance under Settings > R2 Bucket Bindings.
  4. For extra security, set an AUTH_KEY_SECRET variable under Settings > Environment Variables (you can generate a random secret here).
  5. Replace all instances of images.extrapolate.workers.dev in the codebase with your Cloudflare Worker endpoint.
// Check requests for a pre-shared secret
const hasValidHeader = (request, env) => {
  return request.headers.get('X-CF-Secret') === env.AUTH_KEY_SECRET;
};

function authorizeRequest(request, env, key) {
  switch (request.method) {
    case 'PUT':
    case 'DELETE':
      return hasValidHeader(request, env);
    case 'GET':
      return true
    default:
      return false;
  }
}

export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    const key = url.pathname.slice(1);

    if (!authorizeRequest(request, env, key)) {
      return new Response('Forbidden', { status: 403 });
    }

    switch (request.method) {
      case 'PUT':
        await env.MY_BUCKET.put(key, request.body);
        return new Response(`Put ${key} successfully!`);
      case 'GET':
        const object = await env.MY_BUCKET.get(key);

        if (object === null) {
          return new Response('Object Not Found', { status: 404 });
        }

        const headers = new Headers();
        object.writeHttpMetadata(headers);
        headers.set('etag', object.httpEtag);

        return new Response(object.body, {
          headers,
        });
      case 'DELETE':
        await env.MY_BUCKET.delete(key);
        return new Response('Deleted!');

      default:
        return new Response('Method Not Allowed', {
          status: 405,
          headers: {
            Allow: 'PUT, GET, DELETE',
          },
        });
    }
  },
};

Author

Extrapolate – AI Aging App

Age transformation AI app powered by Next.js, Replicate, Upstash, and Cloudflare R2 + Workers.

Framework
Use Case
Database
Publisher Steven Tey

Introduction

Extrapolate is an app for you to see how well you age by transforming your face with Artificial Intelligence. 100% free and privacy friendly.

Features

Deploy Your Own

You can deploy this template to Vercel with the button below:

Note that you'll need to:

Cloudflare R2 setup instructions

  1. Go to Cloudflare and create an R2 bucket.
  2. Create a Cloudflare Worker using the code snippet below.
  3. Bind your worker to your R2 instance under Settings > R2 Bucket Bindings.
  4. For extra security, set an AUTH_KEY_SECRET variable under Settings > Environment Variables (you can generate a random secret here).
  5. Replace all instances of images.extrapolate.workers.dev in the codebase with your Cloudflare Worker endpoint.
// Check requests for a pre-shared secret
const hasValidHeader = (request, env) => {
  return request.headers.get('X-CF-Secret') === env.AUTH_KEY_SECRET;
};

function authorizeRequest(request, env, key) {
  switch (request.method) {
    case 'PUT':
    case 'DELETE':
      return hasValidHeader(request, env);
    case 'GET':
      return true
    default:
      return false;
  }
}

export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    const key = url.pathname.slice(1);

    if (!authorizeRequest(request, env, key)) {
      return new Response('Forbidden', { status: 403 });
    }

    switch (request.method) {
      case 'PUT':
        await env.MY_BUCKET.put(key, request.body);
        return new Response(`Put ${key} successfully!`);
      case 'GET':
        const object = await env.MY_BUCKET.get(key);

        if (object === null) {
          return new Response('Object Not Found', { status: 404 });
        }

        const headers = new Headers();
        object.writeHttpMetadata(headers);
        headers.set('etag', object.httpEtag);

        return new Response(object.body, {
          headers,
        });
      case 'DELETE':
        await env.MY_BUCKET.delete(key);
        return new Response('Deleted!');

      default:
        return new Response('Method Not Allowed', {
          status: 405,
          headers: {
            Allow: 'PUT, GET, DELETE',
          },
        });
    }
  },
};

Author

Unleash New Possibilities

Deploy your app on Vercel and unlock its full potential

Try Vercel Free