Smart Editor

Customize your application UI with Smart Editor, where you can easily edit and modify all UI changes while having real-time design previews, which helps you make UI more adaptive, responsive, pixel-perfect and accurate and also avoids switching back to your page list to rename or change page by providing you all your necessities right here, while you create your application.

Continue below to know how it helps in customising your UI design and get familiar with Smart Editor.

How does it work

To open the Smart Editor, select a page from the page list for which you want to customize UI. Click on Configure or select the card.

Get familiar with Smart Editor

This section will help you to get the Smart Editor interface and will guide you on how it helps to customize your complete app UI.

Complete hierarchical view of the components identified & generated automatically by DhiWise.

1

Build dynamic web apps with Navigations, API Integrations, Modals, Social Authentication and much more...

2

Handle life-cycle events starting from useEffect when the component is mounted.

3

Create components with desired prop names and remove duplications/repetitions

4

Combine elements into a Row/Column or ungroup them with a few clicks

5

Design a responsive web app that looks awesome on all devices with a better experience.

6

Define the look and feel of a web page as you want. Visually.

7

Write once and reuse groups of CSS properties across the web app.

8

You can see the live preview of your application or share that link with everyone in one go.

9

Build your React app in a combination of with/without storybook and CRA, CRACO, Webpack & Vite.

10

You can switch between all your application pages by opening this dropdown. Of course, you can search a page as well.

11

You can rename the page name with a single click right here.

12

Go back to where all the pages of the application are.

13

1. Layout Tree

Complete hierarchical view of the components identified & generated automatically by DhiWise. Learn more

2. Create Actions

Build dynamic web apps with Navigations, API Integrations, Modals, Social Authentication and much more. Learn more

3. Life-cycle events

Handle life-cycle events starting from useEffect when the component is mounted. Learn more

4. Components

Create components with desired prop names and remove duplications/repetitions. Learn more

5. Group/Ungroup

Combine elements into a Row/Column or ungroup them with a few clicks. Learn more

6. Supported devices

Design a responsive web app that looks awesome on all devices with a better experience. Learn more

7. Styles

Visually, define the look and feel of a web page as you want. Learn more

8. Mixins

Write once and reuse groups of CSS properties across the web app. Learn more

Got a question? Ask here.