logo
The World’s #1 Bootstrap 5 HTML,
VueJS, React, Angular, Laravel, Asp.Net Core, Blazor, Django & Flask

Admin Dashboard Ecosystem

This is Metronic 7 documentation!

Upon purchase you can get Metronic 7 version from our Github Repository.
Request Github access
The new Metronic 8 is now available with the most advanced Bootstrap 5, VueJS, React and Laravel foundation with a solid light and dark mode design system, extensive utility classes and custom made in-house components.
View Metronic 8 documentation

To use most of the Metronic build tools, Node.js LTS version is required. Version 14.x LTS is recommended. Some of the plugins and framework in Metronic v7 does not support the latest Node.js version. https://nodejs.org/en/

React Skeleton

1. Remove Demo Pages:

All demo pages are in separate modules.

  1. Remove demo pages folder:
    [metronic]/theme/react/[demo]/src/app/modules/ECommerce
    [metronic]/theme/react/[demo]/src/app/modules/GoogleMaterialExamples
    [metronic]/theme/react/[demo]/src/app/modules/ReactBootstrapExamples

    Leave Auth and ErrorsExamples folder. Auth is required for authentication module like login and register page. ErrorsExamples is required for 404 page redirect (* you able to keep only error page and remove others).

  2. Remove ECommerce mock dependencies in file [metronic]/theme/react/[demo]/src/redux/__mocks__/mockAxios.js:
  3. Remove ECommerce redux reducers dependencies in file [metronic]/theme/react/[demo]/src/redux/rootReducer.js:
  4. Remove demo pages from Routing in file [metronic]/theme/react/[demo]/src/app/pages/BasePage.js:
  5. Remove demo pages links from Aside Menu in file [metronic]/theme/react/[demo]/src/_metronic/layout/components/aside/aside-menu/AsideMenuList.js: Remove all html code from row 47 to 1465
  6. Remove demo pages links from Header Menu in file [metronic]/theme/react/[demo]/src/_metronic/layout/components/header/header-menu/HeaderList.js: Remove all html code from row 29 to 1001

2. Remove Dashboard widgets:

All dashboard widgets can be easily removed.

  1. Remove dashboard+widgets folders:
    [metronic]/theme/react/[demo]/src/_metronic/_partials/dashboards
    [metronic]/theme/react/[demo]/src/_metronic/_partials/widgets
  2. Remove Dashboard imports in file [metronic]/theme/react/[demo]/src/_metronic/_partials/index.js:
    // export {Dashboard} from "./dashboards/Dashboard";
    export {Builder} from "./builder/Builder";
  3. Remove Dashboard component dependencies in file [metronic]/theme/react/[demo]/src/app/pages/DashboardPage.js:
    import React from "react";
    
    export function DashboardPage() {
      return <></>;
    }
Metronic: React skeleton => Result
Think About The Future, Stay Connected With Us
The More We Learn, The More We Are Able To Innovate & To Develop