User Guide

This section collects the main guides you need for day-to-day work with ngapp: installation, concepts, components, visualizations, deployment, testing, and practical tips.

If you are completely new, start with Getting Started and then continue with Concepts & Architecture and Components.

• Getting Started
  • Installation
  • Creating your first app
  • First edits
  • Generated project layout
  • Next steps
• Concepts & Architecture
  • What is an app?
  • Components and the UI tree
  • State & event handling
  • Development workflow
  • Where to go next
• Components
• Quick Example
• Component Overview
• Basic Quasar Components
  • QBtn — Button
  • QInput — Text Input
  • QCheckbox — Checkbox
  • QCard — Card Layout
• Helper Components
  • Row — Horizontal Layout
  • Col — Vertical Layout
  • Div — Generic Container
  • FileName — File Name Input
  • Heading — Text Heading
  • FileUpload — File Upload Widget
  • SaveSimulationButton — Save Simulation Button
• Component Arguments and Customization
• Building Custom Components
• Styling Components: ui_style and ui_class
• Next Steps
• Visualization
  • PlotlyComponent
  • WebgpuComponent
  • VtkComponent
• User-wide app settings
  • Overview
  • Typical use case
  • How it works
  • Storage layout and location
  • Additional JSON settings files
  • Notes and recommendations
• Deployment
  • Running locally
  • GitHub Pages and static hosting
  • Where to go next
• Testing ngapp applications
  • Calculation tests (state/snapshot based)
  • End-to-end (browser) tests with Playwright
• Advanced Topics
  • Printing
  • JavaScript Integration