Mock Server

We provide some simple examples on how to set up a mock API so you can work in your localhost.

Usage in Localhost

Step 1: Download resource

Download resource inside the README.md or MOCK_API.md.

next-ts
  ├── README.md
  ├── ...

Minimal_Typescript
  ├── MOCK_API.md
  ├── ...

Step 2: Start local server

Start project minimal-api-dev folder.
Make sure you are running on the correct port http://localhost:7272.

Change port

DEV_API: "http://localhost:7272",

next.config.mjs

Change port

"dev": "next dev -p 7272",
"start": "next start -p 7272",

package.json

Install and run

yarn install
yarn dev

Step 3: Update .env in your current project:

next.js
vite.js
starter-next-ts
starter-vite-ts
...

VITE_SERVER_URL=http://localhost:7272
VITE_ASSET_URL=http://localhost:7272

next.js, vite.js...

Usage on Production

Step 1:

Push source code minimal-api-dev to your github.
Deploy on your vercel.com.

Step 2:

In next.config.mjs of minimal-api-dev.

const nextConfig = {
reactStrictMode: true,
  env: {
    DEV_API: 'http://localhost:7272',
    PRODUCTION_API: 'https://your-domain-api.vercel.app',
  },
};
 
export default nextConfig;

next.config.mjs

Step 3: Update .env in your current project:

next.js
vite.js
starter-next-ts
starter-vite-ts
...

VITE_SERVER_URL=https://your-domain-api.vercel.app
VITE_ASSET_URL=https://your-domain-api.vercel.app

vite-js, next-js...