How to Preview the Generated Frontend Code in Build mode?

MockFlow provides two options to preview the generated frontend code,

1. Use the ‘Preview’ option in the top right corner to view the UI inside the editor.

1. Click ‘Open in New Window Tab’ to launch a live website preview in a new browser window.

Note - MockFlow provides in-app preview support for limited frameworks

Supported Framework Previews

MockFlow supports live previews for the following frameworks:

1. Tailwind

2. Bootstrap

3. Material

4. Shadcn

5. Ant Design

6. Bulma

These frameworks allow instant UI previews directly within MockFlow.

Watch this video to learn how to generate frontend code for an Android Mobile App UI using MockFlow Build Mode and preview it in Android Studio:

Frameworks without Preview Support

MockFlow does not provide preview for the front-end code generated from these frameworks:

1. React Tailwind

2. React Shadcn

3. React Bootstrap

4. React Ant Framework

5. Vue Tailwind

6. Vue Bootstrap

7. Vue Ant Framework

8. iOS UI

9. iPadOS UI

10. Watch OS UI

11. Android UI

12. Flutter UI

13. MS Windows UI

14. macOS UI

These require an online playground of the desired framework to preview the generated frontend code. You can export the code and open it within the respective framework to preview it.