​
Project structure

The project structure of Morph is as follows.

You can add a new page by creating an .mdx file in the pages directory.

​
Basic syntax of page files

Page files are written in the following format.

index.mdx
export const title = 'Top page'; // Page title. Used for display on the menu.

# Salesforce Analysis Dashboard + AI Chat
This is a dashboard that connects to Salesforce data. It includes data visualization created using Python and a custom chat using the Open AI API.

<Grid cols='2'>
  <DataTable loadData='sales-analysis' />
  <LLM postData='ai-chat' />
</Grid>

## Notes
If you have any questions while using the dashboard, please feel free to contact the data team.

​
Title

export const title = 'Top page'; // Page title. Used for display on the menu.
...

A string declared in the form export const title = 'title'; is used as the page title. It is used for display on the menu.

​
Markdown

export const title = 'Top page'; // Page title. Used for display on the menu.

# Salesforce Analysis Dashboard + AI Chat
This is a dashboard that connects to Salesforce data. It includes data visualization created using Python and a custom chat using the Open AI API.
...

Page files can be written in Markdown format. You can describe the information necessary for operating the data application and convey it to users in an easy-to-understand manner.

​
Components

...
<Grid cols='2'>
  <DataTable loadData='sales-analysis' />
  <LLM postData='ai-chat' />
</Grid>
...

<Grid> and <DataTable> are components provided by the Morph framework. Using these components, you can easily add the functionality you need to your data app.

​
MDX

Use MDX (https://mdxjs.com/) when building data applications in Morph; for more information on how to use MDX, see MDX detail.

Quick Start