Guide to the application-building process

Set of practical solutions for a step-by-step application building on the Betty Blocks platform.

After reading this article you’ll know:

• How to approach the application development process step-by-step

• Key milestones and requirements of the application development

• Where the platform builder can look for practical solutions

After defining an MVP for your future application and setting up your development team, it’s time to start working on the building process itself. Although there is no universally accepted approach to developing software solutions, certain best practices can maximize the platform capabilities and as a result lead to a successful implementation of your ideas. This guide serves as a comprehensive overview of the best practices to follow during the application-building process, to ensure a high-quality, efficient, and secure application.

Before you begin

Before diving into development, ensure you have the following in place for a smooth and efficient workflow:

• Required development skills and roles: identify the development skills needed to complete the tasks involved in your Minimum Viable Product (MVP). Use the knowledge gained during the MVP development phase to establish this, and make sure the roles and responsibilities are well defined within your development team

• Prepared tickets: maintain a well-organized backlog of user stories and tasks (tickets) to guide your development process. Before starting the development process, you should have a clear vision of your MVP. This should include a backlog of features and functionalities that you want your application to have

• Development environment: set up a development, testing, acceptance, and production (DTAP) environment to facilitate a controlled workflow

Design

As mentioned earlier, there is no right or wrong path when it comes to choosing where to start your Betty application development. For more experienced builders, it would be data modeling, while most non-developer builders would likely have a visual-driven approach to building and therefore choose to work on the front-end design first.

1. Start with a user-centric design. While there’s flexibility, consider starting with designing pages to involve citizen developers early. This allows for early user feedback and fosters a collaborative development process. One can start building a new page from scratch or use one of the pre-configured page templates.

Articles to read:

• Creating a new page

• Pages standards & best practices

• Page settings configuration

2. Turn sketches into wireframes. Analyze your tickets and translate them into page designs. You can use Betty Blocks’ pages to transform sketches into wireframes, providing a clear visual representation of your application’s layout and functionality. If you prefer other tools, you can use Figma, for example.

Articles to read:

• Building a page layout

• Setting up your page

• Page component options: aligning, positioning and spacing

• Navigation on your pages

• Working with the navigation bar

3. Styling and brand identity. Use the theme builder to establish a consistent and visually appealing design for your application. Work with color schemes and typography, and manage public files (like images and icons) for efficient use throughout the application.

Articles to read:

• Styling best practices

• Theme builder reference

• Using the theme builder

• Adding fonts to your application

• Color use: best practices

4. Validate and refine. Collaborate with stakeholders to validate your initial designs. Gather feedback and refine your design based on their input.

5. Reuse the approved design elements. After your navigation bars, buttons, drawers, etc. have been approved by stakeholders, you can start utilizing the reusability capabilities of Betty Blocks.

Articles to read:

• Creating and using partials

• Reusability functionalities

Data models

The data model serves as a flexible storage for your data, and with any storage place that you need to access regularly, you want to keep it as organized as possible. Take advantage of well-prepared data models and the defined relations between them.

1. Collaborative data structure. Work with low-code developers and business technologists to agree on a data structure that meets technical and business needs.

2. Data-driven approach. Review user stories to identify the data your application needs to process and manage. Make sure you know your way around the data model within Betty Blocks.

Articles to read:

• Getting started with data model

• Adding properties to your model

• Navigating through your data model

• Working with the data model

3. Building the foundation: Construct your data models, defining their relations and properties for efficient data management.

Articles to read:

• Applying relations between models

• Adding data to your application

• Types of relations for connecting models

4. Keep your data logic simple. The KISS rule applies here: design data logic with simplicity in mind, focusing on clarity and maintainability. You can find it useful to read Data model standards and best practices.

Realizing your pages

Refer to your tickets to determine which pages need to manage specific data and which user roles require access to view or edit that data.

1. Functionality first. Develop a clear understanding of how each page will function. This includes defining back-office functionalities for managing data and users (admin sections), login and registration for various users, file upload functions, etc.

Articles to read:

• Back office template

• Login flow template

• Creating the register functionality for webusers

• Creating a forgot password functionality

• Creating a document upload feature

2. CRUD. Implement create, read, update, and delete (CRUD) functionalities using forms and tables on relevant pages. Leverage Betty Block’s page builder best practices for an efficient and organized approach.

Articles to read:

• Guide to your first CRUD application

• CRUD use cases series

• Creating a detail page

• Creating a delete button

3. Displaying data. Along with CRUD functionality, you have to understand how data is going to be displayed on your application’s pages. This includes working with page variables, data containers, data filtering, etc. Also, to dynamically change content on your pages, you need to learn to apply component interactions.

Articles to read:

• Displaying data within your pages

• Page variables versus data containers

• Using display logic on your pages

• Data filtering

• Creating component interactions

• Showing tasks use-case series

4. Security matters. Establish authentication profiles. Define user roles and assign appropriate access permissions to pages based on those roles

Articles to read:

• Authentication profile overview and configuration guide

• Page security (for a specific role)

5. Validation. Validate your application’s functionality thoroughly to ensure it operates as intended before moving forward.

Logic and actions

Understanding logic and action flows is essential for creating a user-friendly product. By identifying areas where automation can be implemented, you can improve the overall workflow for a better user experience. This proactive approach not only enhances efficiency but also allows for optimizing application performance.

1. Understanding data flow. Analyze user stories to understand how data flows throughout your application. Identify areas requiring additional checks, like conditional statements to trigger specific actions.

Articles to read:

• What are actions?

• Building an action

• Variables

• Creating a scheduled action

• Action trigger reference

A lot of action steps, page components, themes, and data sources can be found in our block store.

2. Filling the gaps. Use Betty Blocks’ action functionalities to automate tasks and fill any gaps in user workflows where necessary. While some parts of your application functionality can be created via the page builder components (like create and update forms), the others will need to be created and configured through the action builder directly.

Articles to read:

• Send email via SMTP step

• Condition step

• Document generation step

• Raise error step

3. Action efficiency. Follow the action best practices to create efficient and maintainable logic within your application.

Articles to read:

• Processing large collections in actions

• Sub-action used as before trigger

• Update many records step

4. Validation. Validate any newly implemented logic and actions to guarantee they function as planned.

Enablement toolkit and customizations

Depending on the complexity of your application, customizations may be required. These can be implemented by low-code developers or by our team, often involving data API usage for external data access, custom components, or action steps.

1. Prioritize self-sufficiency. Betty Blocks allows for custom solutions in certain cases. The aim is to empower users to use their IT resources and customize applications with code when necessary. This encourages self-reliance and reduces reliance on external development resources in the long term.

Articles to read:

• Setting up your pro-code environment

• Creating custom components

• Create your own custom action steps

2. Data APIs. Use data APIs to access external data sources not available within the platform. These integrations simplify development by automating data collection and updates, saving time and resources.

Articles to read:

• Getting started with data API

• Betty Blocks data API

3. Customization through feedback. Feedback from users often drives the need for customization. Utilize user feedback to identify areas for improvement and implement necessary code-based customizations.

4. Validation, iteration, and go-live! Throughout the development process, validate, iterate, and refine your application. Once you’re confident in its functionality, you’re ready to launch your first version and get it into the hands of your users.

Remember: this guide serves as a foundation. As you gain experience with Betty Blocks, you can refine your own approach and best practices to suit your specific needs and projects. Find useful information on testing, post-go-live support, and user communication in the Software development lifecycle series.