real time full text search nextjs

Tigris предлагает интегрированное полнотекстовое решение поиска, которое позволяет вам создавать мощные поисковые впечатления в вашем приложении. Используя технологию типов, эта встроенная поисковая система устраняет необходимость в дополнительной системе поиска, обеспечивая плавный и масштабируемый опыт для вашей базы данных.

⚡ ️ Примеры примера примеров на следующем.js - Поиск в реальном времени

Это приложение построено из Next.js и Tigris и предоставляет полное решение. Продукты хранятся и извлекаются из базы данных Tigris, которая будет отображаться для клиентов. Чтобы улучшить доступность, я интегрировал функцию поиска в реальном времени с Tigris, позволяя пользователям быстро искать желаемые продукты.

Проект Демо

Развертывание приложения

Чтобы развернуть это приложение в ваши учетные записи Vercel и NetLify, вам понадобится учетная запись GitHub, Vercel, NetLify и Tigris. После того, как у вас есть все учетные записи, просто нажмите на кнопки «Развернуть» и следуйте инструкциям, чтобы развернуть приложение на ваши учетные записи.

Запуск Next.js Server & Tigris локально

Предварительные условия

1. Зарегистрируйтесь на консоли Tigris
2. Node.js 14.6.0 или новее
3. Поддерживаются macOS, Windows и Linux

Инструкции

1. Клонировать это репо на вашем компьютере

git clone https://github.com/tigrisdata-community/realtime-search

2. Установить зависимости

 cd realtime-search
npm install

3. Запустите сервер.

npm run dev

ПРИМЕЧАНИЕ. Для работы приложения вы должны сначала создать проект на консоли Tigris, а затем скопировать сгенерированные учетные данные в файл .env . Для получения инструкций о том, как это сделать, обратитесь к сопровождающему учебному пособию ..

? Все сделано. Вы должны иметь возможность использовать приложение на localhost:3000 в браузере. Не стесняйтесь поиграть или пройти код, пройдясь дальше?

? Прохождение кода

Структура файла

 ├── package.json
├── lib
│   ├── tigris.ts
├── db
│   └── models
│       └── store.ts
└── pages
    ├── index.tsx
    └── api
        └── store
            ├── index.ts
            └── search.ts

? Определение схемы Тигриса

db/models/store.ts - в приложении есть единые products сбора, которые хранят продукты в магазине. Эта коллекция автоматически создается/обновляется с помощью скрипта настройки.

❇ API маршруты для доступа к данным в сборе Tigris

Все маршруты API следующих.js определены на pages/api/ . У нас есть три файла, разоблачающие конечные точки:

pages/api/store/index.ts

• GET /api/store , чтобы получить множество продуктов в качестве массива
• GET /api/items/search?q=query , чтобы найти и возвращать продукты, соответствующие данному запросу

Следующие шаги

Не стесняйтесь добавлять больше функциональных возможностей или настраивать приложение для вашего использования и узнать больше о платформе данных Tigris

? Внося

Вклад - это то, что делает сообщество с открытым исходным кодом таким удивительным местом для изучения, вдохновения и создания. Любой вклад, которые вы вносите, высоко ценится .

Если у вас есть предложение, которое сделает это лучше, пожалуйста, разделите репо и создайте запрос на тягу. Вы также можете просто открыть проблему. Не забудьте дать проекту звезду! Еще раз спасибо!

1. Форк проект
2. Создайте филиал своей функции ( git checkout -b feature/AmazingFeature )
3. Сделайте свои изменения ( git commit -m 'Add some AmazingFeature' )
4. Толкайте к ветке ( git push origin feature/AmazingFeature )
5. Откройте запрос на тягу

(Вернуться к вершине)