Use algolia in your website

In this post i will share How to use algolia for free plan. so let's starting!!!

here is my document website.

Why aligolia

Vue & React official used algolia it's free and open source!

DocSearch is split into crawler and front-end library.

Crawling is handled by the Algolia Crawler, which runs weekly by default, and you can then trigger new crawls yourself and monitor them directly from the Crawler interface, which also provides a live editor where you can maintain your configuration .
The front-end library is built on top of Algolia Autocomplete and provides an immersive search experience through its modals.

It may be because of free users, I did not succeed in finding my algolia registered application on the crawler management background, so I use the docker service to crawl the crawler and upload the data to the algolia Data Sources database

practice process record

• Apply for a registered account
• new application
• Create a new Indices data table

crawler service
Use docker directly here

Download the docker image docker pull algolia/docsearch-scraper
Start the dokcer crawler service according to the configuration
.env file

APPLICATION_ID=YOUR_APPLICATION_ID
API_KEY=YOUR_API_KEY

config.json The following configurations are just demos. Some APIs have been changed or discarded. Please refer to the configuration. New and old versions of APIs are discarded or changed and configuration reference documents
It is recommended to set up a site map here, which will capture more comprehensive websites, schedule regularly by updating the site map and setting actions, execute crawler tasks, and update index data.

{
   "index_name": "Home",
   "start_urls": [
     "URL 1",
     "url n"
   ],
   "stop_urls": [],
   "maxDepth": 2,
   "aggregateContent": true,
   "selectors": {
     "lvl0": {
       "selector": "h1",
       "global": true,
       "default_value": "Documentation"
     },
     "lvl1": "h1",
     "lvl2": "h2",
     "lvl3": "h3",
     "lvl4": "h4",
     "lvl5": "h5",
     "text": "p, li, code"
   },
   "js_render": true,
   "js_wait": 4
}

Execute the path and start the docker service

docker run -it --env-file=your file path/.env -e "CONFIG=$(cat your file path/config.json)" algolia/docsearch-scraper

follow my step:

1. add new line in you package.json

    "crawler": "node crawler.ts"

1. create crawler.ts in you project root dir:

const fs = require('fs')
const child_process = require('child_process')
const data = require('./.vitepress/dist/hashmap.json')
const envPath = `${__dirname}/.env`
const configPath = `${__dirname}/config.json`

const urls = Object.keys(data).map((key) => {
  const url = key.split('_').join('/').split('md').join('html')
  return `https://doc.tigerzh.com/${url}`
})

const config = JSON.parse(fs.readFileSync('config.json', 'utf-8'))
config.start_urls = urls

fs.writeFileSync('config.json', JSON.stringify(config))
console.log(
  'algolia done, please exec docker command',
)
console.log(`docker run -it --env-file=${envPath} -e "CONFIG=$(cat ${configPath})" algolia/docsearch-scraper`)

3.done

and then you can running docker and exec commend