👩‍🎨

Using the editor

After selecting a template on the Divjoy homepage you'll be taken to our built-in editor to preview your web app. While previewing you can test out all the functionality of your web app. You can signup, change accounts settings, modify live data on the dashboard, go through the payments flow, upgrade/downgrade plans, everything works.

Of course, the editor also allows you to edit your web app. The main benefits are:

  • Access to our visual library of components and drag/drop them into your project
  • Re-order sections and add/remove pages
  • Play with component props
  • Explore component hierarchy to get a sense of how things are setup

Most Divjoy customers end up moving to code pretty quickly, as our editor isn't mean to replace your main code editor. It's just a nice, light-weight to try things out and experiment with ideas before moving over to code.

Visual overview

To browse our visual component library click the "Component Library" button in the top left
To browse our visual component library click the "Component Library" button in the top left
Then just drag and drop anything you like into your project
Then just drag and drop anything you like into your project
Click page nodes to switch between pages in the preview window. Click components to edit their props.
Click page nodes to switch between pages in the preview window. Click components to edit their props.
When you're ready to export your code click the "Export Code" button in the top right
When you're ready to export your code click the "Export Code" button in the top right

🗣

Any questions you have that aren't answered here? Please reach out and let us know. We'll answer your question and then improve the docs for others.