Quick Start

    First of all, let’s download and run MeiliSearch.

    You should see the following response:

    1. 8888b d8888 Y8P 888 Y8P d88P Y88b 888
    2. 88888b.d88888 888 Y88b. 888
    3. 888Y88888P888 .d88b. 888 888 888 "Y888b. .d88b. 8888b. 888d888 .d8888b 88888b.
    4. 888 Y888P 888 d8P Y8b 888 888 888 "Y88b. d8P Y8b "88b 888P" d88P" 888 "88b
    5. 888 Y8P 888 88888888 888 888 888 "888 88888888 .d888888 888 888 888 888
    6. 888 " 888 Y8b. 888 888 888 Y88b d88P Y8b. 888 888 888 Y88b. 888 888
    7. 888 888 "Y8888 888 888 888 "Y8888P" "Y8888 "Y888888 888 "Y8888P 888 888
    8. Database path: "./data.ms"
    9. Server listening on: "127.0.0.1:7700"

    You can download & run MeiliSearch in many different ways (i.e: docker, apt, homebrew, …).

    can be set before and on launch to configure MeiliSearch. Amongst all the options, you can use the master key and the port options.

    Now that your MeiliSearch server is up and running, you should be able to communicate with it.

    Communication to the server is done through a RESTful API or one of our .

    To add documents to MeiliSearch you must provide:

    • Documents in the form of an array of JSON objects.
    • An name (uid). An index is where the documents are stored.

    To be processed, all documents must share one common which will serve as for the document. Values in that field must always be unique.

    1. {
    2. "id": "123",
    3. "title": "Superman"
    4. }

    The primary key is id, the document’s unique identifier is 123.

    There are is. The easiest one is to have an that contains the string id in a case-insensitive manner.

    Below is an example to showcase how to add documents to an index called movies using the following test dataset: movies.json (opens new window).

    1. curl \
    2. -X POST 'http://127.0.0.1:7700/indexes/movies/documents' \
    3. --data @movies.json
    1. npm install meilisearch

    Or, if you are using yarn

    1. yarn add meilisearch

    Import

    require syntax:

    1. const { MeiliSearch } = require('meilisearch')
    2. const movies = require('./movies.json')

    import syntax:

    1. import { MeiliSearch } from 'meilisearch'
    2. import movies from '../small_movies.json'

    Use

    1. const client = new MeiliSearch({ host: 'http://127.0.0.1:7700' })
    2. client.index('movie').addDocuments(movies)
    3. .then((res) => console.log(res))

    1. pip3 install meilisearch
    1. import meilisearch
    2. import json
    3. client = meilisearch.Client('http://127.0.0.1:7700')
    4. json_file = open('movies.json')
    5. movies = json.load(json_file)
    6. client.index('movies').add_documents(movies)

    About this SDK

    Using meilisearch-php with the Guzzle HTTP client:

    1. <?php
    2. require_once __DIR__ . '/vendor/autoload.php';
    3. use MeiliSearch\Client;
    4. $client = new Client('http://127.0.0.1:7700');
    5. $movies_json = file_get_contents('movies.json');
    6. $movies = json_decode($movies_json);
    7. $client->index('movies')->addDocuments($movies);
    1. $ bundle add meilisearch
    1. require 'json'
    2. require 'meilisearch'
    3. client = MeiliSearch::Client.new('http://127.0.0.1:7700')
    4. movies_json = File.read('movies.json')
    5. movies = JSON.parse(movies_json)
    6. client.index('movies').add_documents(movies)

    1. go get -u github.com/meilisearch/meilisearch-go
    1. package main
    2. import (
    3. "os"
    4. "encoding/json"
    5. "io/ioutil"
    6. "github.com/meilisearch/meilisearch-go"
    7. )
    8. func main() {
    9. var client = NewClient(meilisearch.Config{
    10. Host: "http://127.0.0.1:7700",
    11. })
    12. jsonFile, _ := os.Open("movies.json")
    13. defer jsonFile.Close()
    14. byteValue, _ := ioutil.ReadAll(jsonFile)
    15. var movies []map[string]interface{}
    16. json.Unmarshal(byteValue, &movies)
    17. update, err := client.Documents("movies").AddOrReplace(movies)
    18. if err != nil {
    19. panic(err)
    20. }

    About this SDK

    1. [dependencies]
    2. meilisearch-sdk = "0.6"
    3. # futures: because we want to block on futures
    4. futures = "0.3"
    5. # serde: required if you are going to use documents
    6. serde = { version="1.0", features = ["derive"] }
    7. # serde_json: required in some parts of this guide
    8. serde_json = "1.0"

    Documents in the Rust library are strongly typed. You have to implement the Document trait on a struct to be able to use it with Meilisearch.

    1. #[derive(Serialize, Deserialize, Debug)]
    2. struct Movie {
    3. id: String,
    4. title: String,
    5. overview: String,
    6. release_date: i64,
    7. genres: Vec<String>
    8. }
    9. impl Document for Movie {
    10. type UIDType = String;
    11. fn get_uid(&self) -> &Self::UIDType { &self.id }
    12. }

    You will often need this Movie struct in other parts of this documentation. (you will have to change it a bit sometimes) You can also use schemaless values, by putting a serde_json::Value inside your own struct like this:

    1. #[derive(Serialize, Deserialize, Debug)]
    2. struct Movie {
    3. id: String,
    4. #[serde(flatten)]
    5. value: serde_json::Value,
    6. }
    7. impl Document for Movie {
    8. type UIDType = String;
    9. fn get_uid(&self) -> &Self::UIDType { &self.id }
    10. }

    Then, add documents into the index:

    1. use meilisearch_sdk::{
    2. indexes::*,
    3. document::*,
    4. client::*,
    5. search::*,
    6. progress::*,
    7. settings::*
    8. };
    9. use serde::{Serialize, Deserialize};
    10. use std::{io::prelude::*, fs::File};
    11. use futures::executor::block_on;
    12. fn main() { block_on(async move {
    13. let client = Client::new("http://localhost:7700", "masterKey");
    14. // reading and parsing the file
    15. let mut file = File::open("movies.json").unwrap();
    16. let mut content = String::new();
    17. file.read_to_string(&mut content).unwrap();
    18. let movies_docs: Vec<Movie> = serde_json::from_str(&content).unwrap();
    19. // adding documents
    20. let movies = client.get_or_create_index("movies").await.unwrap();
    21. movies.add_documents(&movies_docs, None).await.unwrap();
    22. })}

    API references

    Most actions in MeiliSearch are , including the document addition process.

    Asynchronous actions return a JSON object that contains only an updateId attribute. This is a successful response, indicating that the operation has been taken into account, but may not have been executed yet.

    You can check the status of the operation via the updateId and the get update status route. Checking the update status of an operation is never mandatory, but can prove useful in tracing the origin of errors or unexpected behavior.

    See our guide on or the updates API reference for more information.

    Now that your documents have been ingested into MeiliSearch, you are able to search them.

    MeiliSearch that you can play with to refine your search or change the format of the returned documents. However, by default, the search is already relevant.

    The search engine is now aware of your documents and can serve those via an HTTP server.

    1. curl 'http://127.0.0.1:7700/indexes/movies/search' \
    2. --data '{ "q": "botman" }'

    About this SDK

    1. index.search('botman')

    1. $index->search('botman');

    About this SDK

    1. index.search('botman')

    1. results, err := client.Search("movies").Search(meilisearch.SearchRequest{
    2. Query: "botman",
    3. })
    4. if err != nil {
    5. panic(err)
    6. }

    About this SDK

    You can build a Query and execute it later:

    1. let query: Query = Query::new(&movies)
    2. .with_query("botman")
    3. .build();
    4. let results: SearchResults<Movie> = movies.execute_query(&query).await.unwrap();
    1. let results: SearchResults<Movie> = Query::new(&movies)
    2. .with_query("botman")
    3. .execute()
    4. .await
    5. .unwrap();

    You can search in an Index directly:

    1. let results: SearchResults<Movie> = movies.search()
    2. .with_query("botman")
    3. .execute()
    4. .await
    5. .unwrap();

    MeiliSearch response:

    1. {
    2. "hits": [
    3. {
    4. "id": "29751",
    5. "title": "Batman Unmasked: The Psychology of the Dark Knight",
    6. "poster": "https://image.tmdb.org/t/p/w1280/jjHu128XLARc2k4cJrblAvZe0HE.jpg",
    7. "overview": "Delve into the world of Batman and the vigilante justice tha",
    8. "release_date": "2008-07-15"
    9. },
    10. {
    11. "id": "471474",
    12. "title": "Batman: Gotham by Gaslight",
    13. "poster": "https://image.tmdb.org/t/p/w1280/7souLi5zqQCnpZVghaXv0Wowi0y.jpg",
    14. "release_date": "2018-01-12"
    15. }
    16. ...
    17. ],
    18. "offset": 0,
    19. "limit": 20,
    20. "processingTimeMs": 2,
    21. "query": "botman"
    22. }

    API references

    We also deliver an out-of-the-box in which you can test MeiliSearch interactively.

    To do so, open your web browser and enter MeiliSearch address (in our case: http://127.0.0.1:7700) into the browser address bar.
    This will lead you to a web page with a search bar that will allow you to search in the selected index.

    The only step missing now is adding the search bar to your project. The easiest way of achieving this is to use instant-meilisearchQuick Start - 图2 (opens new window): a developer tool that generates all the search components needed to start searching.

    works on common front-end environments, such as JavaScriptQuick Start - 图4 (opens new window), , and Vue.jsQuick Start - 图6 (opens new window).

    instant-meilisearch uses an open-source library that generates everything you need from a search interface.

    Let’s Try!

    • Create an html file, for example, index.html.
    • Open it in a text editor (e.g. Notepad, Sublime Text, Visual Studio Code).
    • Copy-paste any of the code examples below and save the file.
    • Open index.html in your browser (double click on it in your folder).

    We use browser builds for ease of integration. It is possible to do this with npm or yarn. Please refer to for documentation.

    The following code sample uses plain JavaScript (opens new window).

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="utf-8" />
    5. </head>
    6. <body>
    7. <div class="wrapper">
    8. <div id="searchbox" focus></div>
    9. <div id="hits"></div>
    10. </div>
    11. <script src="https://cdn.jsdelivr.net/npm/@meilisearch/instant-meilisearch/dist/instant-meilisearch.umd.min.js"></script>
    12. <script src="https://cdn.jsdelivr.net/npm/instantsearch.js@4"></script>
    13. <script>
    14. const search = instantsearch({
    15. indexName: "movies",
    16. searchClient: instantMeiliSearch(
    17. "http://localhost:7700"
    18. )
    19. });
    20. search.addWidgets([
    21. instantsearch.widgets.searchBox({
    22. container: "#searchbox"
    23. }),
    24. instantsearch.widgets.configure({ hitsPerPage: 8 }),
    25. instantsearch.widgets.hits({
    26. container: "#hits",
    27. templates: {
    28. item: `
    29. <div>
    30. <div class="hit-name">
    31. {{#helpers.highlight}}{ "attribute": "title" }{{/helpers.highlight}}
    32. </div>
    33. </div>
    34. `
    35. }
    36. })
    37. ]);
    38. search.start();
    39. </script>
    40. </body>
    41. </html>

    The code above comes in multiple parts:

    • The first four lines of the <body> add both searchbox and hits elements. Ultimately, instant-meilisearch adds the search bar and search results in these elements.
    • <script src=".."> tags are that import libraries needed to run instant-meilisearch.
    • The JavaScript part is where you customize instant-meilisearch.

    To use instant-meilisearch using npm or yarn please visit instant-meilisearch (opens new window).

    The following code sample uses framework.

    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <meta charset="utf-8" />
    5. <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@meilisearch/instant-meilisearch/templates/basic_search.css" />
    6. </head>
    7. <body>
    8. <div id="app" class="wrapper">
    9. <ais-instant-search :search-client="searchClient" index-name="movies" >
    10. <ais-configure :hits-per-page.camel="10" />
    11. <ais-search-box placeholder="Search here…" class="searchbox"></ais-search-box>
    12. <ais-hits>
    13. <div slot="item" slot-scope="{ item }">
    14. <ais-highlight :hit="item" attribute="title" />
    15. </div>
    16. </ais-hits>
    17. </ais-instant-search>
    18. </div>
    19. </body>
    20. <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    21. <script src="https://cdn.jsdelivr.net/npm/vue-instantsearch@3.2.0/dist/vue-instantsearch.js"></script>
    22. <script src="https://cdn.jsdelivr.net/npm/@meilisearch/instant-meilisearch/dist/instant-meilisearch.umd.min.js"></script>
    23. <script>
    24. Vue.use(VueInstantSearch)
    25. var app = new Vue({
    26. el: '#app',
    27. data: {
    28. searchClient: instantMeiliSearch('http://127.0.0.1:7700')
    29. }
    30. })
    31. </script>
    32. </html>

    The code above comes in multiple parts:

    • In Vue.js customization happens directly in the <body> tag. To make instant-meilisearch work with Vue.js some components must be added. In the above example, ais-instant-search, ais-search-box and ais-hits are mandatory components to generate theinstant-meilisearch interface.
    • <script src=".."> tags are CDNs (opens new window) that import libraries needed to run instant-meilisearch with .
    • The <script> containing JavaScript initialize Vue.js. The code creates a new Vue instance that is mandatory to link Vue.js with the DOM.

    To use instant-meilisearch in Vue.js using npm or yarn please visit meilisearch-vue (opens new window).

    The following code sample uses framework.

    The code above comes in multiple parts:

    • The <body> of the page is the entry point for React. instant-meilisearch adds the search bar and search results here by manipulating the DOM.
    • <script src=".."> tags are CDNs (opens new window) that import libraries needed to run instant-meilisearch in .

    To use instant-meilisearch in React using npm or please visit meilisearch-react (opens new window).

    You should now have a MeiliSearch database and a working front-end search interface 🚀🔥 Check out to continue your MeiliSearch journey.