|
1 | | -<div align="center"> |
| 1 | +# Typesense DocSearch.js |
2 | 2 |
|
3 | | -[](https://docsearch.algolia.com) |
| 3 | +This is a fork of Algolia's awesome [DocSearch.js](https://github.com/algolia/docsearch) library, customized to send queries to [Typesense](https://typesense.org). |
4 | 4 |
|
5 | | -The easiest way to add search to your documentation – for free. |
| 5 | +To be able to use this, you'd first need to setup and run the [Typesense DocSearch Scraper](https://github.com/typesense/typesense-docsearch-scraper). |
6 | 6 |
|
7 | | -[](https://app.netlify.com/sites/docsearch/deploys) [](https://www.npmjs.com/package/@docsearch/js/v/alpha) [](https://github.com/algolia/docsearch/network/dependents) [](./LICENSE) |
| 7 | +#### What is Typesense? |
8 | 8 |
|
9 | | -<p align="center"> |
10 | | - <strong> |
11 | | - <a href="https://docsearch.algolia.com">Documentation</a> • |
12 | | - <a href="https://codesandbox.io/s/docsearchjs-v3-playground-z9oxj">JavaScript Playground</a> • |
13 | | - <a href="https://codesandbox.io/s/docsearch-react-v3-playground-619yg">React Playground</a> |
14 | | - </strong> |
15 | | -</p> |
| 9 | +If you're new to Typesense, it is an **open source** search engine that is simple to use, run and scale, with clean APIs and documentation. |
16 | 10 |
|
17 | | -</div> |
18 | | - |
19 | | ---- |
20 | | - |
21 | | -DocSearch crawls your documentation, pushes the content to an Algolia index and provides a dropdown search experience on your website. |
22 | | - |
23 | | -## Preview |
24 | | - |
25 | | - |
| 11 | +Think of it as an open source alternative to Algolia and an easier-to-use, batteries-included alternative to ElasticSearch. Get a quick overview from [this guide](https://typesense.org/guide/). |
26 | 12 |
|
27 | 13 | ## Usage |
28 | 14 |
|
29 | | -> Don't have your Algolia credentials yet? [Apply to DocSearch](https://docsearch.algolia.com/apply)! |
30 | | -
|
31 | | -### JavaScript |
32 | | - |
33 | | -#### Installation |
34 | | - |
35 | | -```sh |
36 | | -yarn add @docsearch/js@4 |
37 | | -# or |
38 | | -npm install @docsearch/js@4 |
39 | | -``` |
40 | | - |
41 | | -If you don’t want to use a package manager, you can use a standalone endpoint: |
42 | | - |
43 | | -```html |
44 | | -<script src="https://cdn.jsdelivr.net/npm/@docsearch/js@4"></script> |
45 | | -``` |
46 | | - |
47 | | -#### Get started |
48 | | - |
49 | | -To get started, you need a [`container`](https://docsearch.algolia.com/docs/api#container) for your DocSearch component to go in. If you don’t have one already, you can insert one into your markup: |
50 | | - |
51 | | -```html |
52 | | -<div id="docsearch"></div> |
53 | | -``` |
54 | | - |
55 | | -Then, insert DocSearch into it by calling the [`docsearch`](https://docsearch.algolia.com/docs/api) function and providing the container. It can be a [CSS selector](https://developer.mozilla.org/en-us/docs/web/css/css_selectors) or an [Element](https://developer.mozilla.org/en-us/docs/web/api/htmlelement). |
56 | | - |
57 | | -Make sure to provide a [`container`](https://docsearch.algolia.com/docs/api#container) (for example, a `div`), not an `input`. DocSearch generates a fully accessible search box for you. |
58 | | - |
59 | | -```js app.js |
60 | | -import docsearch from '@docsearch/js'; |
61 | | - |
62 | | -import '@docsearch/css'; |
63 | | - |
64 | | -docsearch({ |
65 | | - container: '#docsearch', |
66 | | - appId: 'YOUR_APP_ID', |
67 | | - indexName: 'YOUR_INDEX_NAME', |
68 | | - apiKey: 'YOUR_SEARCH_API_KEY', |
69 | | -}); |
70 | | -``` |
71 | | - |
72 | | -### React |
73 | | - |
74 | | -#### Installation |
75 | | - |
76 | | -```bash |
77 | | -yarn add @docsearch/react@4 |
78 | | -# or |
79 | | -npm install @docsearch/react@4 |
80 | | -``` |
81 | | - |
82 | | -If you don’t want to use a package manager, you can use a standalone endpoint: |
83 | | - |
84 | | -```html |
85 | | -<script src="https://cdn.jsdelivr.net/npm/@docsearch/react@4"></script> |
86 | | -``` |
87 | | - |
88 | | -#### Get started |
89 | | - |
90 | | -DocSearch generates a fully accessible search box for you. |
91 | | - |
92 | | -```jsx App.js |
93 | | -import { DocSearch } from '@docsearch/react'; |
94 | | - |
95 | | -import '@docsearch/css'; |
96 | | - |
97 | | -function App() { |
98 | | - return ( |
99 | | - <DocSearch |
100 | | - appId="YOUR_APP_ID" |
101 | | - apiKey="YOUR_SEARCH_API_KEY" |
102 | | - indices=["YOUR_ALGOLIA_INDEX"] |
103 | | - /> |
104 | | - ); |
105 | | -} |
106 | | - |
107 | | -export default App; |
108 | | -``` |
109 | | - |
110 | | -## Styling |
111 | | - |
112 | | -[Read documentation →](https://docsearch.algolia.com/docs/styling) |
113 | | - |
114 | | -## Related projects |
115 | | - |
116 | | -DocSearch is made of the following repositories: |
117 | | - |
118 | | -- **[algolia/docsearch](https://github.com/algolia/docsearch)**: DocSearch source code. |
119 | | -- **[algolia/docsearch/packages/website](https://github.com/algolia/docsearch/tree/main/packages/website)**: DocSearch website and documentation. |
120 | | -- **[algolia/docsearch-configs](https://github.com/algolia/docsearch-configs)**: DocSearch websites configurations that DocSearch powers. |
121 | | -- **[algolia/docsearch-scraper](https://github.com/algolia/docsearch-scraper)**: DocSearch crawler that extracts data from your documentation. |
122 | | - |
123 | | -## Used by |
| 15 | +Read detailed step-by-step instructions on how to configure and setup this version of DocSearch.js on Typesense's dedicated documentation site: https://typesense.org/docs/latest/guide/docsearch.html. |
124 | 16 |
|
125 | | -DocSearch is used by [Bootstrap](https://github.com/twbs/bootstrap), [Cheerio](https://github.com/cheeriojs/cheerio), [Element Plus](https://github.com/element-plus/element-plus), [Authelia](https://github.com/authelia/authelia), [MDX](https://github.com/mdx-js/mdx), [VitePress](https://github.com/vuejs/vitepress) and [many more](https://github.com/algolia/docsearch/network/dependents). |
| 17 | +## Packages |
126 | 18 |
|
127 | | -[](https://github.com/algolia/docsearch/network/dependents) |
128 | | -Generated with [usedby.dev](https://usedby.dev/) |
| 19 | +- `typesense-docsearch.js` |
| 20 | +- `typesense-docsearch-react` |
| 21 | +- `typesense-docsearch-css` |
129 | 22 |
|
130 | | -## License |
| 23 | +## Help |
131 | 24 |
|
132 | | -[MIT](LICENSE) |
| 25 | +If you have any questions or run into any problems, please create a Github issue and we'll try our best to help. |
0 commit comments