> Portal Navigation:
>
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt
## Resource: A Blocks App Workflow
## Article: A Blocks App Workflow
## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/get-started/a-blocks-app-workflow.md
## Article Content:
# A Blocks App Workflow
**Editor compatibility**
Wix Blocks apps aren't supported in the Wix Harmony editor. Existing Blocks apps remain available for purchase on the Wix App Market for Wix Editor and Wix Studio sites. To learn more, see [About Wix Harmony and Blocks](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/about-wix-harmony-and-blocks.md).
Wix Blocks is open to all Wix Studio users. To access Blocks, go to [Custom Apps](https://manage.wix.com/account/custom-apps) in your Studio workspace. If you want to create a Blocks app in a Studio workspace where you are not the owner, make sure to get **Co-owner** permissions from the owner.
Wix Blocks lets you create apps that you can reuse on as many Wix sites as you want, use on your clients' sites or publish in the Wix App Market.
## Plan Your App
Here are some questions to start with, when you're planning your app:
* Does your app include [site widgets](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/site-widgets/build-a-site-widget-in-blocks.md)? How many widgets? Note that you can use nested widgets. You can also easily create various [design presets](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/about-design-presets.md) for the same widget, rather than duplicating it.
* What [panels](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/editor-experience-panels/about-panels-in-blocks.md) do you need for each widget? Note that you can build designated panels for various areas of your widget - no need for one large settings panel.
* Does your app use [a database](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/cms-collections-in-blocks/about-cms-collections-in-blocks.md)? If it does, consider adding a dashboard page for users to easily manage the data.
* Do you want to [publish your app](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/publish-blocks-apps-to-the-app-market/publish-a-blocks-app-to-the-app-market.md) in the Wix App Market? If so, it's important to plan the app in a way that matches different pricing plans, such as free and premium.
Here is an example workflow for building your app. Of course, not all apps will use all features.
## Create an app
Go to [Custom Apps](https://manage.wix.com/account/custom-apps) in your Wix Studio workspace and create a new app.
## Add widgets
Widgets allow you to add a user interface (UI) to your app. You can use a ready-made designed widget, ask the [Blocks AI](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/get-started/about-the-blocks-ai.md) to generate the widget for you, or design it on your own.
When designing a widget, we recommend that you start with a ready-made composition, or add layout elements such as grids, flexboxes or repeaters.
Read our [design guidelines](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/blocks-widget-design-guidelines.md), to make sure that your widget behaves responsively and blends well with Wix sites. Use our [Figma kit](https://www.figma.com/community/file/1397674211519735499/wix-blocks-components-library) if you want to create your design in Figma.
**To add widgets:** Go to the **App Interface** and click **Create Extension**. You'll see your widget under the **Widgets**  tab.
## Add design presets
[Design presets](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/about-design-presets.md) save you lots of work if you want different layouts or styles for your widgets. Users can later choose between the presets when your app is installed on a site.
**To add design presets:** Go to the **Design Presets** section in the **Widgets**  tab.
## Add widget code
Every widget has its own [widget code](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/code-in-blocks/about-widget-code-in-blocks.md) that holds its business logic. Every widget can also have its own [Widget API](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-api/about-the-widget-api.md) with properties, events, and functions.
**To add widget code:** Open the code panel at the bottom of your widget. You can work directly in this panel or use the [Wix IDE for Blocks](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/code-in-blocks/about-the-wix-ide-for-blocks.md).
**Important:** The Blocks-CLI integration only works with the [Wix CLI for Apps](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/about-the-wix-cli-for-apps.md). The new [Wix CLI](https://dev.wix.com/docs/wix-cli/guides/about-the-wix-cli.md), which is the recommended tool for new app projects, doesn’t support this integration.
## Configure the Editor Experience
The **Editor Experience**  panel enables you to define the way your widget and its elements look and behave when they're installed on a site.
Make sure to go over our [UX guidelines for Editor Experience](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/editor-experience-configuration/ux-guidelines-for-editor-experience-in-blocks.md) so that your widgets and panels are easy to understand and useful.
In the [Configuration](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/editor-experience-configuration/about-configuration-in-blocks.md) tab, you can modify display names, set your widgets or elements as non-selectable, and configure widget and element action bars (floating panels).
**To define configuration settings:** go to the **Editor Experience**  tab and click **Configuration**.
## Build Custom Panels
Your Blocks widgets and their elements come with default panels for settings, design, presets and more. You can also [build custom panels](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/editor-experience-panels/design-custom-panels-in-blocks.md) for your widgets and their elements.
**To create custom panels:** go to the **Editor Experience**  tab and click **Custom Panels**.
## Preview and test your widgets
Preview your widgets to test how they work. You can easily test how your widget looks on various [site themes](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/about-themes-in-blocks.md) and with various [widget API properties](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-api/blocks-widget-properties.md).
After previewing, make sure to [test your app on a site](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/test-your-app-on-a-site.md). Some parts of your app, like Custom Panels, can only be tested in the editor.
* **To preview your widgets:** click the **Preview**  icon.
* **To test your app:** click **Test**.
## Add CMS database collections
Blocks makes it easy to [add collections](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/cms-collections-in-blocks/about-cms-collections-in-blocks.md) to your app. When your app is installed on a site, it can use the default data that you provided, or data from the site.
**To add CMS collections:** open the **CMS**  tab.
## Add a Dashboard page
The Blocks [Dashboard pages](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/dashboard-pages/build-a-dashboard-page-in-blocks.md) are your app's back-office. They can be used to manage your database collections or other app settings. Unlike panels, which are used per-widget, Dashboard pages serve your entire app. When a user installs your app on a site, your Dashboard pages will be added to their site Dashboard, as separate pages.
**To add a Dashboard page:** click the **Dashboard Interface**  icon, then click **Add Dashboard Page**.
## Add code files to your app
Use Blocks to easily package and reuse code with backend modules, frontend files, and a configuration file. Code files apply to your entire app.
**To add code files:** go to the **Code**  panel and click **Public & Backend**.
## Configure your app Installation Settings
[Installation settings](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/configure-blocks-installation-settings.md) let you determine how your app is first installed on a site. You can select which widgets to show, which design presets, what to do on mobile devices, etc.
**To configure installation settings:** click on the three dots next to the widget name in the **Widgets** panel. Then click **Editor Experience** > **Installation Settings**.
## Prepare your app for pricing
If you plan to publish your app in the Wix App Market, consider its behavior across different pricing plans, such as free and premium. This includes different UI and logic. Learn more about [pricing plans in Blocks](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/publish-blocks-apps-to-the-app-market/adjust-a-blocks-app-to-different-pricing-plans.md).
**To start publishing your app in the App Market:** go to the **WixBlocks** icon and click **App > Publish App**.
## Release a version of your app
Create a [minor or major version](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/manage-blocks-app-versions.md) for your app, depending on where you are in the development process.
**To release a version:** click **Release** and select your version type.
## Install your app on a site
You can [install your app](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/install-a-blocks-app-on-a-site.md) on any site you own or collaborate with, as well as on your clients’ sites. You can also share it using an [install link](https://dev.wix.com/docs/build-apps/develop-your-app/app-dashboard-setup/share-your-app-with-an-install-link.md), or [publish your app](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/publish-blocks-apps-to-the-app-market/publish-a-blocks-app-to-the-app-market.md) in the Wix App Market.