Updates in Pages | Yext Hitchhikers Platform

What You’ll Learn

In this section, you will learn:

• An overview of the new Pages features from the Summer ‘23 Release

Studio Updates

Warning

Yext will continue development of Studio based on feedback from beta testers. As a result, we cannot commit to a date when Studio will transition out of beta and become eligible for general availability.

With our Spring ‘23 Release, we launched Studio as a Preview Feature, a React-based visual editor that allows you to create and edit customizable websites. With this release, we made significant improvements to Studio that provide enhanced functionality and improved usability:

• Ability to create complex properties on web components. Within Studio, users can drag-and-drop components to create and update web pages. Now, developers can configure complex properties that are associated with each web component that they create. For example, add product details or available sizes to a shoe that you offer, or include the specific address of a location name, such as city, region, and postal code. This allows you to produce more dynamic web experiences that leverage content from the Yext platform to ensure maximum scalability.

• Studio support in-platform. Previously, Studio could only run in local development or through GitHub Codespaces. Now, with Studio available in-platform, non-technical users can easily access Studio without the need for local development.

• New Template Entity Creation. This update allows you to create new pages from scratch based on content stored in Yext. Now, non-developers have the ability to leverage the power of Yext Content to create websites in Studio, without the help of a developer. This can include location pages, blogs, an FAQ page, or any page based on content stored in Yext.

• Windows support for Studio. With Windows support, you now have increased flexibility on where to run websites or applications authored in Studio.

How this Impacts You

We’ve made enhancements to improve Studio functionality and ease-of-use.

Studio will open a world of new possibilities for how your team creates web content. With Studio, you have full control over authoring website components, designing content layouts, and editing styling systems. What’s more, any updates in your Content seamlessly flow to your website after publishing with no additional effort.

Studio is not only far more intuitive and gives non-technical users more flexibility to create custom websites, but it also leverages the same Pages infrastructure that developers use.

Feature Availability

Studio is currently available as a Preview Feature. This feature is available in accounts now, so users can start taking advantage of it today.

Additional Resources

• Get Started with Studio reference doc

Serverless Functions

With the introduction of Serverless Functions, developers are now able to author custom code, which exposes HTTP endpoints served by the Yext platform. Serverless Functions are a powerful tool which liberates developers from concerns around infrastructure by abstracting away details around the networking and serving layer.

For example, an e-commerce shoe retailer can fetch data, like a table for their inventory, from an external API and tailor it for real-time load via a Serverless Function.

How This Impacts You

Serverless functions over HTTP further extend the customizability of the Yext Platform and offer virtually limitless integration pathways to external systems. When building modern-day digital experiences, Serverless Functions unlock new capabilities for the delivery of Knowledge Graph content across digital endpoints.

Within Pages, Serverless Functions can be used for two use cases:

• The deployment of API endpoints over HTTP
• The execution of custom code in response to lifecycle events within the Pages system

Feature Availability

To turn on this feature in your account, navigate to Account Settings > Account Features and select Summer ‘23: Serverless Functions (early access).

Additional Resources

• HTTP Serverless Functions reference doc

Typescript Interface Generation

With Typescript Interface Generation, developers can easily access automatically generated TypeScript interfaces that correspond to entity types, entities, and fields in Yext Content.

TypeScript is a superset of JavaScript code. Interfaces can be used to specify the shape and requirements of data objects used in your project.

How this Impacts You

Not only will this save developers time from having to complete repetitive tasks, but it also eliminates the extra effort of ensuring interface consistency between frontend and backend codebases.

Pages offers a CLI command that programmatically generates TypeScript interfaces based on the Content object references in your code. This allows developers to add type safety to their project for complex data object types stored in Yext, such as locations, blogs, doctors, financial professionals, descriptions, and photos.

Feature Availability

For Pages development, the Yext CLI offers a command that automatically generates interfaces for your project based on Stream objects in your templates and site-stream.json.

To utilize this feature, run the following command from the root of your project:

yext types generate pages

Once you have run the command, a file containing your generated interfaces will be automatically written to src/types/autogen.ts. From there, you can easily import these interfaces into your components.

Additional Resources

• Typescript Interface Generation reference doc

Relationships in Pages Preview

We’ve added support for entity relationships in Pages Preview, enabling users to preview how suggestions will look across pages that are powered by entity relationships. The Pages Preview feature allows you to preview CMS “Suggestions” before publishing them to your live production site. For example, a content editor might want to share updates to a page with a key stakeholder before publishing them. With Page Preview, this process is simple and provides users with enhanced flexibility when building their pages.

How This Impacts You

Use Pages Preview as a “draft mode” for CMS content on your website. Incorporate previews into your content-approver workflow. Easily visualize how each page in your site is affected by a content update to audit them.

Feature Availability

This feature is available in accounts now, so users can start taking advantage of them today.

Additional Resources

• Previewing Content Updates reference doc