Ways to Build Search

Everyone who uses Yext Search uses the Search configuration to manage the backend. There are several options to build the Search frontend, depending on whether you want an out-of-the-box solution with built-in templates or want to customize more on your own.

Developer Options

Search API — A REST API at the core of Yext Search. Full stack developers can build on top of the Search API for total customization and new use cases. This is a good option if you are looking to incorporate Search into a non-JavaScript based project. See the Search API documentation to get started.

Search Core — A Search API TypeScript client with functions for all Search API calls. Core is a networking layer on top of the API that doesn't require access to the DOM, so it can fit most use cases — in the browser or on a Node server — and is compatible with both CommonJS and ES6 imports. This is a good option if you want complete UI flexibility but are not using React, or if you are building in a different framework (e.g., Vue or Angular). You can also use Core to build Node webhook endpoints for chatbots. See the documentation on GitHub and npm.

Search UI React — A React library that provides state management, hooks, and fully styled UI components for building robust Search experiences. Using this library is the quickest way to get a Search experience up and running. It is built on top of the Search Headless React library, which allows you to extend functionality and build your own custom components. See the Search UI React documentation and Storybook to get started. The library is available on GitHub and npm.

Low-Code Option

Hitchhikers Theme — A low-code option that allows administrators to quickly build a frontend using JSON, HTML, CSS, and JavaScript. This can be easily configured using pre-built templates and a static site generator (Jambo) that provides a code editor UI. Customize to your brand by configuring which templates you use, customizing properties, and adding styling. The Search UI SDK is the JavaScript library of components that the Hitchhikers Theme uses under the hood. 

Which Method Is Right for You?

If you're not a developer, build with the Hitchhikers Theme using the Pages product UI to edit your frontend.

If you're a developer, use Search UI React to get started quickly. If you want to use a framework besides React, use Search Core. If you're not using JavaScript, use the Search API directly.

Search Experiences Screens

In Search > All Search Experiences, you can view and manage your experiences. If you don't have a Search experience yet, click the button in the top right to create one. See the Create a Search Configuration help article for details.

If you have at least one experience, the screen will list all experiences. Next to each will be a dropdown to view, delete, or duplicate it.

Above the list is a snapshot of activity across all your Search experiences — hero metrics for Searches, Sessions, Click Through Rate, and Result Rate, aggregated across all experiences for the last 30 days. See the Search Metrics reference for definitions of each metric.

Once you click into an experience, you'll see five main sections:

Test Search — Test your Search experience without configuring a frontend. A full-screen test search is available here, and as a side panel on each configuration screen. Learn more in Test Search.

Configuration — Where you manage your Search configuration. You'll land on the Verticals screen by default. You can edit the configuration in the UI or through JSON. The General Settings screen contains your experience key and API key. Learn more in Vertical-Level Configuration and Search-Level Configuration.

Analysis — Details on what is being searched and how the algorithm interprets searches. Use these tools to optimize search quality over time. Learn more in Search Analytics, Debug the Backend, and Search Optimizations.

Training — Give the algorithm feedback on its predictions to improve results over time. You can train on featured snippets, inferred filters, and spell checking. Learn more in Experience Training.

Deployment — View a history of your Search configuration versions and deploy specific versions to the Staging and Production labels of your site. Learn more in Create and Edit the Search Config.

All settings in Search exist at the experience level so that each experience can be configured independently.

Pages Sites Screens

Pages > All Sites allows you to access and manage your sites. If you're building with the Theme, you're likely using Yext's Pages product to host the frontend. You may also use a Pages site to deploy a site built on Search UI React.

Once you click into a site, you'll see a different screen depending on which type of Pages the site is built on:

• New Pages (React or Theme): See the Deployment Screens unit for a walkthrough.
• Classic Pages (Theme only): See the Deploy an Experience unit for a walkthrough.

If you are using the Theme, you can access a code editor from these screens to edit files directly. If you are using React, you'll edit your repo files locally and use the platform only to deploy commits to your site.