https://github.com/nuxt-modules/algolia

🔎 Algolia module for Nuxt
https://github.com/nuxt-modules/algolia

algolia module nuxt search vue

Last synced: 1 day ago
JSON representation

🔎 Algolia module for Nuxt

• Host: GitHub
• URL: https://github.com/nuxt-modules/algolia
• Owner: nuxt-modules
• License: mit
• Created: 2022-01-04T11:30:00.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2024-12-12T14:05:38.000Z (10 days ago)
• Last Synced: 2024-12-14T19:01:01.374Z (8 days ago)
• Topics: algolia, module, nuxt, search, vue
• Language: TypeScript
• Homepage: https://algolia.nuxtjs.org/
• Size: 2.35 MB
• Stars: 194
• Watchers: 6
• Forks: 35
• Open Issues: 21
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
[![@nuxtjs/algolia](https://algolia.nuxtjs.org/preview.png)](https://algolia.nuxtjs.org)

# @nuxtjs/algolia

[![npm version][npm-version-src]][npm-version-href]

[![npm downloads][npm-downloads-src]][npm-downloads-href]

[![Github Actions CI][github-actions-ci-src]][github-actions-ci-href]

[![Codecov][codecov-src]][codecov-href]

[![License][license-src]][license-href]

> [Algolia](https://www.algolia.com/) module for [Nuxt](https://v3.nuxtjs.org)

- [✨  Release Notes](https://github.com/nuxt-modules/algolia/releases)

- [📖  Read the documentation](https://algolia.nuxtjs.org)

## Features

- Easy integration with Algolia

- Handy composables like useAlgoliaSearch, useAsyncAlgoliaSearch

- Support for Vue Instantsearch components

- Support for Algolia Recommend

- Support for Docsearch

- Support for Automatic Indexing

- Support for caching the requests and responses

- Support for SSR requests

[📖  Read the documentation](https://algolia.nuxtjs.org)

## Preview

[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/github-epeint?file=app.vue)

## Setup

```sh

npx nuxi@latest module add algolia

```

## Basic usage

Add `ALGOLIA_API_KEY` and `ALGOLIA_APPLICATION_ID` environment variables to .env file.

```env

ALGOLIA_API_KEY="0fd1c4eba2d831788333e77c9d855f1d"

ALGOLIA_APPLICATION_ID="AGN9HEEKF3"

```

Now you can start using `@nuxtjs/algolia` in your app!

Client side:

```vue

const { result, search } = useAlgoliaSearch('test_index')

onMounted(async () => {

  await search({ query: 'Samsung' })

})

  
{{ result }}


```

Or SSR:

```vue

const { data } = await useAsyncAlgoliaSearch({ indexName: 'test_index', query: 'Samsung' })

  
{{ data }}


```

## Development

1. Clone this repository

2. Install dependencies using `yarn install` or `npm install`

3. Use `yarn dev:prepare` or `npm run dev:prepare` to prepare the development environment

4. Start development server using `yarn dev` or `npm run dev`

## License

[MIT License](./LICENSE)

[npm-version-src]: https://img.shields.io/npm/v/@nuxtjs/algolia/latest.svg

[npm-version-href]: https://npmjs.com/package/@nuxtjs/algolia

[npm-downloads-src]: https://img.shields.io/npm/dt/@nuxtjs/algolia.svg

[npm-downloads-href]: https://npmjs.com/package/@nuxtjs/algolia

[github-actions-ci-src]: https://github.com/nuxt-modules/algolia/actions/workflows/ci.yml/badge.svg

[github-actions-ci-href]: https://github.com/nuxt-modules/algolia/actions?query=workflow%3Aci

[codecov-src]: https://img.shields.io/codecov/c/github/nuxt-modules/algolia.svg

[codecov-href]: https://codecov.io/gh/nuxt-modules/algolia

[license-src]: https://img.shields.io/npm/l/@nuxtjs/algolia.svg

[license-href]: https://npmjs.com/package/@nuxtjs/algolia