REIW Posts - Answer Overflow

REIW

•Created by REIW on 5/6/2025 in #help

Passing types along from Hono to Next

We are exploring using Hono as a BFF for our next.js app, which works well in our monorepo, however the types generated on the Hono server are not being passed over the wire to next.js. Can anyone point me in the right direction of what to explore. hono server which has data typed correctly.

app.get('/:siteSlug/get-products-by-market', async (c) => {
  const siteSlug = c.req.param('siteSlug');

  const { data, success } = await getProductsByMarket({
    siteSlug,
  });

  if (success) {
    return c.json({ data, success });
  }
});

app.get('/:siteSlug/get-products-by-market', async (c) => {
  const siteSlug = c.req.param('siteSlug');

  const { data, success } = await getProductsByMarket({
    siteSlug,
  });

  if (success) {
    return c.json({ data, success });
  }
});

function to fetch the data

export async function fetchFromBFF<T>({
  action,
  siteSlug,
}: FetchFromBFF): Promise<T> {
  try {
    const response = await fetch(
      `http://localhost:1234/api/${siteSlug}/${action}`,
    );
    const result = response.json();
    return result as T;
  } catch (error) {
    console.log(error);
    throw Error;
  }
}

export async function fetchFromBFF<T>({
  action,
  siteSlug,
}: FetchFromBFF): Promise<T> {
  try {
    const response = await fetch(
      `http://localhost:1234/api/${siteSlug}/${action}`,
    );
    const result = response.json();
    return result as T;
  } catch (error) {
    console.log(error);
    throw Error;
  }
}

consuming the data in next.js with the data coming as untyped (Property 'data' does not exist on type 'unknown'.)

const {
    data: productsByMarketData,
    success,
  } = await fetchFromBFF({
    action: 'get-products-by-market',
    siteSlug,
  });

const {
    data: productsByMarketData,
    success,
  } = await fetchFromBFF({
    action: 'get-products-by-market',
    siteSlug,
  });

11 replies

Gaming

Programming