Skip to main content
The create-instantsearch-app CLI supports both interactive and non-interactive modes.

Basic Usage

create-instantsearch-app <project-directory> [options]

Interactive Mode (Default)

Run without flags to enter interactive mode:
npx create-instantsearch-app my-app
You’ll be prompted for:
1

Project Name

The name of your application (defaults to directory name)
2

Template Selection

Choose from InstantSearch.js, React, Vue, or other templates
3

Library Version

Select the version of the InstantSearch library
4

Algolia Credentials

  • Application ID (defaults to latency demo)
  • Search API key (defaults to demo key)
  • Index name (defaults to instant_search)
5

Search Configuration

  • Attributes to display in results
  • Image attribute for result thumbnails
  • Attributes for faceting/filtering
6

Advanced Options

  • Search input type (autocomplete vs regular search box)
  • Query Suggestions index (for autocomplete)
  • Enable user events (Insights)

Non-Interactive Mode

Use the --no-interactive flag with other options:
create-instantsearch-app my-app \
  --template "React InstantSearch" \
  --app-id YOUR_APP_ID \
  --api-key YOUR_SEARCH_KEY \
  --index-name YOUR_INDEX \
  --no-interactive

CLI Flags

Basic Options

--name
string
The name of the application or widget
--template
string
The InstantSearch template to use (see Templates)Examples: "InstantSearch.js", "React InstantSearch", "Vue InstantSearch"
--library-version
string
The version of the library to useExample: "4.0.0"

Algolia Configuration

--app-id
string
Your Algolia application ID
--api-key
string
Your Algolia search API key (public, search-only)
--index-name
string
The main index for your search

Search UI Configuration

--attributes-to-display
string[]
Comma-separated list of attributes to display in search resultsExample: "name,description,price"
--image-attribute
string
The attribute to use for displaying images in resultsExample: "image_url"
--attributes-for-faceting
string[]
Comma-separated list of attributes to use for filteringExample: "brand,category,color"

Other Options

--config
string
Path to a configuration file (JSON) containing all optionsSee Configuration for details
--no-installation
boolean
Skip automatic dependency installation
--no-interactive
boolean
Disable all interactive prompts
-v, --version
boolean
Output the version number
-h, --help
boolean
Display help information

Examples

Create React app with demo credentials

npx create-instantsearch-app my-react-app \
  --template "React InstantSearch" \
  --app-id latency \
  --api-key 6be0576ff61c053d5f9a3225e2a90f76 \
  --index-name instant_search \
  --no-interactive

Create Vue app with custom index

npx create-instantsearch-app my-vue-app \
  --template "Vue InstantSearch" \
  --app-id YOUR_APP_ID \
  --api-key YOUR_SEARCH_KEY \
  --index-name products \
  --attributes-to-display "name,description" \
  --image-attribute "thumbnail" \
  --attributes-for-faceting "brand,category" \
  --no-interactive

Skip dependency installation

npx create-instantsearch-app my-app \
  --template "InstantSearch.js" \
  --no-installation

User Events (Insights)

When prompted to “Enable user events”, selecting ‘Y’ activates the insights option. This allows Algolia to process user events like clicks and conversions, enabling powerful analytics and personalization features.
User events are supported in InstantSearch.js >= 4.55, React InstantSearch >= 7.0, and Vue InstantSearch >= 4.9.0. For supported templates and versions, you can choose between:
  • Autocomplete: Enhanced search input with suggested searches and recent searches (requires Query Suggestions index)
  • Regular search box: Standard search input field
Autocomplete is available in InstantSearch.js >= 4.52.

Build docs developers (and LLMs) love