# Getting Started

### 1. Read the User Guide

If it's your first time working with Reactify Search, it's worth reading the User Guide, which explains how Reactify Search and its features work, and how to configure them.

{% content-ref url="/spaces/ymizZPKhhUf5cFL9elfG" %}
[User Guide](https://search.guides.reactify.com.au/)
{% endcontent-ref %}

### 2. Implementing on a Shopify Liquid Theme?

This guide assumes you're using React components directly. If you're implementing Reactify Search on a Shopify Liquid theme, refer to the [Liquid Theme](/guides/liquid-theme.md) guide for specific setup steps.

### 3. Install

Install the dependencies.

```bash
npm install @usereactify/search
```

### 4. Context

Wrap your search area with the [ReactifySearchProvider](/components/provider.md) and set the required props to create a new Reactify Search context.

All of the search results, filters and sort options will be contained within the context; you can add more than one to a page, and their data will remain separate.

<pre class="language-tsx"><code class="lang-tsx"><strong>import React from "react";
</strong>import { ReactifySearchProvider } from "@usereactify/search";

export const SearchPage: React.FC = () => (
  &#x3C;ReactifySearchProvider
    mode="search"
    shopifyPermanentDomain="usereactify-demo.myshopify.com"
    market="12345" // optionally the ID of the Shopify market to use
  >
    ...
  &#x3C;/ReactifySearchProvider>
);
</code></pre>

### 4. Components

Use the built-in components, such as [Filters](/components/filters.md), [Sensors](/components/sensors.md) and [Results](/components/results.md) to begin; all visual components will render something functional by default.

```tsx
import React from "react";
import { ReactifySearchProvider, Sensors, Filters, Results } from "@usereactify/search";

export const SearchPage: React.FC = () => (
  <ReactifySearchProvider
    mode="search"
    shopifyPermanentDomain="usereactify-demo.myshopify.com"
    market="12345" // optionally the ID of the Shopify market to use
  >
    <Sensors />
    <Filters />
    <Results />
    ...
  </ReactifySearchProvider>
);
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://search.docs.reactify.com.au/getting-started.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.