Table of Contents

• What is SnapApp Application Builder
• Strategy: How to Approach Your Build
• Getting Started with SnapApp Application Builder
• Phase 1: Core Configuration
• Step 1: Create Your Application
• Step 2: Define the Data Model (Objects & Fields)
• Phase 2: User Interface & Experience
• Step 3: Build Custom Views
• Step 4: Construct Pages
• Step 5: Navigation & Menus
• Phase 3: Automation & Logic
• Step 6: Analytics Dashboards (Optional)
• Phase 4: Quality Assurance
• Step 7: Deployment & Testing
• SnapApp Technical Architecture
  • * Learn More

What is SnapApp Application Builder

SnapApp Application Builder is a low code tool designed to quickly build beautiful, powerful and secure database-driven applications.Whether you are modernizing a legacy system or launching a brand-new idea, SnapApp provides the infrastructure to go from concept to production in record time.

Strategy: How to Approach Your Build

Before diving into the editor, determine which development methodology fits your project:

• Modernizing an Existing Application (Brownfield Development): *Use this for existing legacy systems. Import your current database schema to automatically generate Objects and Fields to use a baseline for your data model. Then focus on UI/UX enhancement.
• Building from Scratch (Greenfield Development) Developing an entirely new data model and application. Start with an MVP (Minimum Viable Product). Leverage SnapApp’s prebuilt industry schemas (like the Government schema) to accelerate your data modeling phase.

Getting Started with SnapApp Application Builder

Here is a guide to walk through building the first SnapApp application.

Phase 1: Core Configuration

Step 1: Create Your Application

An Application in SnapApp is a logical collection of data objects, UX components, navigation rules, and permissions.

1. Navigate to the Configurations List or Solution Settings page.
2. Click Add New Application.
3. Initial Setup: Enter your Application Name and Save.
4. Refinement: Once saved, click into the application to customize branding (colors, logos) and Global Settings.

Step 2: Define the Data Model (Objects & Fields)

The data model is the foundation of your app. In SnapApp, we use Objects (Tables) and Fields (Columns).

1. Create Objects: Go to the Objects section for more information on objects. (e.g., Customers, Invoices, Projects).
2. Add Fields: Define data types for each object. SnapApp supports standard types (Text, Number, Date) and complex types (Relationships/Lookups). For more information on creating a new field, go to the Fields section
3. Assign Permissions: Use Permission Sets to define who can Read, Create, Edit, or Delete records within these objects and fields you create.

Phase 2: User Interface & Experience

Step 3: Build Custom Views

Views determine how your data is visualized. SnapApp provides a library of pre-configured view types. For more information on configuring views, go to the Views section:

| View Type | Best Used For… | Route Example | | :---------------- | :------------------------------------------------------- | :-------------------- | — | --------------- | -------------------------------------- | ------------------- | | List View | Tabular data management and filtering. | /list-view/[table] | | Create View | Initiating new record entries via structured inputs. | /create-view/[id] | | Detail View | Focused inspection and interaction with a single record. | /detail-view/[id] | | Kanban View | Visualizing workflows and task stages. | /kanban-view/[id] | | Map View | Geographic data and location tracking. | /map-view/[table] | | Form View | Full-page record editing and entry. | /form-view/[id] | | Calendar View | Scheduling and time-sensitive records. | /calendar-view/[id] | | Deck View | Sequential cards for structured presentations. | /deck-view/[id] |

Step 4: Construct Pages

Pages are the “canvas” of your app. They host multiple views, custom HTML, and rich media.

• Layout: Use the drag-and-drop editor to place Views and Dashboards.
• Customization: Import custom HTML or use built-in widgets to stylize content.

Step 5: Navigation & Menus

Ensure users can find what they need through intuitive routing.

1. Global Navigation: Define the primary sidebar or top-bar links.
2. Breadcrumbs: Enable hierarchical navigation for deep-nested records.
3. Contextual Menus: Create action-based menus for specific user roles.

Phase 3: Automation & Logic

Workflows automate business logic without writing backend code. Trigger actions based on record changes:

• Data Actions: Automatic Insert, Update, or Delete of records.
• Communication: Trigger Custom Emails or SMS Alerts.
• Integrations: Execute Outbound API calls or publish messages via Pub/Sub.

Step 6: Analytics Dashboards (Optional)

SnapApp integrates natively with Google Looker Studio.

• Embed real-time BI reports directly into your application.
• Compatible with Tableau, Power BI, and other embeddable reporting tools.

To create a dashboard in SnapApp, follow these Steps

Phase 4: Quality Assurance

Step 7: Deployment & Testing

Before rolling out to users:

1. Validation: Test all form validations and required fields.
2. Role Simulation: Log in as different user types to verify Permission Sets.
3. UI Audit: Ensure the application is responsive across mobile, tablet, and desktop views.

SnapApp Technical Architecture

SnapApp runs on a high-availability architecture powered by Google Cloud Platform (GCP).

Learn More

• SnapApp Fundamentals

• Configuration Best Practices Guide

Need a hand? Reach out to our team at snapapp@bluevector.ai for technical support