DOCSEARCHbyAlgolia
Submit Docs

Nowa Documentation

website·Indexed 33 days ago

https://docs.nowa.dev

A visual builder and AI-powered platform for creating production-ready Flutter apps. Features include a hybrid approach combining visual design with custom code, GitHub integration for version control, a local project simulator via Nowa Desktop, and data connections for Supabase, Xano, and Swagger APIs.

Tokens
51.1K
Snippets
44
Records
532
Agent score
58%

What's inside Nowa

  1. Overview of Nowa Circuit logic builder

    Circuit is a visual logic builder in Nowa that allows developers to create application logic by connecting nodes in a vertical graph. The execution flow is sequential, processing nodes from top to bottom.

  2. Overview of Nowa Cloud vs Local projects

    Nowa allows projects to exist as Cloud projects, Local projects, or both via synchronization.

    • Cloud Projects: Offer one-click deployment to App Store, Play Store, or Web. They use a built-in previewer for testing, which may have limitations with custom code or packages.
    • Local Projects: Provide instant hot reload via local simulators and compatibility with local tools like VS Code and GitHub Desktop.
    • Synchronized Projects: By linking a cloud and local instance, developers can maintain both and sync changes between them with a single click.

  3. Overview of Git integration in Nowa

    Nowa integrates with Git and Git hosting services like GitHub to provide version control and collaboration. Key capabilities include:

    • Creating local Git repositories from Nowa projects to perform commits, discard changes, and manage branches.
    • Cloning remote repositories from GitHub (or other services) into Nowa Cloud to perform commit, push, pull, and branching operations.
    • Pushing Nowa Cloud projects directly to a Git hosting provider to create a remote repository.

  4. Overview of Parameters in Nowa

    Parameters in Nowa act as input fields that allow a Screen or Component to receive information from an external source. They are used to display dynamic data (e.g., passing a specific product's details to a product card).

    Key characteristics:

    • Read-only: Parameters do not change after being set; they only receive a value upon initialization. To update data dynamically, use variables instead.
    • Type-sensitive: Parameters must match the expected type of the widget they are linked to (e.g., a String for a Text widget).
    • Null Safety: If no value is passed and no default value is set, widgets connected to the parameter may throw null errors.

  5. Overview of Nowa's Hybrid Approach

    The Hybrid Approach in Nowa allows developers to combine visual app-building with traditional coding by maintaining a local Flutter project. This project can be opened simultaneously in Nowa and a preferred IDE (such as VS Code or Android Studio). Changes made in either the visual editor or the IDE are synchronized instantly, enabling a workflow where users can switch between visual development and manual coding at any stage.

  6. Overview of Nowa Layout Features

    Nowa provides a set of core layout tools to organize widgets and ensure designs are responsive across different screen sizes (mobile, tablet, and desktop). The primary layout mechanisms include:

    • Groups: Used to combine multiple widgets into a single unit for easier management.
    • Columns and Rows: Used to structure the design by arranging widgets either horizontally or vertically.
    • Constraints: Used to define how widgets behave and resize when the screen dimensions change.

  7. Overview of Nowa for Flutter Development

    Nowa is an all-in-one platform for designing, building, and deploying production-ready Flutter apps. It allows users to create apps using a combination of AI-driven code generation, visual building, and direct code editing. Key features include a Figma-like UI designer, a flowchart-based logic editor called 'Circuit', and a native desktop app for local project management. Nowa generates clean, scalable Flutter code that follows best practices, ensuring there is no vendor lock-in and allowing developers to export or edit the source code in any IDE.

  8. Overview of Global State in Nowa

    Global states in Nowa allow you to store data (e.g., shopping carts, user sessions, settings) that is accessible from any screen or component in the app. It behaves like a ChangeNotifier in Flutter, holding data and notifying listening widgets whenever that data changes.

  9. Overview of GridView modes in Nowa

    The GridView widget in Nowa is used to display data in a grid format and operates in two distinct modes:

    • Builder Mode: Used to connect the GridView to a data source (a variable or parameter of type list). This can be a local screen variable, a global state list, or data retrieved from an API, Firebase, or Supabase.
    • Normal Mode: Used to display a static group of widgets without connecting to an external data source.

  10. Control widget visibility using the Visibility wrapper

    The Visibility wrapper allows developers to conditionally display or hide widgets in a Flutter application. It is used to toggle UI elements based on state changes, manage layout complexity, or optimize performance by removing off-screen widgets from the widget tree.

  11. Utilize the Multi-Agent AI System (Nowa Agent 4)

    Nowa's AI system uses a multi-agent architecture where several subagents work in parallel to plan, build, and refine apps. This system is designed for complex logic, multi-screen generation, and advanced designs. Key capabilities include:

    • Platform File Management: The AI can manage permissions and packages in platform files, not just Dart files.
    • Smart Context Fetching: Efficiently reads only necessary project data to reduce credit consumption.
    • Automatic Board Integration: New screens generated by the AI are automatically placed on the board.

  12. Navigate the Nowa project interface

    The Nowa interface is divided into several key areas for app design, logic, and testing:

    • Toolbar: The top-level control center for adding elements, switching to play mode, and testing.
    • Properties Panel: Used to customize the appearance and behavior of screens and widgets.
    • Variables: Used to store and manipulate dynamic data (local variables) within a screen or component.
    • AI Assistant: Generates app parts automatically based on natural language descriptions.
    • API Collections: Manages connections and data sharing with external systems via APIs.
    • Play Mode & App Preview: Allows for immediate testing of layouts, widgets, and navigation, including a phone frame preview.
    • Test Mode (Simulator): Runs the app in a simulator or on a physical device for final verification.
    • Supabase Integration: Provides seamless connection to Supabase for databases, authentication, and file storage.
    • Themes: Centralized management of colors, fonts, and styles for project-wide consistency.
    • Widgets: The primary building blocks (text, buttons, layouts) used to construct the app UI.
    • Circuit: The visual logic editor where app responses to actions (e.g., button taps) are defined.