Modern, Responsive Bootstrap Dashboard Template – Astero Admin

Astero Admin is a free, open-source Bootstrap admin template that provides a set of pre-built components and a development workflow to help you build modern dashboards and admin panels from scratch.

Key Features:

• Built on the latest Bootstrap framework with a clean, professional UI design
• Complete responsiveness across all devices and screen sizes
• Integrated light and dark mode with one-click switching
• Advanced build system with parallel processing
• Modular architecture with well-organized SCSS and JS components
• Five authentication design systems
• RTL language support
• Over 3,000 icons
• Logical folder structure for efficient development

Installation

1. npm (My Preferred Method):

For most projects, I’d go with the npm route. It integrates best with modern build tools.

npm install asteroadmin

Then, import the necessary CSS and JavaScript into your project:

// Import CSS
import 'asteroadmin/dist/css/style.css'

// Import JavaScript (if needed)
import 'asteroadmin/dist/js/main.js'

2. CDN:

Quick and easy for testing or simple projects. Just add these to your HTML:

<!-- CSS -->
<link href="https://cdn.jsdelivr.net/npm/asteroadmin@latest/dist/css/style.min.css" rel="stylesheet">

<!-- JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/asteroadmin@latest/dist/js/main.min.js" type="module"></script>

You can also include specific files or versions, for example:

• CSS: https://cdn.jsdelivr.net/npm/asteroadmin@1.0.2/dist/css/style.min.css
• JavaScript: https://cdn.jsdelivr.net/npm/asteroadmin@1.0.2/dist/js/main.min.js

Keep in mind that using @latest might introduce breaking changes unexpectedly. For production, I’d strongly recommend specifying a version.

3. Cloning the Repository:

Clone the repo from GitHub:

git clone https://github.com/asterodigital/bootstrap-admin-template.git
cd bootstrap-admin-template
npm install

Start the development server:

npm run dev

This sets up the full development environment, running at http://localhost:1234.

Working with the Build System

# Start development with hot reloading
npm run dev

# Build for production
npm run build

# Compile SCSS to CSS
npm run css

# Bundle JavaScript files
npm run js

# Process static assets
npm run assets

# Check code quality
npm run lint

# Fix linting issues
npm run fixlint

# Format HTML files
npm run format:html

# Clean build artifacts
npm run clean

# Watch for file changes
npm run watch

# Serve built files locally
npm run serve

The post Modern, Responsive Bootstrap Dashboard Template – Astero Admin appeared first on CSS Script.