real time full text search nextjs

Tigris นำเสนอโซลูชันการค้นหาข้อความแบบเต็มรูปแบบที่ช่วยให้คุณสร้างประสบการณ์การค้นหาที่ทรงพลังภายในแอปพลิเคชันของคุณ การใช้เทคโนโลยี TypeSense เครื่องมือค้นหาแบบฝังตัวนี้ไม่จำเป็นต้องใช้ระบบการค้นหาเพิ่มเติมซึ่งมอบประสบการณ์ที่ราบรื่นและปรับขนาดได้สำหรับฐานข้อมูลของคุณ

⚡แอพตัวอย่าง️tigrisใน next.js - การค้นหาตามเวลาจริง

แอปพลิเคชันนี้สร้างขึ้นด้วย next.js และไทกริสและให้บริการโซลูชันเต็มรูปแบบ ผลิตภัณฑ์จะถูกจัดเก็บและดึงข้อมูลจากฐานข้อมูล Tigris เพื่อแสดงให้กับลูกค้า เพื่อปรับปรุงการเข้าถึงฉันได้รวมคุณสมบัติการค้นหาแบบเรียลไทม์เข้ากับไทกริสช่วยให้ผู้ใช้สามารถค้นหาผลิตภัณฑ์ที่ต้องการได้อย่างรวดเร็ว

การสาธิตโครงการ

การปรับใช้แอป

ในการปรับใช้แอพนี้ไปยังบัญชี vercel และ netlify ของคุณคุณจะต้องมีบัญชี GitHub, Vercel, Netlify และ Tigris เมื่อคุณมีบัญชีทั้งหมดเพียงคลิกที่ปุ่ม "ปรับใช้" และทำตามคำแนะนำเพื่อปรับใช้แอพไปยังบัญชีของคุณ

เรียกใช้ Next.js Server & Tigris ในเครื่อง

ข้อกำหนดเบื้องต้น

1. ลงทะเบียนบนคอนโซลไทกริส
2. node.js 14.6.0 หรือใหม่กว่า
3. รองรับ MacOS, Windows และ Linux

คำแนะนำ

1. โคลน repo นี้บนคอมพิวเตอร์ของคุณ

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

2. ติดตั้งการพึ่งพา

 cd realtime-search
npm install

3. เรียกใช้เซิร์ฟเวอร์ next.js

npm run dev

หมายเหตุ: เพื่อให้แอปพลิเคชันทำงานคุณต้องสร้างโครงการบนคอนโซลไทกริสก่อนจากนั้นคัดลอกข้อมูลรับรองที่สร้างขึ้นไปยังไฟล์. .env สำหรับคำแนะนำเกี่ยวกับวิธีการทำเช่นนี้โปรดดูบทช่วยสอนประกอบ ..

- ทำทั้งหมด คุณควรใช้แอพใน localhost:3000 ในเบราว์เซอร์ อย่าลังเลที่จะเล่นหรือทำรหัสผ่านต่อไป?

- คำแนะนำรหัส

โครงสร้างไฟล์

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

- นิยาม Tigris Schema

db/models/store.ts - แอพมี products คอลเลกชันเดียวที่เก็บผลิตภัณฑ์ในร้านค้า คอลเลกชันนี้จะถูกสร้าง/อัปเดตโดยอัตโนมัติโดยสคริปต์การตั้งค่า

❇เส้นทาง API เพื่อเข้าถึงข้อมูลใน Tigris Collection

เส้นทาง Next.js API ทั้งหมดจะถูกกำหนดภายใต้ pages/api/ เรามีสามไฟล์ที่เปิดเผยจุดสิ้นสุด:

pages/api/store/index.ts

• GET /api/store เพื่อรับอาร์เรย์ของผลิตภัณฑ์เป็นอาร์เรย์
• GET /api/items/search?q=query เพื่อค้นหาและส่งคืนผลิตภัณฑ์ที่ตรงกับแบบสอบถามที่กำหนด

ขั้นตอนต่อไป

อย่าลังเลที่จะเพิ่มฟังก์ชันการทำงานเพิ่มเติมหรือปรับแต่งแอพสำหรับกรณีการใช้งานของคุณและเรียนรู้เพิ่มเติมเกี่ยวกับแพลตฟอร์มข้อมูล Tigris

- การบริจาค

การมีส่วนร่วมคือสิ่งที่ทำให้ชุมชนโอเพ่นซอร์สเป็นสถานที่ที่น่าทึ่งในการเรียนรู้สร้างแรงบันดาลใจและสร้าง การมีส่วนร่วมใด ๆ ที่คุณทำ จะได้รับการชื่นชมอย่างมาก

หากคุณมีข้อเสนอแนะที่จะทำให้สิ่งนี้ดีขึ้นโปรดแยก repo และสร้างคำขอดึง นอกจากนี้คุณยังสามารถเปิดปัญหาได้ อย่าลืมให้โครงการเป็นดารา! ขอบคุณอีกครั้ง!

1. แยกโครงการ
2. สร้างสาขาคุณลักษณะของคุณ ( git checkout -b feature/AmazingFeature )
3. กระทำการเปลี่ยนแปลงของคุณ ( git commit -m 'Add some AmazingFeature' )
4. Push to the Branch ( git push origin feature/AmazingFeature )
5. เปิดคำขอดึง

(กลับไปด้านบน)