New Component Guide Overview
Last updated
Was this helpful?
Last updated
Was this helpful?
For a one-time purpose, you may want to use the function component and combinations of other core components in the Apps Editor.
But it's a good idea to make some logic easily reusable and maybe earn decent money on selling components.
If you are familiar with JavaScript and TypeScript follow this tutorial to create a new component for the Applications Editor.
When creating a new component project you get an src folder with three folders and two more .json files and tsconfig.json file in the root:
tsconfig.json - a configuration file as the project uses TypeScript.
components - in this folder each component of the project has its subfolder. The template contains two example components: example-uppercase and example-button.
icons folder - for Apps Editor workspace appearance icons. In each component folder.
UI folder - with .vue and styles.scss files as Vue.js is used for UI components. In each UI component folder.
Plus the Apps Editor will add
If your project contains more than one component it should have a separate folder for each of them.
- a component logic file. In each component folder.
- a component appearance settings file. In each component folder.
for composing UI components in Vue.js are in shared and typings folders.
- a configuration file. Here the components are registered.
- a file that allows you to test your component before releasing it.
In each component`s folder, there is a folder for an icon file. But you may have no need in the icon folder and file if you use Font Awesome pics (see ).
Before going deeper into the component project structure please, go through the guide.
