Data fetching and Mock Server

REST API

For data fetching in the next.js app follow this documentation Data fetching (opens in a new tab)

axios is used for calling the api, you can use any library you want.

API Function

// utils/__api__
const recentPurchase = async () => {
  const response = await axios.get('/api/recent-purchase')
  return response.data
}

API Function Call from Page

import api from 'utils/__api__/vendor'
 
export default async function Reviews() {
  const reviews = await api.getAllProductReviews()
  return <ReviewsPageView reviews={reviews} />
}

Mock server

Note

We used mock server for demo purpose. You need to remove this from the template and integrate your API.
Remove MockEndPoints from utils/axiosInstance.ts

// utils/axiosInstance.ts
 
// Remove following 2 lines
export const Mock = new MockAdapter(axiosInstance);
MockEndPoints(Mock);

Fake API example

// src/__server__/__db__/market-2/index.ts
 
// get all categories
Mock.onGet('/api/market-2/category').reply(() => {
  try {
    return [200, db.categories]
  } catch (err) {
    console.error(err)
    return [500, { message: 'Internal server error' }]
  }
})

Icons Market 1