Step 3: Create a Search Request

Next, we’ll make a search request using Search Core.

1. Initialize Core

In the body of your application, initialize the core library with your API Key and Experience Key

const core = provideCore({
  apiKey: '<your api key>', // example: 3517add824e992916861b76e456724d9
  experienceKey: '<one of your experience keys>', // example: search-js-docs
  locale: 'en',
  experienceVersion: 'PRODUCTION'
});

2. Make a Universal Search Request

Now that Search Core has been initialized, we’ll make a Universal search request and display the raw results on the page:

core.universalSearch({
  query: 'open positions',
}).then(results => {
  // Do something with the search results
    document.getElementById("app").innerHTML = JSON.stringify(results);
}).catch(err => {
  // Handle errors thrown by the core library
  console.log(err);
});

3. Putting It All Together

The full index.ts file will look like this:

import { provideCore } from '@yext/search-core';

const core = provideCore({
  apiKey: '3517add824e992916861b76e456724d9',
  experienceKey: 'search-js-docs',
  locale: 'en',
  experienceVersion: 'PRODUCTION'
});

core.universalSearch({
  query: 'open positions',
}).then(results => {
  console.log(results)
  document.getElementById("app").innerHTML = JSON.stringify(results);
}).catch(err => {
  console.log(err)
  // Handle errors thrown by the core library
});

If you followed the previous step’s instructions, your Code Sandbox’s index.html file already has the <div id="app"></div>, where the results will be placed. You should see the results appear on the page.

Feedback

<% elem.innerText %>