Server Side Rendering Comes to GoHighLevel AI Studio

The biggest change is simple: new AI Studio projects are now built as full-stack apps, not just static frontends.

GoHighLevel is using TanStack Start for new projects. That gives AI Studio a real server, route handling, backend functions, API endpoints, and a proper runtime when you publish the app.

For Server Side Rendering, this means the server can build the page before it reaches the visitor. Search engines and social platforms can receive the actual page content, including titles, descriptions, headings, and body copy.

That’s a major improvement over a frontend-only setup where important content may depend on JavaScript loading first.

AI Studio also adds server functions. These let you run logic on the server instead of exposing it in the browser. You can use them to load private data, connect to external services, or handle logic you don’t want sitting in client-side code.

REST API routes are another big addition. You can create endpoints under routes like /api/… and use them for GET requests, POST requests, webhooks, or integrations with other systems.

Then there’s Secrets.

Secrets gives you a safer place to store API keys, tokens, and other private credentials. Those values can be used by server-side code without being pushed into the frontend bundle or exposed to visitors.

Put all of that together and AI Studio can now build much more than a polished interface. It can build the frontend, backend, integrations, and server-rendered pages as one working app.

Server Side Rendering matters because it makes your AI Studio pages easier for search engines, social platforms, and users to understand right away.

With a client-side app, the browser may need to load JavaScript before the main page content appears. That can work, but it adds another layer between your content and the systems trying to read it.

With Server Side Rendering, the important page content is already there in the HTML when the request is made.

That can help with SEO because search engines can see your titles, descriptions, headings, and page copy without waiting for the app to build everything in the browser. It also helps when links are shared on platforms like LinkedIn or Slack, where page previews depend on the content and metadata that gets returned.

For agencies, that opens the door to building more useful client-facing experiences inside AI Studio.

You can create multi-page websites, lead-generation tools, directories, calculators, dashboards, and other web apps with unique URLs and server-backed data.

The backend tools matter just as much.

Server functions let you keep private logic off the client. REST APIs let outside systems connect to your app. Secrets help protect API keys and tokens from being exposed in the frontend.

Together, those features give you more room to build serious tools without stitching together as many separate platforms.

For GHL users, the real win is flexibility. AI Studio is no longer just about generating something that looks good. It can now support more of the logic, data, and structure that make a web app actually work.

You don’t need to manually turn on Server Side Rendering for a new AI Studio project. New GoHighLevel AI Studio projects are automatically built on TanStack Start, which supports Server Side Rendering, Server Functions, REST APIs, and Secrets.

In this section, you’ll create a new AI Studio project, describe the full application you want to build, set up any private credentials, add server-side functionality, test the app, and publish it. The important part is telling AI Studio what the app needs to do, not just what you want it to look like.

Here are the steps you’ll follow:

• Access the AI Studio page of GoHighLevel
• Create a New AI Studio Project
• Describe the Full Application Behavior
• Add Secrets for Protected Credentials
• Build and Review Server Functions
• Create REST APIs for External Requests
• Preview and Test the Application
• Publish the Application
• Connect a Custom Domain

To start make sure you are logged in to your GoHighLevel sub-account.

The Main Menu on the left side of your screen includes all the main areas you work in when using GHL.

1.1 Click the AI Studio main menu item.

• This opens the AI Studio page where you can access your existing projects or start a new project.
• If you already have AI Studio projects, they will appear here.
• For this guide, you will create a new project because new projects use the TanStack Start full-stack architecture automatically.

The AI Studio page is where you start a new app or open an existing AI Studio project.

2.1 Start a new AI Studio project.

• This opens the project creation experience where you can describe the website or application you want AI Studio to build.
• New projects created here use TanStack Start automatically.
• You do not need to enable a separate Server Side Rendering setting or Lab feature.

This is where you tell AI Studio what you want to build. Don’t limit your instructions to colors, layouts, and page designs. Describe what the application needs to do behind the scenes as well.

3.1 Enter a clear description of the website or application you want AI Studio to create.

• Include the public pages you need.
• Explain what visitors should be able to do.
• Include any forms, data, calculations, or other functionality the app requires.

3.2 Describe any work that needs to happen privately on the server.

• Tell AI Studio when information needs to be loaded from another service.
• Explain when calculations, validation, or business logic should stay off the visitor’s browser.
• Mention any private API connections the application needs.

3.3 Include any external systems that need to communicate with the application.

• Tell AI Studio if another platform needs to send information into the app.
• Include any webhook requirements.
• Explain if an outside application needs its own REST API endpoint.

3.4 Submit your instructions so AI Studio can begin building the project.

• AI Studio uses your instructions to generate the frontend and the supported server-side functionality for the application.
• Review the generated project before moving on so you can make sure the basic pages and functionality match what you asked for.

For example, you could ask AI Studio to build a lead portal with a public landing page, a private server-side lead lookup, and an API endpoint that receives updates from another platform.

Once your new AI Studio project has been created, you can access the backend tools from inside the project.

4.1 Click More in the AI Studio project toolbar.

• This opens the additional project tools available for your AI Studio app.

4.2 Click Cloud.

• This opens the Cloud area for the current AI Studio project.
• Cloud gives your TanStack Start project access to backend services including Database, Users, Storage, and Secrets.
• Cloud needs to be enabled before you can use its backend services inside the project.

4.3 Click Overview in the Cloud area if it is not already showing.

• The Overview page shows the Cloud status for the current project.

4.4 Click Enable Cloud.

• HighLevel begins provisioning the backend services for the project.
• You can continue working on the project while Cloud is being prepared.
• Once provisioning is complete, the Cloud dashboard becomes available.

Use Secrets for API keys, authentication tokens, webhook secrets, and other private values that should not appear in your frontend code.

5.1 Click Secrets in the Cloud area.

• This opens the Secrets section for the current AI Studio project.

5.2 Add the private credential required by your app or integration.

• Use a clear name that identifies what the Secret is for.
• Examples include an API key, access token, webhook signing secret, or other private service credential.

5.3 Save the Secret.

• The value can now be used by supported server-side functionality without being deliberately exposed in the client-side code.
• Do not place the same credential directly into frontend code.

You do not need to manually build every Server Function or REST API from a separate settings screen. Describe what the application needs to do in the AI Studio chat and let AI Studio create the supported backend functionality for the project.

6.1 Enter a prompt describing the server-side action you need.

• Explain what should happen.
• Explain what information the app needs.
• Tell AI Studio if the action should use one of your saved Secrets.

6.2 Tell AI Studio when the app needs a Server Function.

• Use a Server Function when your own frontend needs private backend logic.
• Good examples include loading protected data, calling an external service, validating information, or performing calculations on the server.

6.3 Tell AI Studio when you need a REST API.

• Use a REST API when another system needs an HTTP endpoint it can call.
• Explain the endpoint purpose and whether it needs to receive or return information.
• This is useful for webhooks and outside integrations.

6.4 Review the result in the Preview.

• Check that the application performs the action you requested.
• If something does not work correctly, describe the issue in the AI Studio chat and have it corrected before publishing.

Before publishing, test the parts of the application that use Server Side Rendering, Server Functions, REST APIs, and Secrets.

7.1 Open the project Preview.

• Confirm the public pages load correctly.
• Check that the expected text, headings, forms, and other page content appear.

7.2 Test any actions that use Server Functions.

• Confirm the frontend receives the expected result.
• Test incorrect or missing information where appropriate.

7.3 Test any REST API or webhook connections.

• Confirm the outside service can reach the correct endpoint.
• Check that the expected information is received and processed.

7.4 Confirm private credentials are not visible to the visitor.

• API keys, authentication tokens, and other Secrets should not appear in browser-visible content.

7.5 Review the important SEO content.

• Check page titles.
• Check meta descriptions.
• Check headings.
• Check the visible page copy.
• Make sure important public pages have unique and useful content.

Once the project has been tested, you can publish the frontend and supported server-side functionality together.

8.1 Click Publish.

• This opens the publishing options for the current AI Studio project.

8.2 Review the website address.

• Confirm the generated address is appropriate for the project.

8.3 Confirm the publication.

• HighLevel publishes the AI Studio application and its supported runtime.

8.4 Open the live website.

• Test the published version again.
• Check the main pages, Server Functions, API connections, and any external integrations you added.

You only need this step if you are working with an older AI Studio project built on React/Vite.

New AI Studio projects already use TanStack Start, so they do not need to be migrated.

9.1 Open the existing React/Vite project you want to upgrade.

• Make sure you are opening the original project that needs the new full-stack capabilities.

9.2 Open Project Settings.

• This opens the settings for that individual AI Studio project.

9.3 Locate Migrate to SSR.

• The option appears under the Advanced settings for eligible React/Vite projects.
• Projects that already use TanStack Start will not show this migration option.

9.4 Click Migrate next to Migrate to SSR.

• AI Studio opens the migration setup.
• The original project is not converted directly.

For Full Step by Step SSR Migrations Refer to this Post “GoHighLevel React SSR Migration: Upgrade Existing AI Studio Projects Safely“

Server Side Rendering gives AI Studio more power, but the best results still come from being specific about what belongs on the server and what belongs in the browser.

Start by keeping private work private. If your app needs API keys, tokens, protected data, or sensitive business logic, keep that work inside Server Functions and connect credentials through Secrets. Don’t hard-code private values into frontend code just because it seems faster.

Use REST APIs only when another system needs to call your application directly. If the request is only coming from your own AI Studio frontend, a Server Function will usually be the cleaner choice. This keeps the structure easier to manage and reduces unnecessary public endpoints.

For SEO, give every important public page its own clear purpose. Use unique page titles, descriptions, headings, and copy. Server Side Rendering helps search engines receive the content, but it can’t fix weak or duplicated page content.

Be specific in your prompts. Instead of saying, “Connect this app to my API,” explain what data should be sent, what data should come back, where it should be displayed, and which values must stay private. Clear instructions give AI Studio less room to guess.

Finally, test the live version after publishing. Check your pages, metadata, Server Functions, API routes, and outside integrations again on the final URL. A working Preview is a good sign, but the published app is what your users and search engines will actually see.

Server Side Rendering gives agencies and business owners more room to build useful tools inside AI Studio instead of stopping at a polished frontend.

That matters because many client projects need more than a good-looking page. They need live data, private logic, outside integrations, and pages that search engines can actually read.

With Server Side Rendering, you can build things like lead-generation tools, directories, calculators, client portals, dashboards, and multi-page websites that use real server-side functionality.

For an agency, that could mean building a client-facing quote tool that loads pricing from a private source, calculates the result on the server, and displays the answer without exposing the underlying logic.

You could also create a directory-style website where each service or location has its own URL, title, description, and page content. That gives you a stronger foundation for SEO than treating the whole experience like one client-side app.

The REST API support also opens the door to more connected workflows. An outside system could send data into your app through an API endpoint, while Server Functions handle private logic inside the app itself.

The business value is flexibility.

Instead of using one tool for the frontend, another tool for the backend, another service for APIs, and another place for private credentials, AI Studio can now handle more of that stack in one place.

That doesn’t mean every project needs to become a complex web app. But when a client does need more than a simple page, GHL now gives you a much stronger starting point.

If you already have an AI Studio project built with React/Vite, nothing changes automatically.

Your existing project stays on React and continues working the way it does now. HighLevel does not automatically move older projects onto the new TanStack Start framework.

That means you don’t need to rebuild or migrate a working project just because Server Side Rendering is now available.

If you do need Server Side Rendering, Server Functions, or Secrets, HighLevel now gives eligible React/Vite projects a separate migration option.

Inside the existing project, go to Project Settings and look for Migrate to SSR. HighLevel creates a new TanStack Start copy of the project instead of changing the original.

Your original project stays live, including its existing domain. The migrated copy starts as a separate draft project so you can review and test it before deciding whether to publish it.

This is a smart approach for agencies because you can test the new stack without putting a live client site at risk.

Before publishing the migrated version, check every important page, integration, workflow connection, Server Function, and Secret. HighLevel also notes that workflow triggers continue pointing to the original project until you update them.

If your existing React project works fine and doesn’t need the new backend features, there’s no reason to migrate it just for the sake of migrating.

But if you need better Server Side Rendering, private backend logic, protected credentials, or newer TanStack-only AI Studio features, the migration option gives you a safer way to move forward without rebuilding from scratch.

Server Side Rendering moves GoHighLevel AI Studio into a very different category.

You’re no longer limited to building a nice-looking frontend and then figuring out the backend somewhere else. New AI Studio projects can now combine server-rendered pages, Server Functions, REST APIs, Secrets, and a live server runtime in one project.

For agencies, that means more flexibility when building websites, lead-generation tools, client portals, calculators, directories, and connected web apps.

The SEO side matters too. Server Side Rendering gives search engines access to real page content and metadata without relying entirely on client-side JavaScript. That gives you a much stronger technical starting point for pages you actually want to rank.

The safest way to test the update is to start with a new AI Studio project and build something simple first. Add one server-side function, one private connection, or one API route, then test how everything works together before building something bigger.

If you already have an existing React/Vite project, you don’t need to rush into changing it. Keep it running if it does the job, or test the newer TanStack Start migration option when you actually need the added backend and Server Side Rendering features.

This is one of those GoHighLevel updates that gives agencies room to offer something more valuable than another basic landing page.

What kind of full-stack app would you build first with AI Studio?