Skip to main content

​
Quickstart guide

This guide will help you get MKing Admin up and running on your local machine in just a few minutes.

​
Prerequisites

Before you begin, ensure you have the following installed:
  • Node.js (version 16.x or higher recommended)
  • npm or yarn package manager
  • Git for cloning the repository

​
Quick setup

1

Clone the repository

Clone the MKing Admin repository to your local machine:
git clone <your-repository-url>
cd mking
2

Install dependencies

Install all required npm packages:
npm install
This will install all dependencies listed in package.json, including React 18.3, Material-UI 5.18, Redux Toolkit, and other required packages.
3

Configure environment variables

Create a .env file in the root directory by copying the example file:
cp .env.example .env
Update the .env file with your configuration:
VITE_APP_ENV=develop
VITE_BASE_URL=http://localhost:3008/api
Make sure your backend API is running and accessible at the URL specified in VITE_BASE_URL.
4

Start the development server

Launch the Vite development server:
npm run dev
The application will start on http://localhost:5000 by default.
5

Access the application

Open your browser and navigate to:
http://localhost:5000
You should see the MKing Admin login page.

​
Development server configuration

The Vite development server is configured with the following settings (from vite.config.ts:14-31):
  • Host: 0.0.0.0 - Allows access from local network
  • Port: 5000 - Default development port
  • HMR: Enabled with hot module replacement for instant updates
  • API Proxy: Requests to /api are proxied to http://localhost:3333

​
Verify your setup

Once the application is running, verify that:
  1. The login page loads without errors
  2. The console shows no critical errors (check browser DevTools)
  3. Hot Module Replacement (HMR) works when you edit files

​
Common issues

​
Port already in use

If port 5000 is already in use, you can change it in vite.config.ts: 
server: {
  port: 5001, // Change to any available port
  // ... other config
}

​
API connection errors

If you see API connection errors:
  1. Verify your backend API is running
  2. Check the VITE_BASE_URL in your .env file
  3. Ensure the proxy configuration in vite.config.ts matches your backend port

​
Module not found errors

If you encounter module errors after installation: 
# Clear node_modules and reinstall
rm -rf node_modules package-lock.json
npm install

​
Next steps

Now that you have MKing Admin running, you can:
  • Explore the codebase structure in src/
  • Review the Installation guide for detailed configuration options
  • Start customizing the application for your needs
For production builds, use npm run build or yarn build to create an optimized production bundle.

Build docs developers (and LLMs) love

Get started for freeTalk to us