Appfarm Documentation
Getting startedDocumentationCommunityAppfarm Create
  • Overview
  • Getting Started
    • What is Appfarm?
    • Key concepts
    • Quickstart
      • Speed intro
      • Step-by-step guide
    • Appfarm Showroom
    • FAQ
  • Appcademy
    • Learning paths
    • Appfarm Fundamentals
      • Intro Course
        • 1. Intro to No-Code and Appfarm
        • 2. Navigation in Appfarm Create
        • 3. What is Apps?
        • 4. Intro to UI Editor
        • 5. Data Model
        • 6. App Data
        • 7. Actions
        • 8. Tips and Tricks
        • 9. Intro to practical walkthrough
        • 10. Create a details view of a Project
        • 11. Create a Custom List
        • 12. Swipe and Delete
        • 13. Functionality for simple Create of Data
        • 14. Upload and Download Photos
        • 15. Input Dialog with Validation and Save
        • 16. Dashboard
        • 17. Summary
        • Quiz
      • User Interface Fundamentals
        • Container - Sectioning, Styling and Repeating
        • Conditional Styles
        • Motions
        • Responsive Design
        • Step-by-step workflow
        • Featured UI Components
        • Quiz
      • App Data Fundamentals
        • Data Source Filtering
        • App Variables and Runtime Properties
        • URL Parameters
        • Quiz
      • Actions & Logic Fundamentals
        • Event Handlers
        • Featured Action Nodes
        • Context Parameters
        • Quiz
      • Services Fundamentals
        • Introduction to Services
        • Setting up a Service
        • Scheduling a Service
      • Integration Fundamentals
        • The web request action node
        • Fetch data from an endpoint
        • Map data to a data source
        • Modify the response
        • Nested data mapping
        • Path parameters
        • Authentication
        • Send data to an endpoint
        • Quiz
      • User handling and permissions
        • Users and roles
        • Permissions
        • Creating users
        • Extending the User object class
        • Updating and deleting users
        • Unauthenticated access
        • Quiz
    • Appfarm Professional
      • User Interfaces
        • Featured UI Components
        • Concepts and Use Cases
      • Data Structures & Data Handling
        • Data Features
        • Search & Filters
        • Featured Action Nodes
        • GraphQL
      • Logic & Flow
        • Logical Concepts
        • Date and Time Handling
        • Featured Action Nodes
        • Exception Handling
      • Login & Configuration
        • Login and Authentication
        • Settings, Configuration and Languages
      • Security & Operations
        • Security and Permissions
        • Deployment
        • Schedules and Logs
        • Debugging and App Health
      • Performance & Optimization
        • Optimizing Performance
        • Enhancing Functionality
    • Appfarm Sales Representative
    • Appfarm Developer Forum
      • Session 1: Data Modeling in Appfarm Create
      • Session 2: App Data in Appfarm Create
      • Session 3: Services in Appfarm Create
      • Session 4: Optimizing Performance
    • Background
      • Databases
        • Data modeling 101
        • Database normalization
  • Library
    • UI components
      • Advanced bar chart
      • Advanced bubble chart
      • Advanced combined chart
      • Advanced gantt chart
      • Advanced heatmap chart
      • Advanced line/area chart
      • Advanced pie chart
      • Advanced scatter plot chart
      • Advanced solid gauge chart
      • Animated component
      • Avatar
      • Avatar group
      • Basic bar chart
      • Basic gauge chart
      • Basic line chart
      • Basic pie chart
      • Bottom navigation
      • Button
      • Checkbox
      • Chip group
      • Circular progress
      • Coded component
      • Container
      • Date & time picker
      • Drawable canvas
      • Floating action button
      • Icon
      • Icon button
      • Iframe
      • Image
      • Linear progress
      • List
      • Map
      • Menu list
      • Multi select
      • PDF reader
      • Popover
      • Radio buttons
      • Rich text editor
      • Rich text
      • Select
      • Slider
      • Speed dial
      • Switch
      • Table
      • Tabs
      • Text
      • Text edit
      • View container
      • Visibility group
    • Action nodes
      • Aggregate data
      • Advanced search
      • Auth operations
      • Block
      • Catch exception
      • Copy to clipboard
      • Create file archive
      • Create file object
      • Create object
      • Create user account
      • Delete objects
      • Delete user account
      • Duplicate objects
      • End execution
      • Exit block
      • Exit loop
      • Export data
      • Foreach
      • Generate document
      • If
      • Import data
      • Invalidate cache
      • Log in
      • Log to console
      • Log out
      • Next iteration
      • Navigate
      • Open/close popover
      • Open confirm dialog
      • Open print dialog
      • Open snackbar
      • Open Unsplash dialog
      • Open URL
      • Persist objects
      • Push notifications
      • Read objects
      • Request permissions
      • Run code
      • Run other action
      • Run service
      • Scan barcode/QR code
      • Send email
      • Send SMS
      • Set client language
      • Set data source attributes
      • Set selection
      • Set theme
      • Set user account image
      • Show install app prompt
      • Sleep
      • Sort objects
      • Throw exception
      • Toggle drawer
      • Update object
      • Update secret
      • Update user account
      • Web request
      • While
  • Reference
    • Appfarm Create
      • Appfarm Commander
      • Blue dots
      • Copy & Paste
      • Farmer's Market
      • Find references
      • Find usage
      • Keyboard shortcuts
      • Undo/Redo
      • User preferences
    • Platform concepts
      • Conditions
      • Data bindings
      • Date and time
      • Event handlers
      • Filters
      • Functions
      • Markdown
      • Objects
      • Operators
      • Value processor
    • Dashboard
    • Apps
      • UI
        • Views
          • Dialog
          • Drawer
        • Layout designer
        • Component properties
        • Shareable UI components
      • Data
        • App variables
        • Data sources
        • Calendar data sources
      • Actions
      • App settings
      • App size
      • App health
    • Services
      • Service Endpoints
      • Service settings
      • Service health
      • API explorer
    • Data model
      • Object classes
      • Object class properties
      • Enumerated types
      • GraphQL
        • Queries
        • Mutations
      • Data Extract API
      • Time series data
    • Operations
      • Deploy
      • Schedules
      • Logs
    • Resources
      • Themes
      • Files
      • Fonts
      • Internationalization
    • Configuration
      • Environments
      • Login
        • Custom auth providers
    • Security
      • Users
      • Service accounts
      • Roles
      • Secrets
      • Permissions
        • Conditional Permissions
    • Appfarm Client
      • Developer tools for Apps
      • Developer tools for Services
      • Warnings and errors
  • How to
    • Data modeling
      • Many-to-many relationships
      • Use naming conventions
      • Offline data handling
      • Data silos and White labelling
    • User interface
      • Manage a many-to-many relationship with a Chip group
      • Configure drag and drop
      • Build a drag-and-drop calendar
      • Design a responsive layout
      • Work with flexbox
      • Use Mapbox as a map layer
      • Understand charts
    • Logic and flow
      • Event Log Design
      • Configure advanced search
    • Themes and styling
      • Change the active theme
      • Add custom email templates
    • Enhance your app
      • Add deep links
      • Add keyboard shortcuts
      • Add link previews for social media
      • Apply SEO best practices
      • Change the active language
      • Generate a PDF from a Container
    • Integrations
      • Integrate with external systems
      • Integrate with OpenAI
      • Integrate with Google Analytics (GA4)
      • Configure a custom email account
      • Integrate with a payment provider
      • Integrate with Signicat
      • Integrate directly with an external database
      • Retrieve a Bearer token from Google Cloud
      • Fetch data from BigQuery
      • Retrieve access token from Microsoft Entra ID
    • Workflow automation
      • Update an OAuth 2.0 access token from a service
    • Authentication and access control
      • Add users and assign roles
      • Configure unauthenticated access
      • Implement third-party authentication
    • Security, testing and deployment
      • Add a custom domain
      • Install an app on a device
      • Get ready for Production
      • Optimize performance
      • Security checklist
      • Test and debug
    • Example apps
      • Create an Instagram clone
        • The end result
        • Designing the feed
        • Create new post
        • Add a like-button
        • Add comment-functionality
  • Solution administration
    • Subscription and billing
    • Dedicated tier benefits
    • Guide to GDPR
      • Key principles
      • How Appfarm protects personal data
      • How you can protect your clients’ data
      • Glossary
    • Appfarm and the EU AI Act
  • Policies
    • Appfarm Policies
    • Data Processors
    • Privacy Policy
Powered by GitBook
On this page
  • Share App Preview URL
  • General settings
  • Device adaptivity and responsivity
  • App drawer
  • Event handlers
  • Progressive Web App
  • Shareable link info
  • Other
  • Timers
  • Topics

Was this helpful?

Export as PDF
  1. Reference
  2. Apps

App settings

Each app has some general settings which can be configured. These settings can be changed by clicking the cog icon in the toolbar when inside an app.

Share App Preview URL

In the top-right section of the App Settings, you find a Share icon. Clicking this icon will open a dialog containing the URL to the App (in the Develop environment) as well as a QR code containing the same URL.

Scan the QR code to preview or test the App from your mobile device.

General settings

Setting
Description

Name

Used in the <title> tag and displayed as the title of the browser tab. Also used in the list of apps at the root URL of the Appfarm Client and throughout Appfarm Create.

Description

A longer description of the app. For your own reference.

Readable ID

A slug to use in the app's public URL. For example, in the following app URL the Readable ID is events: https://thirty50.appfarm.app/events. The value must consist only of valid URL characters. Illegal characters will be automatically removed. Important: If you change the Readable ID, the app's URL will change, and you will have to provide the new URL to your users. Homescreen shortcuts on mobile devices will also become invalid.

App Icon

An icon from the built-in icon library. Displayed in the list of apps at the root URL of the Appfarm Client and throughout Appfarm Create.

Default View

The view displayed when navigating to the root of the app.

Theme

Device adaptivity and responsivity

Setting
Description

Device Size Availability

The device sizes that the app should be available for. Use this option when you implement a design strategy with multiple apps where each app is targeted at specific device sizes. The following sizes are available:

  • Extra Small: up to 600 px (mobile phones)

  • Small: 600–1239 px (tablets)

  • Medium: 1240–1439 px (small and medium sized laptops)

  • Large: 1440px and over (larger laptops and desktop monitors)

When navigating to the app, the device's screen size will be evaluated, and the Appfarm Client will determine if the app should be accessible or not based on this setting.

Responsive Strategy

When a responsive strategy is applied, the UI designer provides breakpoints so that you can design the app to adapt to different screen sizes.

  • None: Design for one screen size. No breakpoints are provided to override styling.

  • Desktop First: Design for large screens first, with breakpoints to adapt the design for progressively smaller screen sizes.

  • Mobile First: Design for small screens first, with breakpoints to adapt the design for progressively larger screen sizes.

App drawer

Setting
Description

Main App Drawer

Drawer Default Open

Show the drawer when the app is loaded. This setting is ignored if the drawer's Type property is Temporary.

Event handlers

Note: Running actions on app load will increase app loading time and should be used with care.

Setting
Description

On App Load

The action will be triggered after the data sources have been populated, but before the UI is shown to the user.

On App Loaded

The action will be triggered after the UI is shown to the user.

On Online

The action will be triggered when an App is offline, and goes online.

On Offline

The action will be triggered when an App is online, and goes offline. Note that database operations, or Action Nodes communicating with the server, cannot be executed in this action.

On Visible

On Hidden

On Browser History Change

Source View, Target View, Source Path, Target Path, Source Params, Target Params.

Progressive Web App

Setting
Description

Name

The name of the app. It may be displayed among a list of other apps or as a label for an icon. A maximum of 45 characters is recommended.

Short Name

An abbreviated name used as the app name on device homescreens and other places with limited space.

A maximum of 12 characters is recommended. If left blank, Name will be used and truncated.

Orientation

The default orientation of your app on mobile devices.

Background Color

A color that may be used by the operating system as a placeholder while the app's styles are loaded. Usually, this should match the background color of the app.

Theme Color

A color that may be used by the operating system when displaying the app. This color may apply even when an app is not installed as a PWA.

Icon 72x72–512x512

Enable Push

Deprecated! This setting is no longer in use and is currently Read Only.

Push Icon 192x192

The icon that will be visible on web push notifications on supporting devices.

Note: If you are using the Push notification action node in a service, changes to the push icon will not be applied to the service until there are changes in the data model or services.

Enable Offline

Regarding the Enable Push setting: This will be deprecated from Appfarm version 23.4 (to be released september 2023). It will be replaced by an action node for requesting permissions. Note that with this Appfarm Release, push notifications will also be available for iOS devices. Up until spring 2023, push notifications have only been available for progressive web apps for Android.

Shareable link info

Setting
Description

Data Source

Select a data source to enable dynamic data in the meta tags. For example, if a link to an event is shared and you want to populate the tags with details of that specific event.

Query Param Name

Available if a data source is selected. The name of the query parameter used to specify the object to return. Use lower case letters with no spaces, for example "event".

Identifying Property

Available if a data source is selected. A unique identifying property to be used to look up the correct object in the database. A Random Identifier property is recommended. If not specified, ID will be used.

Title

The value for the Open Graph property og:title.

Description

The value for the Open Graph property og:description.

Image

The value for the Open Graph property og:image.

Site Name

The value for the Open Graph property og:site_name.

In addition to these values, the meta tag for the Open Graph property og:url is also generated and populated with your app's root URL.

Other

Setting
Description

Hide from App List

Hide the app from the list of apps shown when a user navigates to the root URL of the Appfarm Client.

App Type

Differentiate between normals apps in production and those in development or for restricted admin purposes. Changing this option may affect billing for your solution, as the number of Normal apps deployed to production is defined as part of your subscription. The options are:

  • Normal: Available in all environments and uses a regular security configuration

  • Dev Only: Only available in the Development environment. Not counted for billing. Most apps in early development will use this option.

  • Config/Admin: Not counted for billing. Requires special permissions held only by the Owners and Maintainers roles. This option is intended for temporary use or basic admin apps for data migration or raw data access.

Disable Connection Notifier

Don't show a notification in the Appfarm Client when it is disconnected from the server. If selected, you need to handle this case manually by referencing the app variable Is Online.

Timers

Topics

Timers

If you want to perform an action on a schedule when the app is in use, for example every minute, you can use a timer. Timers can be used to run automatic carousels/slideshows, fetch the latest data from an external API, or other dynamic features.

As an example, say you have a timer that is permanently enabled and has an interval of 30 seconds. When the app is loaded, a 30 second countdown will begin. When it reaches 0 the action specified for On Timeout will be triggered. The countdown will then begin again.

Setting
Description

Name

A reference for the timer.

Enabled

Set the timer to always operate by setting the value to true, or set the value according to a data binding, condition, or function.

Interval

The number of seconds between each instance of the timer. The lowest possible value is 1 second, which means you can trigger an action at most every second.

On Timeout

The action to trigger when the timer expires.

Topics

Topics can be used for lightweight communication between components. For example, to synchronize axis selection in charts.

PreviousActionsNextApp size

Last updated 1 year ago

Was this helpful?

The to apply to the app. You can also switch themes dynamically, using the .

If you are using a as the main navigation you can select it here. Defining a main app drawer enables some additional built-in features:

The drawer state is accessible via the built-in Is Main Drawer Open.

If the drawer's Type property is Temporary, the drawer will be automatically closed when navigating using action nodes such as and Open Dialog.

Run an action when the app is loaded/refreshed. This is commonly used to populate default data, check for URL parameters, or set a .

The action will be triggered when the App goes from hidden to focused / visible. NB: The browser must support the (all major browser supports this).

The action will be triggered when the App goes from focused / visible to hidden. NB: The browser must support the (all major browser supports this).

This can be used to trigger an action every time the browser history changes, for example when navigating between views, or changing the URL params. If the connected Action uses , you will have access to a specific set of parameters for this event handler, for passing in to the Action:

This new event handler combined with the possibility the add should be enough to integrate any Analytics tool to Appfarm, included Google Analytics 4 (GA4). However, GA4 automatically detects browser history change once the custom header scripts have been added.

These values are included in the app's . Setting a value here will overwrite the equivalent value set in the .

App icons of various dimensions that can be used in different contexts across an operating system. The icons must be uploaded to .

Use action node instead.

Enables offline support for this App. This will make the App store runtime only data on the client, and the App will be able to run while offline. Please note that Database connected data sources do not work in Offline mode, so the App needs to be designed to specifically targeting offline mode - with runtime only data sources, and handling of persisting or deleting data base on whether the App is Online or Offline. Please also see the On Offline and On Online described in the section above.

Generate <meta> tags for rich link previews when the app is shared on social media or in messages on smartphones. For a detailed walkthrough of implementing link previews, see .

Manage .

Manage .

theme
web application manifest
Environment configuration
How to generate link previews for social media
theme
Set Theme action node
drawer
app variable
Navigate
Page Visibility API
Page Visibility API
Files
Request Permissions
custom headers
Event Handlers
timers
topics
Action Params