diff --git a/docs/ff-concepts/advanced/build_scalable_web_apps.md b/docs/ff-concepts/advanced/build_scalable_web_apps.md new file mode 100644 index 00000000..bdf0e3e5 --- /dev/null +++ b/docs/ff-concepts/advanced/build_scalable_web_apps.md @@ -0,0 +1,45 @@ +--- +keywords: ['build', 'application', 'pwa', 'scalable', 'flutterflow'] +slug: /concepts/advanced/build-scalable-web-apps +title: Build Scalable Web Applications with FlutterFlow +--- + +# Build Scalable Web Applications with FlutterFlow + +FlutterFlow allows you to build high-performance, client-side web applications—including Progressive Web Apps (PWAs) and internal tools—with a focus on scalability and maintainability. + +:::info[Prerequisites] +- A FlutterFlow account with a web-compatible project. +- A basic understanding of responsive design and Flutter widgets. +- (Optional) A hosting platform such as Firebase Hosting or Vercel for web deployment. +::: + +**Platform Capabilities** + + - **Client-side applications:** Build dashboards, PWAs, and internal or external apps. + - **Cross-platform deployment:** Publish to Android, iOS, Web, macOS, Windows, and Linux using Flutter. + - **Code export:** Download your full source code and continue development outside of FlutterFlow with no vendor lock-in. + +**Productivity and Reusability** + + - **Low-code builder:** Accelerate development using drag-and-drop functionality—up to 10x faster than traditional methods. + - **Design System:** Create themes and reusable components once and use them across multiple projects. + - **Shared libraries:** Consolidate and reuse custom code, actions, and APIs across your organization’s projects. + +**Integration and Extensibility** + + - **Third-party APIs:** Connect to any external service using REST APIs or custom code. + - **Custom components:** Build complex or reusable components in the design system and drag them into multiple screens or apps. + +**Pricing and Scalability** + + - **Developer-based subscription:** Billing is based on the number of team members, not end users. + - **No usage-based charges:** FlutterFlow does not charge based on the number of users or sessions. + - **External backend costs:** If you're using services like **Firebase** or **Supabase**, charges will be based on their pricing models. + +:::info[Additional Resources] +- **[FlutterFlow Documentation](/)** +- **[Manual Firebase Connection Setup](/integrations/firebase/connect-to-firebase/#connect-an-existing-firebase-project-manually)** +::: + +FlutterFlow provides a scalable, low-code platform for building web applications and PWAs. Its component-based design system, cross-platform support, and code export capabilities make it ideal for teams that need flexibility, speed, and full ownership over their codebase. diff --git a/docs/marketplace/creators-hub/creator-faqs.md b/docs/marketplace/creators-hub/creator-faqs.md index d498e93a..342769a7 100644 --- a/docs/marketplace/creators-hub/creator-faqs.md +++ b/docs/marketplace/creators-hub/creator-faqs.md @@ -79,11 +79,11 @@ We strive to maintain a high standard, but some items may not meet these expecta ### What is the criteria for getting my item approved for Marketplace? -Please see our [Item Submission Criteria](submission-criteria.md). +Please see our [Item Submission Criteria](docs/marketplace/creators-hub/submission-criteria.md). ### What happens if my item is rejected? -If your item is not approved, it will be returned to draft status, allowing you to make the required edits. We will provide you with detailed feedback via email, specifying the criteria it did not meet. You can see more details about our criteria and suggested actions [here](submission-criteria.md). You can then make the necessary adjustments and resubmit it for review. +If your item is not approved, it will be returned to draft status, allowing you to make the required edits. We will provide you with detailed feedback via email, specifying the criteria it did not meet. You can see more details about our criteria and suggested actions [here](docs/marketplace/creators-hub/submission-criteria.md). You can then make the necessary adjustments and resubmit it for review. ### When will my template be reviewed? diff --git a/docs/marketplace/creators-hub/creators-hub.md b/docs/marketplace/creators-hub/creators-hub.md index 638e8b0f..c02734ad 100644 --- a/docs/marketplace/creators-hub/creators-hub.md +++ b/docs/marketplace/creators-hub/creators-hub.md @@ -11,7 +11,7 @@ keywords: [FlutterFlow, MarketPlace, Creators Hub] Welcome to the FlutterFlow Marketplace Creators' Hub! This section is designed to provide you with all the necessary information to contribute effectively and responsibly to Marketplace. Whether you are submitting your first item or looking to understand the legal nuances, you'll find detailed guidelines and helpful tips here. ### **Submitting an Item for Review** -- Understand the [criteria](submission-criteria.md) we apply to items submitted to Marketplace. +- Understand the [criteria](docs/marketplace/creators-hub/submission-criteria.md) we apply to items submitted to Marketplace. - Learn how to prepare and [submit](submit-item-for-review.md) your items to the Marketplace with our step-by-step guide. ### **Legal Guidelines for Creators** diff --git a/docs/marketplace/creators-hub/submission-criteria.md b/docs/marketplace/creators-hub/submission-criteria.md index 51c62d91..45c328c7 100644 --- a/docs/marketplace/creators-hub/submission-criteria.md +++ b/docs/marketplace/creators-hub/submission-criteria.md @@ -1,5 +1,5 @@ --- -slug: submission-criteria +slug: resources/projects/submission-criteria title: Submission Criteria description: Learn about marketplace item submission criteria. tags: [MarketPlace, Creators Hub] @@ -22,7 +22,7 @@ Below, you'll find the criteria our Submission Review Team uses to review items - **What To Do:** - **If you're the sole creator:** Great! Make sure you're submitting the project from your own FlutterFlow account. - **If you're collaborating:** The project owner should be the one to submit it to Marketplace. Discuss this with your collaborators beforehand. - - **If you've acquired a project:** Ensure the original creator has officially [transferred ownership](../../resources/projects/how-to-collaborate-on-projects.md#transferring-project) rights to you. This may involve legal documentation, so it's important to handle it properly. + - **If you've acquired a project:** Ensure the original creator has officially rights to you. This may involve legal documentation, so it's important to handle it properly. #### 1.2 Significant Edits Made diff --git a/docs/marketplace/index.md b/docs/marketplace/index.md index 6168e2db..dec8ad1c 100644 --- a/docs/marketplace/index.md +++ b/docs/marketplace/index.md @@ -14,7 +14,7 @@ FlutterFlow's Marketplace is a dynamic platform designed to enhance your app dev In the FlutterFlow Marketplace, you can [add and purchase](adding-purchasing-item.md) items to quickly integrate into your projects, significantly reducing development time. The Marketplace is curated to ensure high-quality resources, with contributions from a diverse community of developers and designers. ## Becoming a Contributor -If you're interested in contributing to the Marketplace, the [creator hub](creators-hub/creators-hub.md) is your starting point. Here, you can learn about [submitting items for review](creators-hub/submit-item-for-review.md), [submission criteria](creators-hub/submission-criteria.md), and [legal guidelines](creators-hub/legal-guidelines-for-creators.md) for creators. Ensuring your submissions adhere to these guidelines helps maintain the quality and integrity of the Marketplace. +If you're interested in contributing to the Marketplace, the [creator hub](creators-hub/creators-hub.md) is your starting point. Here, you can learn about [submitting items for review](creators-hub/submit-item-for-review.md), [submission criteria](docs/marketplace/creators-hub/submission-criteria.md), and [legal guidelines](creators-hub/legal-guidelines-for-creators.md) for creators. Ensuring your submissions adhere to these guidelines helps maintain the quality and integrity of the Marketplace. ## Protecting Your Work Understanding and navigating [copyright (DMCA process)](creators-hub/copyright-dmca-process.md) is crucial for both creators and users. The Marketplace provides clear instructions on how to handle copyright issues, ensuring that intellectual property rights are respected. diff --git a/docs/resources/projects/add_team_members.md b/docs/resources/projects/add_team_members.md new file mode 100644 index 00000000..11983399 --- /dev/null +++ b/docs/resources/projects/add_team_members.md @@ -0,0 +1,102 @@ +--- +keywords: ['members', 'project', 'team'] +slug: /resources/projects/add-team-members +title: Add Team Members to a Project +--- + +# Add Team Members to a Project + +FlutterFlow enables project collaboration through user invitations, organization-level access, real-time editing, and activity tracking. You can assign different roles and permissions to manage how collaborators interact with your project. + +:::info[Prerequisites] +Ensure the invited user has a valid **FlutterFlow account** or an accessible email address to receive the invitation. +::: + +## Invite Team Members to a Project + +Follow these steps to invite team members and assign roles: + + 1. **Open the Project** + + Launch your FlutterFlow project. + + 2. **Navigate to Team Settings** + + In the left sidebar, go to **Settings & Integrations > Project Setup > Team**. + + 3. **Invite a User** + + Click **Invite User** and enter the email address of the person you want to add. + + 4. **Set Role and Send Invitation** + + Choose a role (**Editor**, **Read-only**, or **Owner**) and click **Invite**. + + ![](imgs/20250430121506784010.gif) + + The user's status will show as **Pending** until they accept the invitation. If they’re not yet registered with FlutterFlow, they will receive an email invitation to create an account. + + :::note + Each team member can only access features available under their individual FlutterFlow subscription. + ::: + +## Assigning Roles and Permissions + + When inviting collaborators, choose from the following roles: + + - **Editor**: Can edit the project. + - **Read-only**: Can view the project but cannot make changes. + - **Owner**: Full access, including administrative control. + + :::info + - The default role assigned is **Editor**. + - Read-only users cannot access shared team libraries like custom code or design systems. + - Read-only users added through *Teams* or *Organization* do not count against your team’s seat limit. + ::: + +## Share Project with an Organization + + You can share a project with all current and future team members in your organization by enabling the **Grant team members access** toggle in **Team Settings**. + + ![](imgs/share-with-team.avif) + + This ensures that every member of the organization can access the project without needing individual invitations. + +## Real-Time Collaboration + + Real-Time Collaboration allows multiple builders to work on the same page, component, or design system at once. All changes are visible instantly to everyone on the same page. + + ![](../../../static/img/real-time-collaboration.gif) + + This increases productivity by allowing simultaneous contributions without overwriting each other's work. + + :::info + Real-Time Collaboration is available only on **Teams** and **Enterprise** plans. + ::: + +## Transfer Project Ownership + + You can transfer ownership of a project to another user if needed. + + :::danger + This action is irreversible. To regain ownership, the new owner must transfer it back to you manually. + ::: + + To transfer ownership: + + 1. Go to **Settings & Integrations > Project Setup > Collaboration > Project-Level Access**. + 2. Click on the role of the current user. + 3. Select **Owner** from the dropdown. + + ![](imgs/transfer-ownership.avif) + +## View Project Activity + + Project Activity provides a timeline of changes made by all collaborators. It helps track progress and audit modifications across the project. + + ![](imgs/project-activity.avif) + + :::info + - **Teams** users can view the past 7 days of activity. + - **Enterprise** users can access and download the full activity history. + ::: diff --git a/docs/resources/projects/how-to-collaborate-on-projects.md b/docs/resources/projects/how-to-collaborate-on-projects.md deleted file mode 100644 index f7f49c21..00000000 --- a/docs/resources/projects/how-to-collaborate-on-projects.md +++ /dev/null @@ -1,93 +0,0 @@ ---- -slug: /resources/projects/collaboration -title: Collaborate on Projects -description: Learn how to collaborate effectively on projects in FlutterFlow, including best practices for teamwork and project management. -tags: [Collaboration, Project Management] -toc_max_heading_level: 5 -sidebar_position: 3 -keywords: [Collaboration, FlutterFlow, Project Management] ---- - -FlutterFlow allows for multiple ways to collaborate on a project as well as the -ability to manage the collaboration through permissions. - -## Sharing a Project with a User - -You can invite users to your project who are not part of your organization. -For instance, you might want to share your work with clients, stakeholders, or -team members of the client. - -![](imgs/invite-users.avif) - -When you invite users to your project, you have the flexibility to assign them -different roles depending on their level of involvement. For example, you can -grant **editing** privileges to collaborators who are actively working on the -project while assigning **read-only access** who need to view the progress. -Alternatively, you can also make them the **owner** of the project, giving them full -control. -:::info - -- When you add a user, the default role assigned is the *Editor* role. -- Users with read-only access will only be able to access that specific project - and won't be able to access any shared *Teams* libraries (e.g., custom code, - design system). -- Read-only users added to *Teams*/*Organization* will not count against your - *Teams* seat count. -- You must verify your email before inviting users. -- If a user isn't already a FlutterFlow user, we will send them an invite email. - Their status will be shown as **Pending** until they create an account. -- FlutterFlow subscriptions are seat based. A user added to your project will - only have access to the features of their account plan. - ::: - - -## Sharing a Project with an Organization - -To share a project with all current and future team members in your organization, enable the **Grant team members access** option. - -![share-with-team](imgs/share-with-team.avif) - -## Real-Time Collaboration - -Real-Time Collaboration is a powerful feature that allows multiple builders to -work together on the same project or, rather same page and design system -simultaneously. With this, all builders can see the changes being made to the -page as they happen and can also make their own changes to the page without -interfering with the work of others. - -This increases efficiency and productivity, as multiple builders can work on -various aspects of the project or together on the same page at the same time. - -When multiple builders are on the same page, it looks like this: - -![real-time-collaboration.gif](../../../static/img/real-time-collaboration.gif) - -:::info - -Real-Time collaboration is a feature of our Teams and Enterprise plans. - ::: - -## Transferring Project - -:::danger -This step can not be undone. If you want to regain project ownership, the new -project owner will need to transfer ownership back to you. -::: - -To transfer ownership to another user, navigate to **Settings & Integrations > Project Setup > Collaboration > Project-Level Access**, click on the current role and select **Owner**. - -![transfer-ownership.avif](imgs/transfer-ownership.avif) - -## Project Activity - -You can see a running history of changes made while building that helps you -track progress and stay up to date on project changes. This feature allows team -members to see all the updates made to a project in real-time, enabling them to -understand how the project is evolving and collaborate more efficiently. - -![project-activity](imgs/project-activity.avif) - -:::info -Teams users can access the last 7 days of project edits, while FlutterFlow -Enterprise users can access and download all previous project edits. -::: \ No newline at end of file diff --git a/docs/resources/projects/imgs/20250430121506784010.gif b/docs/resources/projects/imgs/20250430121506784010.gif new file mode 100644 index 00000000..70770a09 Binary files /dev/null and b/docs/resources/projects/imgs/20250430121506784010.gif differ diff --git a/docs/resources/projects/imgs/20250430121510782041.png b/docs/resources/projects/imgs/20250430121510782041.png new file mode 100644 index 00000000..51fd23f9 Binary files /dev/null and b/docs/resources/projects/imgs/20250430121510782041.png differ diff --git a/docs/resources/projects/join_flutterflow_community.md b/docs/resources/projects/join_flutterflow_community.md new file mode 100644 index 00000000..295d5c78 --- /dev/null +++ b/docs/resources/projects/join_flutterflow_community.md @@ -0,0 +1,39 @@ +--- +keywords: ['community', 'join', 'account issue'] +slug: /resources/projects/join-flutterflow-community +title: Join the FlutterFlow Community +--- + +# Join the FlutterFlow Community + +The FlutterFlow Community lives on a separate platform from your FlutterFlow editor account and requires a separate login. If you’re seeing errors like _"account not created"_ or _"password is wrong,"_ it’s likely because the community account hasn’t been set up yet. + +:::info[Prerequisites] +You must be a registered FlutterFlow user to join the community. +::: + +**Steps to Join the Community:** + + 1. From your **FlutterFlow Dashboard**, click on **Resources** in the left-hand menu. + + 2. Click **Join Community**. + + 3. Check your inbox for an email from `no-reply@circle.so`. + + 4. Open the email and click **Accept the Invitation**. + + 5. Complete the signup process by setting a password. + + ![](imgs/20250430121510782041.png) + + **Use the same email** associated with your FlutterFlow account to receive the invitation. + You can verify your email on your FlutterFlow Account Settings. + +**Common Issues:** + + - **Didn’t receive the invite?** + Check your spam or promotions folder for an email from `no-reply@circle.so`. + + - **Email mismatch?** + If you used a different email to sign up for FlutterFlow, the invitation may not arrive. Confirm your registered email in your FlutterFlow account. + diff --git a/docs/testing-deployment-publishing/imgs/20250430121500306046.png b/docs/testing-deployment-publishing/imgs/20250430121500306046.png new file mode 100644 index 00000000..11130aec Binary files /dev/null and b/docs/testing-deployment-publishing/imgs/20250430121500306046.png differ diff --git a/docs/testing-deployment-publishing/publishing/build_web_apps.md b/docs/testing-deployment-publishing/publishing/build_web_apps.md new file mode 100644 index 00000000..5cd92a68 --- /dev/null +++ b/docs/testing-deployment-publishing/publishing/build_web_apps.md @@ -0,0 +1,40 @@ +--- +keywords: ['build', 'websites', 'apps'] +slug: deployment/build-web-apps +title: Build Web Applications with FlutterFlow +--- + +# Build Web Applications with FlutterFlow + +FlutterFlow can generate code that runs as a web application. However, there are important limitations and platform-specific issues to keep in mind. + +:::info[Prerequisites] +- A FlutterFlow project with web as a selected platform. +- Familiarity with Flutter Web deployment using the Flutter CLI. +- Access to a third-party hosting service (e.g., Firebase Hosting, Vercel). +::: + +**Web Support Status** + + :::note + Flutter Web is not officially supported in FlutterFlow. However, the generated code can still be compiled and run as a web app using Flutter tools. + ::: + + While the platform can generate code suitable for web, some features may not behave consistently across all browsers or devices. + +**Platform Limitations** + - **Scrolling issues on iOS Safari.** + - **Video playback limitations:** Native video and YouTube players may not function correctly on iOS web. + +**Deployment Considerations** + + FlutterFlow does not currently offer direct deployment to the web from its interface. To publish your app: + + 1. Export the Flutter project from FlutterFlow. + 2. Follow the **[Flutter Web Deployment Guide](https://flutter.dev/docs/deployment/web#deploying-to-the-web)** for instructions on building and deploying your app. + +:::info[Additional Resources] +- **[Flutter Web Deployment Guide](https://flutter.dev/docs/deployment/web#deploying-to-the-web)** +::: + +FlutterFlow supports generating web-compatible code, which can be deployed using Flutter tools. However, because Flutter Web is not officially supported, some features—especially on iOS—may be limited. Deployment must be handled manually using an external platform or CLI. diff --git a/docs/testing-deployment-publishing/publishing/web-publishing.md b/docs/testing-deployment-publishing/publishing/web-publishing.md index 6b960048..5cab2ac3 100644 --- a/docs/testing-deployment-publishing/publishing/web-publishing.md +++ b/docs/testing-deployment-publishing/publishing/web-publishing.md @@ -174,7 +174,9 @@ Adding a custom domain to your web app can give it a more professional look and :::info[Important] - Only *Pro* and *Teams* plans include **one** free custom domain. The *Teams* plan comes with one custom domain for the whole team. If you are on the *Standard* plan, you will need to purchase a custom domain, as it is not included in the plan for free. -- Only paid plans can purchase domains. *Standard* and *Pro* users can buy from their *Account* page, and Teams owners can buy it from **[My Organization](../../resources/projects/how-to-collaborate-on-projects.md#sharing-a-project-with-an-organization)**. + +- Only paid plans can purchase domains. *Standard* and *Pro* users can buy from their *Account* page, and Teams owners can buy it. + - A single custom domain slot can be linked to only one domain or subdomain. - You can connect only one domain to a project, which can be either a root domain (like 'myapp.com') or a subdomain (such as 'beta.myapp.com'). That means if you connect a root domain, none of the subdomains under it will connected to the project. This leads to the rule of '*One project => One domain OR subdomain'*. diff --git a/docs/testing-deployment-publishing/testing/submit_bug_report.md b/docs/testing-deployment-publishing/testing/submit_bug_report.md new file mode 100644 index 00000000..20e064be --- /dev/null +++ b/docs/testing-deployment-publishing/testing/submit_bug_report.md @@ -0,0 +1,33 @@ +--- +keywords: ['submit', 'report'] +slug: testing/submit-bug-report +title: Submit a Bug Report in FlutterFlow +--- + +# Submit a Bug Report in FlutterFlow + +If you encounter a bug while working in FlutterFlow, you can report it directly from the app. Providing detailed information helps us investigate and resolve issues faster. + +:::info[Prerequisites] +You must be logged in to your FlutterFlow account to submit a bug report. +::: + +Follow the steps below to submit a bug report: + + 1. In your project, click the **Help** icon in the top navigation bar. + 2. Select **Bug Report** from the dropdown. + 3. Fill out the bug report form with as much detail as possible. + + ![](../imgs/20250430121500306046.png) + + Include the following details: + + - **Project link** — Copy the project URL from your browser. + - **Impacted area** — Specify the page, widget, or feature affected (e.g., custom function name). + - **Expected behavior** — What you expected to happen. + - **Observed behavior** — What actually happened instead. + + This information ensures that our engineering team can replicate and resolve the issue quickly. + + Once submitted, your report is reviewed by our team. We prioritize bugs based on severity, impact, and reproducibility. + diff --git a/docs/troubleshooting/assets/20250430121135729633.png b/docs/troubleshooting/assets/20250430121135729633.png new file mode 100644 index 00000000..3f07ea69 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121135729633.png differ diff --git a/docs/troubleshooting/assets/20250430121136034392.png b/docs/troubleshooting/assets/20250430121136034392.png new file mode 100644 index 00000000..a1414594 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121136034392.png differ diff --git a/docs/troubleshooting/assets/20250430121308006359.png b/docs/troubleshooting/assets/20250430121308006359.png new file mode 100644 index 00000000..7079efe8 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121308006359.png differ diff --git a/docs/troubleshooting/assets/20250430121308259919.png b/docs/troubleshooting/assets/20250430121308259919.png new file mode 100644 index 00000000..d2c37a83 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121308259919.png differ diff --git a/docs/troubleshooting/assets/20250430121358899145.png b/docs/troubleshooting/assets/20250430121358899145.png new file mode 100644 index 00000000..cc0a6fe2 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121358899145.png differ diff --git a/docs/troubleshooting/assets/20250430121359193430.gif b/docs/troubleshooting/assets/20250430121359193430.gif new file mode 100644 index 00000000..daacae3e Binary files /dev/null and b/docs/troubleshooting/assets/20250430121359193430.gif differ diff --git a/docs/troubleshooting/assets/20250430121359717912.gif b/docs/troubleshooting/assets/20250430121359717912.gif new file mode 100644 index 00000000..44064505 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121359717912.gif differ diff --git a/docs/troubleshooting/assets/20250430121409872946.png b/docs/troubleshooting/assets/20250430121409872946.png new file mode 100644 index 00000000..4e29ca4e Binary files /dev/null and b/docs/troubleshooting/assets/20250430121409872946.png differ diff --git a/docs/troubleshooting/assets/20250430121410100752.png b/docs/troubleshooting/assets/20250430121410100752.png new file mode 100644 index 00000000..afd4fe58 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121410100752.png differ diff --git a/docs/troubleshooting/assets/20250430121448708197.png b/docs/troubleshooting/assets/20250430121448708197.png new file mode 100644 index 00000000..4ebba77a Binary files /dev/null and b/docs/troubleshooting/assets/20250430121448708197.png differ diff --git a/docs/troubleshooting/assets/20250430121448932578.png b/docs/troubleshooting/assets/20250430121448932578.png new file mode 100644 index 00000000..f532dcc8 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121448932578.png differ diff --git a/docs/troubleshooting/assets/20250430121449131367.png b/docs/troubleshooting/assets/20250430121449131367.png new file mode 100644 index 00000000..54646b93 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121449131367.png differ diff --git a/docs/troubleshooting/assets/20250430121454192491.gif b/docs/troubleshooting/assets/20250430121454192491.gif new file mode 100644 index 00000000..a8d21912 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121454192491.gif differ diff --git a/docs/troubleshooting/assets/20250430121456146976.gif b/docs/troubleshooting/assets/20250430121456146976.gif new file mode 100644 index 00000000..27f83477 Binary files /dev/null and b/docs/troubleshooting/assets/20250430121456146976.gif differ diff --git a/docs/troubleshooting/backend/fix_sqlite_errors.md b/docs/troubleshooting/backend/fix_sqlite_errors.md new file mode 100644 index 00000000..663890b7 --- /dev/null +++ b/docs/troubleshooting/backend/fix_sqlite_errors.md @@ -0,0 +1,155 @@ +--- +keywords: ['database', 'configuration', 'error'] +slug: /troubleshooting/backend/fix-sqlite-errors +title: Resolve Common SQLite Errors +--- + +# Resolve Common SQLite Errors + +SQLite is a lightweight local database engine supported in FlutterFlow for building offline-first applications. However, configuration or query issues can result in runtime errors or unexpected behavior. + +This guide covers the most common SQLite issues and provides step-by-step solutions to help you resolve them efficiently. + +:::info[Prerequisites] +- Add and configure your SQLite database under **Settings > Local State**. +- SQLite is not supported on the web. Always test on a physical device or emulator. +::: + +- **Database Configuration Errors** + + - Capitalization in Configuration File + + Ensure the first letter of each word in your database configuration file is capitalized. Incorrect capitalization may lead to setup issues. + + ![](../assets/20250430121135729633.png) + + - Unset Variable Values + + Verify that all database variables are initialized with valid values. + + ![](../assets/20250430121136034392.png) + + +- **Late Initialization Error** + + - Late Initialization Error + + This error typically occurs when testing SQLite on the web, which is unsupported. + + :::tip + Download and run your application on a physical device or emulator to test SQLite functionality. + ::: + +- **Syntax Errors in Queries** + + - READ Query Best Practices + + Follow these guidelines to avoid syntax errors when using `SELECT` statements: + + - **Basic SELECT Query** + + ```sql + SELECT column1, column2 FROM table_name; + ``` + + - **Select All Columns** + + ```sql + SELECT * FROM employees; + ``` + + - **Use WHERE for Filtering** + + ```sql + SELECT * FROM employees WHERE department = 'Sales'; + ``` + + - **Use Logical Operators** + + ```sql + SELECT * FROM employees WHERE department = 'Sales' AND salary > 50000; + ``` + - **Sort with ORDER BY** + + ```sql + SELECT * FROM employees ORDER BY last_name ASC; + ``` + - **Limit Result Set** + + ```sql + SELECT * FROM employees LIMIT 10; + ``` + - **Column Aliases** + + ```sql + SELECT first_name AS "First Name", last_name AS "Last Name" FROM employees; + ``` + - **Use JOIN for Multiple Tables** + + ```sql + SELECT e.first_name, d.department_name + FROM employees e + INNER JOIN departments d ON e.department_id = d.department_id; + ``` + - **Use Parameterized Queries** + + ```sql + SELECT * FROM employees WHERE department = ?; + ``` + - **Follow Naming Conventions** + + Use lowercase letters and underscores for clarity and consistency: + `employee_id`, `department_name`, etc. + + - **UPDATE Query Best Practices** + + - **Update a Single Field** + + ```sql + UPDATE employees SET salary = 60000 WHERE id = 1; + ``` + - **Update Multiple Fields** + ```sql + UPDATE employees SET email = 'new@example.com', phone = '1234567890' WHERE id = 1; + ``` + - **Use Parameter Placeholders** + ```sql + UPDATE employees SET email = ?, phone = ? WHERE id = ?; + ``` + - **Use Another Column in SET** + ```sql + UPDATE employees SET salary = bonus + 500 WHERE department = 'Sales'; + ``` + - **Use CASE for Conditional Updates** + + ```sql + UPDATE orders + SET status = CASE + WHEN payment_received = 1 THEN 'Paid' + ELSE 'Pending' + END + WHERE order_date < '2023-01-01'; + ``` + - **Update All Rows (Use with Caution)** + + ```sql + UPDATE employees SET is_active = 0; + ``` + + :::warning + Avoid running `UPDATE` queries without a `WHERE` clause unless you're absolutely certain. This can unintentionally affect all rows. + ::: + - **Wrap Updates in Transactions** + + Use `BEGIN`, `COMMIT`, and `ROLLBACK` when performing multiple updates to maintain data integrity. + +**Testing & Tools** + + :::tip + Use **[SQLite Online](https://sqliteonline.com/)** to test and validate your queries before using them in FlutterFlow. + ::: + +:::info[Additional Resources] +- **[SQLite Documentation](https://www.sqlite.org/docs.html)** +- **[SQLite Online Tool](https://sqliteonline.com/)** +::: \ No newline at end of file diff --git a/docs/troubleshooting/backend/generate_sha_certificates_flutterflow.md b/docs/troubleshooting/backend/generate_sha_certificates_flutterflow.md new file mode 100644 index 00000000..cddf0cd8 --- /dev/null +++ b/docs/troubleshooting/backend/generate_sha_certificates_flutterflow.md @@ -0,0 +1,46 @@ +--- +keywords: ['generate', 'certificates', 'flutterflow'] +slug: /troubleshooting/backend/generate-sha-certificates-flutterflow +title: How to Generate SHA Certificates in FlutterFlow +--- + +# How to Generate SHA Certificates in FlutterFlow + +FlutterFlow makes it easy to generate the necessary **SHA certificates** using the **Automatic Firebase Setup** feature. These certificates are required for enabling Firebase integrations like authentication, dynamic links, and more. + +:::info[Prerequisites] +You must have connected your project to Firebase using FlutterFlow’s **Automatic Firebase Setup**. +::: + +Ways to generate SHA Certificates in FlutterFlow: + +- **Automatically Generating SHA Certificates** + + When you use **Automatic Firebase Setup**, FlutterFlow automatically generates the required SHA certificates for you. These certificates are: + + - **SHA-1** + - **SHA-256** + + The generated SHA values are automatically uploaded to your Firebase project and stored under your app settings in the Firebase console. + +- **Manually Generating or Replacing SHA Certificates** + + If you prefer to manually generate or update your SHA certificates, follow the steps below: + + 1. Open **Android Studio** or a terminal with **Java Development Kit (JDK)** installed. + + 2. Run the following command to generate the SHA-1 certificate: + + ```bash + keytool -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore -storepass android -keypass android + ``` + + 4. Locate the SHA-1 and SHA-256 values in the output. + + 5. Go to your Firebase Console: + - Select your project. + - Navigate to Project Settings > General. + - Under Your apps, find your Android app. + - Click Add Fingerprint and paste the SHA-1 or SHA-256 values. + + 6. Save your changes. \ No newline at end of file diff --git a/docs/troubleshooting/custom-actions/import_flutter_package.md b/docs/troubleshooting/custom-actions/import_flutter_package.md new file mode 100644 index 00000000..1dd1c487 --- /dev/null +++ b/docs/troubleshooting/custom-actions/import_flutter_package.md @@ -0,0 +1,51 @@ +--- +keywords: ['flutter', 'package', 'import'] +slug: /troubleshooting/custom-actions/import-flutter-package +title: Import a Flutter Package into FlutterFlow +--- + +# Import a Flutter Package into FlutterFlow + +You can enhance your FlutterFlow project by importing packages from **[pub.dev](https://pub.dev)**. These packages are used in **Custom Actions** or **Custom Widgets** to extend functionality beyond what’s available in the UI builder. + +:::info[Prerequisites] +Before importing a package, ensure you’ve created a **Custom Action** or **Custom Widget** within FlutterFlow. +::: + +Follow the steps below to import a Flutter package into FlutterFlow: + +1. **Get the Package Name and Version** + + To add a dependency to your custom code: + + 1. Go to the package page on **[pub.dev](https://pub.dev)**. + 2. Click the **Copy** icon next to the package name and version. + + ![](../assets/20250430121358899145.png) + + 3. Paste the copied line into the **Required Pubspec Dependencies** field in the FlutterFlow custom code form. + + ![](../assets/20250430121359193430.gif) + + Example: + `http: ^1.2.3` + +2. **Add the Import Statement** + + To use the package in your code, you'll need to import it: + + 1. On the same pub.dev package page, click the **Installing** tab. + 2. Under **Import it**, click the **Copy** icon next to the import statement. + 3. Paste it at the top of your Custom Widget or Custom Action code. + + ![](../assets/20250430121359717912.gif) + + Example: + `import 'package:http/http.dart';` + +3. **Tips for Using Custom Code** + + - **Web Support**: Ensure the package supports **Flutter Web** for use in FlutterFlow’s Run/Test mode. + - **Correct Format**: Use the correct format: `package_name: ^version_number`. Not including a version may result in outdated or unstable dependencies. + - **Recompile**: Always recompile your custom widget or action after adding new parameters. + - **Safe Deletion**: You cannot delete a custom widget or action if it's currently in use. Remove it from all screens first. \ No newline at end of file diff --git a/docs/troubleshooting/deployment/change_package_name_flutterflow.md b/docs/troubleshooting/deployment/change_package_name_flutterflow.md new file mode 100644 index 00000000..c4f57523 --- /dev/null +++ b/docs/troubleshooting/deployment/change_package_name_flutterflow.md @@ -0,0 +1,40 @@ +--- +keywords: ['package', 'application', 'change'] +slug: /troubleshooting/deployment/change-package-name-flutterflow +title: Change the Package Name of an Application in FlutterFlow +--- + +# Change the Package Name of an Application in FlutterFlow + +When working with Firebase or deploying your app, it's important that your **FlutterFlow app package name** matches what you've registered elsewhere (e.g., in Firebase or on app stores). This article shows you how to change the **package name** directly within FlutterFlow. + +:::info[Prerequisites] +Make sure you've updated the package name in any external services (like Firebase or Google Play Console) **before** changing it in FlutterFlow. +::: + +Follow the steps to change the package name: + +1. Open your project in **FlutterFlow**. + +2. From the left navigation menu, go to **Settings & Integrations**. + + ![Settings and Integrations page](../assets/20250430121448708197.png) + +3. In the **Project Setup** section, find the **App Details** panel. Click the **edit icon** next to the package name field. + + ![Edit package name icon](../assets/20250430121448932578.png) + +4. Update the **Package Name** (e.g., `com.yourcompany.appname`) and/or **App Name** as needed. + +5. Click the **checkmark icon** to save your changes. + + ![Save changes icon](../assets/20250430121449131367.png) + +:::info[Best Practices] +- Use **reverse domain notation** (e.g., `com.example.myapp`) for package names. +- Be consistent—your Firebase project and other third-party integrations should use the same package name. +- After making changes, verify that your app builds correctly and that Firebase integrations continue to work. +::: + +Changing your app’s package name in FlutterFlow is simple but important. Just go to your project’s settings, edit the name, and make sure it matches external configurations like Firebase or app stores. + diff --git a/docs/troubleshooting/deployment/disable_watchos_app_store_connect.md b/docs/troubleshooting/deployment/disable_watchos_app_store_connect.md new file mode 100644 index 00000000..4e8bd984 --- /dev/null +++ b/docs/troubleshooting/deployment/disable_watchos_app_store_connect.md @@ -0,0 +1,39 @@ +--- +keywords: ['connect', 'store', 'turn'] +slug: /troubleshooting/deployment/disable-watchos-app-store-connect +title: Disable watchOS Deployment in App Store Connect +--- + +# Disable watchOS Deployment in App Store Connect + +When deploying your FlutterFlow app to the App Store, you might encounter an error related to **watchOS**. This typically happens if the build includes watchOS support that isn't needed for your app. + +This article explains how to disable the **watchOS** option for a specific App ID in your Apple Developer account. + +:::info[Prerequisites] +You must have access to the Apple Developer portal and appropriate permissions to manage App IDs. +::: + +## Steps to Disable watchOS for an App + + Follow these steps to turn off watchOS support for a specific app: + + 1. **Sign in** to your **[Apple Developer account](https://developer.apple.com/)**. + + 2. From the dashboard, click **Certificates, Identifiers & Profiles**. + + 3. In the left-hand menu, choose **Identifiers**, then click **App IDs**. + + 4. Locate the App ID associated with your FlutterFlow project and click **Edit**. + + 5. Scroll to the **WatchKit App** section. + + 6. **Uncheck** the box labeled **Enable for this App ID**. + + 7. Click **Continue**, then **Save** your changes. + +:::note +- This change applies **only** to the App ID you edited. +- To disable watchOS for other apps, repeat these steps for each App ID individually. +::: + diff --git a/docs/troubleshooting/deployment/enable_windows_platform.md b/docs/troubleshooting/deployment/enable_windows_platform.md new file mode 100644 index 00000000..9ecf50e4 --- /dev/null +++ b/docs/troubleshooting/deployment/enable_windows_platform.md @@ -0,0 +1,32 @@ +--- +keywords: ['enable', 'support', 'windows'] +slug: /troubleshooting/deployment/enable-windows-platform +title: Enable Windows Platform +--- + +# Enable Windows Platform + +You can enable Windows support in your FlutterFlow project to generate apps compatible with the Windows operating system. This setting is available in the **Platforms** section of your project configuration. + +:::info[Prerequisites] +- A FlutterFlow project already created. +- Desktop development enabled in your Flutter environment (when exporting code). +::: + +:::note +Windows support is currently in **alpha** and may not work as expected, particularly on older versions of Windows. +::: + +Follow the steps below to enable windows platform: + + 1. Open your FlutterFlow project. + 2. From the left-hand navigation menu, select **Settings and Integrations**. + 3. Under the **Project Setup** section, click on **Platforms**. + 4. Toggle the switch next to **Windows (alpha)** to enable Windows support. + + ![](../assets/20250430121456146976.gif) + + Once enabled, your project will generate Windows-compatible source code when exporting. + + +Enabling Windows support in FlutterFlow allows you to generate desktop apps for the Windows platform. Although currently in alpha, this feature can help you prototype and test desktop builds directly from FlutterFlow. diff --git a/docs/troubleshooting/deployment/fix_project_not_saving.md b/docs/troubleshooting/deployment/fix_project_not_saving.md new file mode 100644 index 00000000..9f3948f6 --- /dev/null +++ b/docs/troubleshooting/deployment/fix_project_not_saving.md @@ -0,0 +1,44 @@ +--- +keywords: ['saving', 'changes', 'issue'] +slug: /troubleshooting/deployment/fix-project-not-saving +title: Fix Project Not Saving Issue +--- + +# Fix Project Not Saving Issue + +If your FlutterFlow project is not saving changes, you may have exceeded the project size limit. This can prevent edits from being saved or synced. Use the developer console to confirm if the issue is size-related. + +**Check for Project Size Limit Errors** + + You can verify the issue by using the browser console in Google Chrome: + + 1. Press **F12** to open Chrome DevTools. + 2. Select the **Console** tab. + 3. Continue working in your FlutterFlow project. + 4. Watch for error messages related to project size. + + ![](../assets/20250430121308006359.png) + + ![](../assets/20250430121308259919.png) + + If the error indicates you've hit the size limit, FlutterFlow currently does **not** support increasing this limit. + +**Optimize Your Project to Reduce Size** + + To resolve the issue, follow these steps to reduce your project size: + + 1. **Remove unused assets:** Delete unnecessary images and files in your assets folder. When possible, upload files to **Firebase Storage** and use their URLs. + 2. **Clean up temporary pages/components:** Delete test or draft pages that are no longer needed. + 3. **Use cloned projects for backups:** If you're holding on to elements “just in case,” move them into a clone of the project. + 4. **Remove unused UI elements:** Save a snapshot/version before cleanup. You can always recover elements from previous versions. + 5. **Use reusable components:** Convert repeating UI elements into components to reduce duplication. + 6. **Simplify repeated pages:** If the same layout is repeated, make it dynamic or convert it into a modal. + + :::warning + There is currently no way to increase the maximum project size in FlutterFlow. + ::: + + :::tip + Keeping your project optimized not only avoids size issues but also improves performance and loading times during development. + ::: + diff --git a/docs/troubleshooting/errors/_category_.json b/docs/troubleshooting/errors/_category_.json new file mode 100644 index 00000000..24e31225 --- /dev/null +++ b/docs/troubleshooting/errors/_category_.json @@ -0,0 +1,3 @@ +{ + "label": "Errors" + } \ No newline at end of file diff --git a/docs/troubleshooting/general-issues/reduce_project_size.md b/docs/troubleshooting/general-issues/reduce_project_size.md new file mode 100644 index 00000000..6abb7072 --- /dev/null +++ b/docs/troubleshooting/general-issues/reduce_project_size.md @@ -0,0 +1,43 @@ +--- +keywords: ['limit', 'size', 'optimize', 'reduce project size'] +slug: /troubleshooting/general-issues/reduce-project-size +title: Reduce Project Size in FlutterFlow +--- + +# Reduce Project Size in FlutterFlow + +As your FlutterFlow application grows, you may encounter a warning or restriction due to exceeding the project size limit. This typically occurs when there are too many pages, assets, or repeated configurations within the project. + +This article outlines best practices to help optimize and reduce your project’s size without compromising functionality. + +![](../assets/20250430121409872946.png) + +:::info[Prerequisites] +No special configuration is required to apply these optimizations. +::: + +Follow these best practices to minimize your project size: + + 1. **Remove Unused Pages** + Delete any pages that are no longer needed in your project. Each unused page adds to the total project weight and may slow down compilation. + + 2. **Use Network Paths for Large Media** + For large assets like videos or audio files, use hosted URLs instead of uploading them directly into your FlutterFlow assets. + + 3. **Avoid Repeating Actions** + If the same action is used multiple times across widgets or pages, consider using a custom function or variable instead of duplicating logic. + + ![](../assets/20250430121410100752.png) + + :::tip + Consolidating repeated actions not only reduces size but also makes future maintenance easier. + ::: + +:::tip +- Consolidate themes and styles to avoid duplication. +- Remove unused assets from the asset manager. +- Split large applications into smaller feature-based projects if necessary. +::: + +By following these best practices, you can keep your project size manageable and ensure a more stable development experience within FlutterFlow. + diff --git a/docs/troubleshooting/general-issues/transfer_project_another_user.md b/docs/troubleshooting/general-issues/transfer_project_another_user.md new file mode 100644 index 00000000..e20becfa --- /dev/null +++ b/docs/troubleshooting/general-issues/transfer_project_another_user.md @@ -0,0 +1,43 @@ +--- +keywords: ['transfer', 'project ownership', 'change owner'] +slug: /troubleshooting/general-issues/transfer-project-another-user +title: Transfer a Project to Another User in FlutterFlow +--- + +# Transfer a Project to Another User in FlutterFlow + +You can easily transfer ownership of a FlutterFlow project to another user on your team. This is useful when you’re handing off a project or want someone else to manage it going forward. + +:::warning +**This action cannot be undone.** +Once transferred, only the new project owner can initiate a transfer back to you. +::: + +:::info[Prerequisites] +- The person you want to transfer the project to **must already be added** to the project. +- Their status in the **Team** section must be **Active** (i.e., not pending). +- You must be the **current project owner**. +::: + +Follow the steps belpw to transfer project ownership: + + 1. Open your project in FlutterFlow. + + 2. From the left navigation menu, go to **Settings & Integrations**. + + 3. Under the **Project Setup** section, click **Team**. + + 4. Locate the team member you want to make the new owner. + + 5. Click their current **role** (e.g., Editor). + + 6. In the popup that appears, confirm the transfer by selecting **Yes**. + + ![Transfer ownership animation](../assets/20250430121454192491.gif) + + **After the Transfer:** + + - You will become a **collaborator** on the project with the same access level you had before, minus ownership rights. + - The new owner can now manage billing, collaborators, and future transfers. + + diff --git a/docs/troubleshooting/misc/google_login_issue.md b/docs/troubleshooting/misc/google_login_issue.md new file mode 100644 index 00000000..383038a2 --- /dev/null +++ b/docs/troubleshooting/misc/google_login_issue.md @@ -0,0 +1,40 @@ +--- +keywords: ['logins', 'like', 'google'] +slug: /troubleshooting/misc/google-login-issue +title: Fix Google Login Issues During Sign Up +--- + +# Fix Google Login Issues During Sign Up + +If you're unable to sign up for FlutterFlow using Google or another social login and see an error like: + + ```text + Cross-Origin-Opener-Policy policy would block the window.closed call.` + ``` + + This issue is commonly caused by your browser blocking pop-ups and redirects, especially on new or freshly installed Chrome profiles. + +:::info[Prerequisites] +This article is intended for users who are signing up for a FlutterFlow account using Google or another social login. +::: + +To resolve the Google Login Sign-Up issue, enable pop-ups and redirects for FlutterFlow in your browser: + + 1. **Open Site Settings** + + - Click the **lock icon** next to the URL in your browser’s address bar. + - Choose **Site settings** from the dropdown. + + 2. **Allow Pop-ups and Redirects** + + - Scroll down to the **Pop-ups and redirects** section. + - Set it to **Allow**. + +If enabling pop-ups doesn’t resolve the issue: + + - Try using another browser (e.g., Firefox or Edge). + - Ensure no browser extensions are blocking authentication. + - Restart the browser and attempt login again. + +If the issue persists, [contact FlutterFlow support](mailto:support@flutterflow.io) for further assistance. + diff --git a/sidebars.ts b/sidebars.ts index 2a0d47de..f08df0cd 100644 --- a/sidebars.ts +++ b/sidebars.ts @@ -55,7 +55,7 @@ const sidebars: SidebarsConfig = { }, { type: 'category', - label: 'Building Concepts', + label: 'ts', collapsed: true, link: { type: 'generated-index',