Skeleton
Last updated
Last updated
If you have a purchased theme, it already comes with a skeleton structure, so that you can start directly from there. Skeleton is a folder structure created using react-script with minimal files from the full version to get started. It has all the dependencies preloaded in package.json
so you do not need to add any additional dependency unless needed from your side. It has a sample page to get started; With that, Routes, menus, styles, configuration, and many other things have already been set into that which saves no. of hours to set up a new project. Isn't it cool and time-savvy?
The Skeleton version is only available after you purchase a theme.
So when you run the project using yarn/npm, you will see a minimal site like below:
It provides you with a very simple and intuitive structure to get started with a new project. You can add new components from the full version. Now let's see how can we do that.
Now, let's add some cool components from the full version to the project which we just created. It will help you to craft your pages as per your need. So Let's begin:
Consider a scenario where you want to add Total Users
widget (Left card on the analytics dashboard) from the full version to the sample page. For that, we need to do the following things in order.
Copy the following code and replace it with sample-page
You will see there will be an import error for UsersCardChart, so you need to go to full-version, find out component and copy that component from full-version to skeleton. That's it.
It will output as follows:
Cool and straightforward, right?
You can do the same for other components and design your pages as per your needs. We have made common and reusable controls as well which you can see inside /src/components
. Feel free to refer to those as well and start developing your page.
I hope, we cover some basics to get started with the Mantis template and how to integrate it for your new project.