Getting started - auronvila/mantine-template GitHub Wiki

After you've successfully cloned the repo and run the application you need to make some app configurations or specifications. The AppConfig file is where you will make the initial configurations about the app that you will build ex. the type of the layout you want to use, initial authenticated path... etc.

/src/configs/app.config.ts:

const appConfig: AppConfig = {
  layoutType: LayoutTypes.SimpleSideBar,
  apiPrefix: '',
  authenticatedEntryPath: '/dashboard',
  unAuthenticatedEntryPath: '/sign-in',
  enableMock: true,
  locale: 'en',
}

LayoutType

Template supports 3 layouts(side bars) that are provided in mantine.ui.

SimpleSideBar: link.

CollapsedSideBar: link.

DeckedSideBar: link.

ApiPrefix

Template has build in axios configuration, the api prefix is the base url that will be joined when you send the request using the Api provided by the template.

Example:

  async signIn(email: string, password: string): Promise<SignInResponse> {
    const res = await ApiService.fetchData<{ email: string, password: string }, SignInResponse>({
      url: '/users/sign-in',
      method: 'POST',
      data: {email, password}
    })
    return res.data;
  }

In the example above I am using the Api service provided and I am adding a url where the request will be sent. Based on this url and baseUrl I specified the request will be sent to https://example.com/users/sign-in.

AuthenticatedEntryPath

Is the initial route that the user will be sent to when the user gets authenticated.

UnAuthenticatedEntryPath

Is the initial route that the user will be sent to when the user gets unAuthenticated or signed out of the app.

Locale

Is the initial language that the app will use.

enableMock

if this value is true the app will use fake api and send requests to mock backend server. If you set the value to false you need to add the baseUrl of your backend domain to apiPrefix and if you set it to true you can leave it empty.