Get started with AdminKit in no time. Learn how to detect file changes, start a dev-server and compile the files with Webpack.
The theme includes a custom Webpack file, which can be used to quickly recompile and minify theme assets while developing or for deployment. You’ll need to install Node.js before using Webpack.
Once Node.js is installed, clone our repo (or download AdminKit PRO) and run
npm install to install the rest of AdminKit’s dependencies. All dependencies will be downloaded to the
Now you’re ready to modify the source files and generate new
dist/ files. AdminKit is using webpack and webpack-dev-server to automatically detect file changes and start a local webserver at
# serve with hot reload at localhost:8080 $ npm start # detect file changes without starting a local webserver $ npm run watch # compile, optimize, minify and uglify all source files to /dist $ npm run build
This starter template can be used as a guideline for how to structure new pages while using AdminKit. Some meta tags and our CSS & JS files are included inside the template.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <title>AdminKit</title> <!-- AdminKit CSS file --> <link href="PATH/dist/css/app.css" rel="stylesheet"> </head> <body> <h1>Hello, world!</h1> <!-- AdminKit JS file --> <script src="PATH/dist/js/app.js"></script> </body> </html>