Giter VIP home page Giter VIP logo

codedthemes / mantis-free-react-admin-template Goto Github PK

View Code? Open in Web Editor NEW
751.0 5.0 533.0 1.17 MB

Mantis is React Dashboard Template having combine tone of 2 popular react component library - MUI and Ant Design principles.

Home Page: https://mantisdashboard.io/free/

License: MIT License

HTML 0.62% JavaScript 99.38%
material-ui ant-design react admin-template mui free freeadmintemplate dashboard-templates react-dashboard react18

mantis-free-react-admin-template's Introduction

Mantis Free React Material UI Dashboard Template Tweet

License: MIT Price GitHub package version

Mantis is a free and open source React dashboard template made using the Material UI React component library with aim of flexibility and better customizability.

Name Derived From Nature

Mantis Logo is inspired from the insect name - 'Mantises' as they have triangular heads with flexible Necks. Also, the name is derived from two popular UI frameworks, Material UI and Ant Design (M-Ant-is).

Mantis has Ant Design principal on top of the MAterial UI React component library.

⭐ ⭐ ⭐ Support us by giving star (Top right of this page) if you like the theme ⭐ ⭐ ⭐

mantis-free-react-dashboard-template.jpg

The Pro version of Mantis react template includes features such as TypeScript, apps, authentication methods (i.e. JWT, Auth0, Firebase), advance components, form plugins, layouts, widgets, and more.

Mantis Free Mantis Pro
7 Demo pages 85+ Demo pages
- ✓ Multi-language
- ✓ Dark/Light Mode 🌓
- ✓ TypeScript version
- ✓ Design files (Figma)
- ✓ Multiple color options
- ✓ RTL
- ✓ JWT, Firebase, Auth0, AWS authentication
- More components
✓ MIT License Pro License

Why Mantis?

Mantis offers everything needed to build an advanced dashboard application. In the initial release, we included following high-end features,

  • Support React18.
  • Professional user interface.
  • Material UI React components.
  • Fully responsive, all modern browser supported.
  • Easy to use code structure
  • Flexible & high-Performance code
  • Simple documentation

Free Mantis React version

Preview

Download

Mantis Pro version

Preview

Purchase

Table of contents

Getting Started

  1. Clone from Github
git clone https://github.com/codedthemes/mantis-free-react-admin-template.git
  1. Install packages
yarn
  1. Run project
yarn start

Documentation

Mantis documentation helps you out in all aspects from Installation to deployment.

Technology stack

  • Material UI V5
  • Built with React Hooks API.
  • React context API for state management.
  • SWR.
  • React Router for navigation routing.
  • Support for Vite.
  • Code splitting.
  • CSS-in-JS.

Author

Mantis is managed by team CodedThemes.

Issues

Please generate a GitHub issue if you found a bug in any version. We are try our best to resolve the issue.

License

  • Licensed under MIT

More Free React Material Admin Dashboard Templates

More premium React Material Admin Dashboard Templates

Follow us

mantis-free-react-admin-template's People

Contributors

ct-amit avatar ct-dixit avatar ct-jahidhasan avatar ct-omprakash avatar mbrookes avatar oliviertassinari avatar phoenixcoded20 avatar rakesh-nakrani avatar yosong-github avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

mantis-free-react-admin-template's Issues

Dropdown menu on the sidebar options

Is your feature request related to a problem? Please describe.
it will be alot easier if users can have a templete for a drop down menu options

Describe the solution you'd like
To have one of the side bar menu options to have a dropdown menu option

Describe alternatives you've considered
Manually creating a dropdown which serves the purpose but it will be alot more easier if it was included in this project

Additional context
Add any other context or screenshots about the feature request here.

Theme is broken currently

Describe the bug
A clear and concise description of what the bug is.

I get this error when running the theme. Steps to reproduce: fork the repo and launch the theme with no changes.

TypeError: Cannot read properties of undefined (reading 'getState')

This occurs on all versions of MUI themes. Both in this repository and the others (even the purchased full versions).

npm run build issue

Dist folder is created, but serving the application from the dist folder for production results in a blank white screen.

Please share the instruction to resolve this issue . I tried all the methods even update the outdated packages.

image

`yarn test` fails out of the box

Describe the bug
Running the included tests using yarn test doesn't work. The tests as configured use an ESM-based theme, which jest/yarn isn't configured to use. If you change it to use a CJS-based theme, the tests fail.

To Reproduce

  • Create a new clone, and install using yarn
  • Run npx jest
  • Observe the failure message (included as an attachment)

If you then change src/utils/SyntaxHiglight.js to import react-syntax-highlighter/dist/cjs/styles/hljs (to get a CommonJS version), the tests now run, but do not pass. Again, see included failure message as an attachment

Expected behavior
The tests should pass on a clean checkout, or should not be included.

Screenshots
See attachments.

Desktop (please complete the following information):
OS: Windows 11
Browser: N/A
Version: Current checkout (1.2.0)

Mui

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Taking off the localhost:300/free Part and replace it with the app name

Like the title descirbes that's where I'm stuck, I've tried going where is and remplaced it with and still get the same URL, btw I'm using the free version 1.1.2.

PS: to clarify the issue is not in the browser per say, it's in vs code when I type npm start, the automatic url it goes to is localhost:3000/free so when it opens up in the browser obviously there's nothing bc I changed the path so I have to delete free from the link and leave it at 3000, that's my issue... I'd like it to generate the path localhost:3000 and automaitucally show that in the browser.

Thank you in advance

Importing Logo, and LogoSection causes an Uncaught ReferenceError: process is not defined

Describe the bug
I cloned the free version and got the Uncaught ReferenceError: process is not defined when importing components.

To Reproduce
Steps to reproduce the behavior:

  1. yarn
  2. yarn start
  3. import Logo anywhere
  4. get error

Expected behavior
No error

Screenshots
If applicable, add screenshots to help explain your problem.

browser console output :
The development server has disconnected. Refresh the page if necessary. webpackHotDevClient.js:76 [HMR] Waiting for update signal from WDS... log.js:24 src/pages/dashboard/index.js Line 83:18: Insert ·` prettier/prettier

Search for the keywords to learn more about each error. index.js:1
The pseudo class ":first-child" is potentially unsafe when doing server-side rendering. Try changing it to ":first-of-type". index.js:1
Uncaught ReferenceError: process is not defined
4043 blank line 238378 > injectedScript:2
r blank line 238378 > injectedScript:2
8048 blank line 238378 > injectedScript:2
r blank line 238378 > injectedScript:2
8641 blank line 238378 > injectedScript:2
r blank line 238378 > injectedScript:2
blank line 238378 > injectedScript:2
blank line 238378 > injectedScript:2
blank line 238378 > injectedScript:2
onload index.js:1
be index.js:1
de index.js:1
handleErrors webpackHotDevClient.js:169
onmessage webpackHotDevClient.js:213
js webpackHotDevClient.js:195
Webpack 7
blank line 238378 > injectedScript:2:13158
`
EDIT:
Upgrading react-scripts by doing yarn add react-scripts@latest fixes this error but breaks other things

After downloading and npm installing, the application started. But All pages have some errors, for example Dashboard page gives "The pseudo class ":first-child" is potentially unsafe when doing server-side rendering. Try changing it to ":first-of-type"." error on console. ********** Typography page gives "react-dom.development.js:86 Warning: React does not recognize the `titleBottom` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `titlebottom` instead. If you accidentally passed it from a parent component, remove it from the DOM element."

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

  1. Go to '...'
  2. Click on '....'
  3. Scroll down to '....'
  4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: [e.g. iOS]
  • Browser [e.g. chrome, safari]
  • Version [e.g. 22]

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6]
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

Additional context
Add any other context about the problem here.

Reset Material UI Datagrid theme

I'm trying to use Material UI's Datagrid component. It works perfectly, however I want to reset to datagrid main template; Currently, there is no lines separating rows, neither columns.

main

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

  1. Go to '...'
  2. Click on '....'
  3. Scroll down to '....'
  4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: [e.g. iOS]
  • Browser [e.g. chrome, safari]
  • Version [e.g. 22]

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6]
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

Additional context
Add any other context about the problem here.

RTL support

Describe the solution you'd like
Will be there RTL support?

Or, if there's RTL support now, how can I use it?

Tnx

Could-Mui1

**Is your feature request related to a problem? Please describe.**
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.