Mock server

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

The online demo API can be disabled at any time. To avoid interruptions during work, you should host your own API server according to the instructions below

Usage in Localhost

Watch video

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...