Web apps

In TeleportHQ, a web app is a project that uses server features (workflows, user sign-in, a store, bookings, a blog or help center, an admin panel, an AI chatbot); it publishes from TeleportHQ, can't be downloaded as code, and needs a Web App slot to keep running after 7 days, while show/hide, pop-ups and browser widgets work in websites too.

In TeleportHQ, a website becomes a web app when you add a server feature (a workflow, user sign-in, a store, a blog, bookings, an admin panel or an AI chatbot) and click Enable Web App features in the window that opens; show/hide, pop-ups and browser widgets don't need it, and you undo the change by restoring the backup saved right before it.

In TeleportHQ, each web app needs its own Web App slot to keep publishing and running; a web app without one gets 7 days of full access with a watermark, then its site goes offline and it is archived until you add a slot, and it is never deleted.

In TeleportHQ, you add interactive elements such as calendars, kanban boards, countdowns, tabs, QR codes and drag-and-drop lists from Elements → Primitives and set them up in the right panel; they run in the visitor's browser, so they work in websites too, and only Autocomplete, Site Search, Newsletter Signup and Upload Asset ask to make the project a web app.

In TeleportHQ, you add a pop-up by clicking a card in Elements → Primitives → Modals (Confirmation, Information, Details, Form or Slider), then choosing which element opens it; TeleportHQ wires the close button and backdrop for you, and pop-ups work in websites as well as web apps.

In TeleportHQ, you add an AI chatbot for your visitors from Plugins → AI assistant chat in the left sidebar: switch it on, pick a database, add your OpenAI API key, choose a model (GPT-4o mini is recommended) and what the chatbot should know; the chat answers visitors on your published web app.

In TeleportHQ, you add your own OpenAI, Anthropic, Google, Cohere, Mistral AI, Meta (a Together AI key) or Perplexity API key under Project settings → Credentials → AI Providers; the AI steps in your web app's workflows (and, for OpenAI, the AI chatbot) then run on your key, and the provider bills you directly.

A workflow in TeleportHQ is a visual recipe that makes your web app do something, one trigger (like a button click or a form submission) followed by steps (like saving to a database, sending an email or opening a page), built without writing code; adding one makes a website a web app.

In TeleportHQ, open the Workflows panel in the editor's left sidebar, click Add Workflow, replace the starting trigger with the one you need, then add and set up each step on the workflow canvas; copy, paste and tidy steps from the canvas.

In TeleportHQ, select the button on the canvas, click On Click in the Workflows section at the top of the right panel, choose Create new workflow, then add the steps the click should run; More event types offers form, input and other browser events.

In a TeleportHQ workflow, every step can use the results of the trigger and earlier steps (the workflow Context), by dragging a value from the Context panel onto a field or picking it with the Select from context button.

In TeleportHQ, click a workflow step and click Test in the right panel (or right-click the step and choose Test this node…), fill in sample values for the data it needs, then click Run test to run that one step for real and see its output; the Test runs tab lists every test of the workflow.

In TeleportHQ, replace a workflow's trigger with Scheduled (Cron), pick a schedule such as Daily at 9 AM and a timezone, then publish your site; the workflow then runs on the server at those times with no visitor needed.

In TeleportHQ, replace a workflow's trigger with Webhook Received, copy its endpoint URL, publish your site, and paste the URL into the other service (for example Stripe, Zapier or Typeform) so its requests start the workflow on your server.

In a TeleportHQ workflow, add a Send Email step (SendGrid, Mailgun, Mailersend, Postmark or Resend) or a Send SMS step (Twilio, TextMagic, Infobip or SMSAPI), enter your provider's API key, then fill in the sender, recipient and message; the provider you set up becomes the project's provider.

In a TeleportHQ workflow, add a Data step (Create Item, Update Item, Delete Item, Select Data, Count Data or Raw SQL Query), choose the data source and table, then fill in the column values and filters, often from form data.

In a TeleportHQ workflow, open Add node → Integrations, pick an app such as Slack, Google Sheets, HubSpot or Stripe, paste your API key or token, then choose the Action and fill in its fields.

A list of every trigger that can start a TeleportHQ workflow and every step you can add to it, grouped by the categories in the Add Node menu, with one plain line explaining each.

In TeleportHQ, build a group of workflow steps once as a custom node in the Custom Nodes section of the Workflows panel, then add it to any workflow with the Custom Node step, so you change the logic in one place.

In TeleportHQ, open a workflow, click the AI Assistant tab in the right panel, pick a model (Auto, Fast or Smart) and describe what the workflow should do or what to change; the AI builds or edits the steps, shows roughly how many AI tokens each reply used with a Revert button, and asks you to connect any service a step still needs.

TeleportHQ shows a yellow "N issues" button at the top left of the editor when workflow steps still need keys, pages, elements or states (it opens the Issues window), a "N security issues" button when workflow code could leak secrets or run unsafe SQL (critical ones block publishing), and a "Not exported" badge on a workflow that can never run; each one leads you to the step to fix.

In a TeleportHQ web app, visitors' files are saved with the Upload File(s) workflow step, usually from a File Upload Field in a form, and stored in your project's Runtime Storage, which you can browse in the Assets Manager under Uploads.

When a TeleportHQ workflow doesn't run on your live site, it is usually not published yet, disabled or marked Not exported, uncovered by a web app slot, started by a trigger that doesn't currently fire (Data Triggers, A Custom Event is Triggered), or failing at a step; TeleportHQ keeps no log of past runs, so check with Test this node… and by looking at the result.

In a TeleportHQ web app, visitors subscribe to push notifications with a Subscribe to Push workflow step (usually behind a "Turn on notifications" button), you set push up once with Set up push notifications, and a Send Push Notification step sends a title, text and link to everyone subscribed, one signed-in user or one browser, even when your site is closed.

Yes; on a published TeleportHQ site, a page with a Page is Loaded, An Element Becomes Visible or Component is Loaded workflow, or a state filled from a data source, starts over each time a visitor arrives at it, even from the same page (another record, another address after the ?, another language), so those workflows run again; to run one only once per visit, let it remember in the visitor's browser that it ran.

In TeleportHQ, you add sign-up and login by clicking the Authentication (padlock) button at the top left of the canvas, or Plugins → Authentication in the left sidebar, and following the Activate Authentication steps; TeleportHQ creates the sign-in, sign-up, password and profile pages, keeps the accounts in a database and makes your site a web app.

In TeleportHQ, you choose how visitors sign in from the padlock button → Manage Settings & Users → Settings, or from Plugins → Authentication in the left sidebar, where you turn email and password sign-in on or off and enable providers like Google; magic links are marked Coming Soon, and the same places turn authentication off.

In TeleportHQ, you add "Sign in with Google" (or GitHub, Apple, Facebook and about 60 other providers) by opening the provider in the authentication settings, copying its OAuth Callback URL into the provider's developer console, then pasting the Client ID and Client Secret back, clicking Enable and publishing.

In TeleportHQ, you manage the people who have accounts on your web app from the Users tab of the authentication window (padlock button → Manage Settings & Users → Users): a searchable list of every account where Create New User adds one, Edit opens the Edit User window to change a name or pick a role (such as admin or editor), and Remove deletes the account with everything the person added, keeping their orders, invoices and bookings.

In TeleportHQ, you make a page members-only by opening its menu in the Pages list (or Page settings → Security) and turning on Require Authentication; visitors who aren't signed in are sent to the sign-in page, Role Protection limits the page to a role such as editor, and in an online store Subscriber Access limits it to customers with an active subscription.

In TeleportHQ, you preview your web app as a signed-in member by clicking the padlock button at the top left of the canvas, choosing Act as User and picking a user; the canvas then shows that user's details and warns with Access Restricted on pages they can't open, and Act as Logged Out shows the site as a guest again.

In TeleportHQ, the welcome, password reset and account deletion emails are the components welcome, password-reset and account-deletion in the Components list's email-templates → customer folder, which you design like any component; they're sent through your project's email provider (SendGrid, Mailgun, MailerSend, Postmark or Resend), set in Project settings → Credentials → Email Providers.

In TeleportHQ, you show a signed-in member's name, email or photo by adding the Account elements (Name, Email, Image, Menu, Sign Out, Form, Delete Account) from Elements → Primitives, or by binding any text or image to Current User; in an online store or a booking site, each customer's My account page also keeps their contact details and address, which checkout fills in.

The TeleportHQ admin panel is a back office that TeleportHQ builds for your web app at /admin/dashboard on your published site, where people with the admin role manage users, orders, products, bookings, invoices, blog posts and comments, files, sent emails and your own database tables, and build extra pages from blocks, without opening the editor.

In TeleportHQ, you turn on the admin panel from the editor's left sidebar by clicking Plugins, then Admin panel, then the Admin panel enabled switch and Activate Admin Panel; Authentication must be on first, and a checklist shows TeleportHQ building a dashboard plus list, create and edit pages for your data, open only to users with the admin role.

In TeleportHQ, you add any database table (for example a Leads or Menu table) to your admin panel from the Manage Entities window, opened with Plugins → Admin panel → Manage in the left sidebar: pick the table, set its Entity Label, Sidebar Section and Columns, and click Add to Admin Panel; you can also add it from the table's menu in the Data Sources panel.

In TeleportHQ, your team builds new pages for your live site in the admin panel's Pages section: click + Add New, give the page a Title (the Slug follows), add blocks such as Section, Heading, Text, Image, Button or your own components from the Add blocks tab, set the Status to Published and click Create; the page appears at /pages/your-slug within about 60 seconds, without opening the editor.

In TeleportHQ, the admin panel of your published web app is at your site address followed by /admin/dashboard (for example https://mybakery.teleporthq.app/admin/dashboard); the Publish window shows the link under "Admin panel is included", and you sign in with an account whose role is admin, which you can create with Create admin user.