Get your React admin template up and running in minutes with this comprehensive installation guide.

• Operating System: Windows 10+, macOS 10.14+, or Linux
• Memory: 4GB RAM minimum, 8GB recommended
• Storage: 2GB free space for node_modules and build artifacts

If you need to install or update Node.js:

# Using Node Version Manager (recommended)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
nvm install 20.19.0
nvm use 20.19.0

# Or download from official website
# https://nodejs.org/

1. Clone or Extract the Template

   If you received the template as a ZIP file:

   # Extract the ZIP file to your desired location
   unzip verta-react-admin-template.zip
   cd verta-react-admin-template

2. Install Dependencies

   We recommend using pnpm for faster installs and better dependency management:

   # Install pnpm globally (if not already installed)
   npm install -g pnpm
   
   # Install project dependencies
   pnpm install

3. Start Development Server

   # Start the development server
   pnpm dev
   
   # Server will be available at:
   # http://localhost:9000

4. Verify Installation

   Open your browser and navigate to http://localhost:9000. You should see the React admin dashboard login page.

Here are the essential commands for React template development:

# Development
pnpm dev          # Start dev server at localhost:9000
pnpm dev --host   # Expose server on network

# Build & Quality
pnpm build        # Create production build
pnpm preview      # Preview production build locally
pnpm check        # Run TypeScript type checking
pnpm lint         # Run ESLint code analysis

Port Already in Use

# If port 5173 is busy, specify a different port:
pnpm dev --port 3000

Node Version Compatibility

# Check if your Node.js version is compatible:
node --version  # Should be 20.19.0 or higher

# If version is too old, update:
nvm install 20.19.0
nvm use 20.19.0

Dependency Installation Failures

# Clear cache and reinstall:
pnpm store prune
rm -rf node_modules pnpm-lock.yaml
pnpm install

Faster Development Builds

# Enable Vite optimizations in vite.config.ts:
export default defineConfig({
optimizeDeps: {
  include: ['react', 'react-dom', 'react-router-dom']
},
build: {
  rollupOptions: {
    output: {
      manualChunks: {
        vendor: ['react', 'react-dom'],
        router: ['react-router-dom']
      }
    }
  }
}
})

Once installation is complete, explore the template structure:

Your React admin template is now ready for development! 🎉