AR1/docs/web-apps.md

4.3 KiB

Web Apps

Create multi-page web applications with custom layouts and content.

Overview

Web Apps allow you to build custom multi-page applications with unique URLs (slugs). Each app can have multiple pages with different content types including maps, datasets, tables, and charts.

Creating Web Apps

Access

  • Navigate to Web Apps management (web_apps.php)
  • Only admins can create and manage web apps
  • Apps are accessible via unique slug URLs

App Structure

Web apps consist of:

  • App Configuration: Name, slug, description, active status
  • Pages: Multiple pages with different content
  • Widgets: Content widgets on each page
  • Navigation: Page navigation system

App Configuration

Basic Settings

  • Name: Display name of the app
  • Slug: URL-friendly identifier (e.g., my-app)
  • Description: App description
  • Active Status: Enable/disable app

Access

Apps are accessed via:

/app.php?slug={app_slug}

Or with specific page:

/app.php?slug={app_slug}&page={page_id}

Pages

Page Types

Each page can contain different content types:

  • Map: Interactive map display
  • Dataset: Dataset viewer
  • Table: Data table
  • Chart: Data visualization

Page Configuration

  • Title: Page title
  • ID: Unique page identifier
  • Content Type: Map, dataset, table, or chart
  • Widgets: Content widgets on the page

Widgets

Map Widget

Interactive map with layers.

Configuration:

  • Dataset selection
  • Basemap selection
  • Layer styling
  • Initial extent

Dataset Widget

Dataset viewer widget.

Configuration:

  • Dataset selection
  • View mode (data/map/chart)
  • Display options

Table Widget

Data table display.

Configuration:

  • Dataset selection
  • Columns to display
  • Sorting and filtering
  • Pagination

Chart Widget

Data visualization.

Configuration:

  • Dataset selection
  • Chart type
  • X/Y axis configuration
  • Styling options

Building Web Apps

Step 1: Create App

  1. Navigate to Web Apps
  2. Click "New Web App"
  3. Enter name and slug
  4. Set description
  5. Save app

Step 2: Add Pages

  1. Open app editor
  2. Add new page
  3. Configure page settings
  4. Select content type
  5. Save page

Step 3: Configure Widgets

  1. Select page
  2. Add widgets
  3. Configure widget settings
  4. Link to datasets
  5. Save configuration

Step 4: Publish

  1. Set app to active
  2. Test app via slug URL
  3. Share app URL
  4. Monitor usage

Use Cases

Public Applications

  • Public data portals
  • Community applications
  • Information systems
  • Data exploration tools

Internal Tools

  • Internal dashboards
  • Workflow applications
  • Data entry systems
  • Reporting tools

Custom Solutions

  • Client-specific applications
  • Project-specific tools
  • Specialized interfaces
  • Branded applications

App Management

Editing

  • Edit app configuration
  • Modify pages
  • Update widgets
  • Change permissions

Publishing

  • Activate/deactivate apps
  • Set public/private access
  • Configure permissions
  • Monitor usage

Maintenance

  • Update content
  • Refresh data
  • Modify layouts
  • Add new pages

Permissions

Access Control

  • Public: Accessible without authentication
  • Private: Requires authentication
  • Group-based: Access by user groups
  • User-specific: Individual user access

Editing Permissions

  • Only admins can create/edit apps
  • App creators can edit their apps
  • Permissions can be delegated

Example Web App

A typical web app might include:

  1. Home Page: Overview with map and key statistics
  2. Data Page: Dataset browser and viewer
  3. Analysis Page: Analysis tools and results
  4. About Page: Information and documentation

API Access

Web apps can be accessed programmatically:

# Access app
GET /app.php?slug={app_slug}

# Access specific page
GET /app.php?slug={app_slug}&page={page_id}

Best Practices

Design

  • Keep navigation simple
  • Use consistent layouts
  • Optimize for mobile
  • Test across browsers

Content

  • Organize content logically
  • Use clear page titles
  • Provide navigation aids
  • Include help text

Performance

  • Optimize widget loading
  • Use efficient queries
  • Cache when appropriate
  • Monitor performance