Skip to main content

Getting Started

tip

Get Started with the Starter kit version and copy components from full version.

We only provide documentation for custom components and customizations made to MUI's components. For MUI components' documentation please visit MUI's official docs.

caution

When using Javascript version, please consider respective file paths, we only show ts & tsx file paths for reference code in documentation.

e.g., Following is the file path in TypeScript version: src/layouts/UserLayout.tsx

and consider looking at following path in JavaScript version: src/layouts/UserLayout.js

There can be two possibilities, you are planning to start a new project with our template or trying to add our template into your existing project.

Starting a New Project with Our Template​

It is always suggested to get started with the minimal setup and we exactly provide that with our starter kit version.

Once you unzip the template you will find TypeScript / JavaScript version folder and under that full-version and starter-kit folders.

Understanding Dependencies in Starter Kit​

  • The Starter Kit version is designed with minimalism in mind. It includes only the essential dependencies required to get started with the template.
  • This approach ensures a lightweight and efficient setup, ideal for smaller projects or for those who prefer to build upon a lean foundation.

Adding to the Starter Kit​

  • If you begin with the Starter Kit but later find you need more features, you can easily integrate additional dependencies from the Full Version.
  • This process allows for a tailored development experience, you start with the basics and add more complexity only as needed.

Integrating Our Template into Your Existing Project​

Since this is a template and a starter project, it’s built as the starting point of your project. It cannot be simply installed and used with an existing project like a third party library.

Although using our template with any existing project is still possible, it would require extra work to connect everything together. We strongly recommend you to either start your project with Materio, or move your project on top of it to have the best experience.

Follow Installation Guide​

Next, Follow the installation guide once you streamline all the dependencies and make sure you meet all the system requirements mentioned in the installation page to run the project and read all the notices carefully given on the installation page.

Demo Configs​

You want your local template to look like one of the 6 demos you saw online then please follow demo config documentation which will help you achieve your goal.

FAQs​

If you face any difficulties with installation, or has any question on usage of this template like changing colors, fonts, branding etc., then treat yourself by visiting FAQs section. You are most likely to find your answer there.

Search Docs​

Our template has large documentation and sometime it can be daunting to find what you are looking for in the docs. Fastest way to find anything is to search doc using search input in the Navigation bar. You can write keywords and it will filter out results and come up with the best possible match.