หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>ซอร์สโค้ดอื่น ๆ
ดาวน์โหลด

Klevu

การค้นพบผลิตภัณฑ์ที่ไม่มีหัวสำหรับทุกร่างกาย

ด้วย SDK ใหม่ของ Klevu คุณสามารถดึงพลังของการค้นพบผลิตภัณฑ์ AI เป็นอะไรก็ได้

เว็บไซต์ดั้งเดิมแอปพลิเคชันหน้าเดียว (SPA), Progressive Web App (PWA), แอพมือถือ, เว็บไซต์แคมเปญ, คีออสค์ในร้านค้า, ยานอวกาศ ... อะไรก็ตาม

ง่ายกว่าสำหรับนักพัฒนาเร็วกว่าที่จะคิดค้น

Klevu หัวหินแบบไม่มีหัว

นี่คือลิงค์ไปยังโครงการต่าง ๆ

  • @Klevu/Core Package ที่สามารถใช้ในการสร้างแนวหน้าที่ทันสมัยด้วยการค้นหา Klevu
  • ตัวอย่างปฏิกิริยาปฏิกิริยา, เราเตอร์ปฏิกิริยา, ตัวอย่าง UI ของวัสดุ
  • ตัวอย่าง Vue Vue 3, Vue-Router, ตัวอย่าง tailwindcss
  • ตัวอย่าง nuxt nuxt 3 ตัวอย่าง
  • ตัวอย่างรีมิกซ์รีมิกซ์เป็นตัวอย่างที่อิงตามการใช้ KLEVU กับการเรนเดอร์ด้านเซิร์ฟเวอร์
  • ตัวอย่างวานิลลาจาวาสคริปต์ - ตัวอย่าง JavaScript ขั้นต่ำ
  • ตัวอย่างไฮโดรเจน Shopify - ตัวอย่างไฮโดรเจนขนาดเล็ก

รวม Klevu เข้ากับแอปพลิเคชันของคุณได้อย่างง่ายดาย เราทำการยกหนักทั้งหมด

Klevu SDK นำการค้นหาอัจฉริยะหมวดหมู่การขายสินค้าและคำแนะนำไปยังร้านค้าอีคอมเมิร์ซของคุณ Klevu ทำให้ง่ายต่อการสร้างประสบการณ์การเรียกดูผลิตภัณฑ์ที่ดีที่สุดสำหรับลูกค้าของคุณ

Klevu มีไลบรารี JavaScript ที่ใช้งานง่ายซึ่งเหมาะสำหรับผู้ใช้ส่วนใหญ่แล้วห้องสมุดนี้ดีสำหรับใคร?

typescript sdk

Klevu SDK เขียนเป็น typeScript ซึ่งให้คุณ:

  • การสนับสนุนการเติมเต็มอัตโนมัติเต็มรูปแบบของสภาพแวดล้อมการพัฒนาแบบบูรณาการ (IDEs)
  • เอกสารเต็มรูปแบบจากความคิดเห็นของรหัส!
  • วิธีที่ง่ายและรวดเร็วในการรวม Klevu เข้ากับ UI ที่กำหนดเองของคุณ

Spa (แอปพลิเคชันหน้าเดียว)

ห้องสมุดนี้รองรับห้องสมุดส่วนใหญ่ที่สำคัญทั้งหมดเช่น React และ Vue อย่างไรก็ตาม SDK นี้จะช่วยให้คุณสามารถปลั๊กอิน Klevu Smart Search, หมวดหมู่การขายสินค้าและคำแนะนำในแบบที่คุณต้องการ รวมถึงการติดตามเหตุการณ์ของการคลิกผลิตภัณฑ์การค้นหาและการซื้อที่ขับเคลื่อน AI ที่แกนกลางของ Klevu

PWA (แอปพลิเคชันเว็บแบบก้าวหน้า)

PWAs ได้รับการออกแบบมาเพื่อให้ผู้ใช้มีประสบการณ์เกี่ยวกับแอพดั้งเดิม ด้วย Klevu SDK คุณสามารถนำพลังของ Klevu Ai มาสู่ PWA ของคุณได้

SSR & SSG (การแสดงผลด้านเซิร์ฟเวอร์และการสร้างไซต์คงที่)

SSR & SSG กลายเป็นคุณสมบัติมาตรฐานอย่างรวดเร็วในกรอบส่วนหน้ายอดนิยมทั้งหมดเช่น NextJS และ NUXTJS ด้วย Klevu SDK คุณสามารถเพิ่ม SEO ของร้านค้าและประสบการณ์ของผู้ใช้โดยขอผลการค้นหาหน้าหมวดหมู่และคำแนะนำก่อนโหลดหน้าเว็บ

การควบคุมความคิดสร้างสรรค์เต็มรูปแบบอย่างเต็มที่

Klevu SDK ให้นักพัฒนาควบคุมสูงสุดในวิธีที่พวกเขาต้องการแสดงและอนุญาตให้ผู้ใช้โต้ตอบกับแคตตาล็อกผลิตภัณฑ์ของคุณ เมื่อคุณเพิ่มไลบรารี SDK ลงในโครงการของคุณคุณมีหน่วยการสร้างทั้งหมดที่จำเป็นในการสร้างประสบการณ์ผู้ใช้ที่ไม่ซ้ำกันที่ไม่ซ้ำกันซึ่งเหมาะกับแบรนด์ของคุณอย่างสมบูรณ์แบบ

รายการคุณสมบัติ Klevu SDK

เราได้รวบรวมคุณสมบัติมากมายไว้ในตัวอย่างปฏิกิริยาที่มาพร้อมกับ SDK นี้ นี่คือคุณสมบัติมากมายและสถานที่หาตัวอย่างทำงาน นอกจากนี้คุณยังสามารถดูตัวอย่าง ReadMe React สำหรับข้อมูลเพิ่มเติมเกี่ยวกับสิ่งที่นำไปใช้ในตัวอย่างและคลิกที่นี่เพื่อ:

ดูการสาธิตสด

ค้นหา

คุณสมบัติ คำอธิบาย ตัวอย่าง
การค้นหาอย่างรวดเร็ว ตัวอย่างที่ใช้ในการแสดงผลการค้นหาในขณะที่คุณพิมพ์ลงในฟิลด์ข้อความ Quicksearch.tsx
หน้า Landing Page ตัวอย่างเพื่อแสดงผลการค้นหาตามคำหลักที่ส่งผ่านใน URL SearchResultPage.tsx
การนำทาง ตัวอย่างการแสดงผลผลิตภัณฑ์ในหมวดหมู่/คอลเลกชัน categorypage.tsx
การค้นหาผลิตภัณฑ์เดียว ตัวอย่างการใช้การค้นหาเพื่อสอบถามข้อมูลสำหรับผลิตภัณฑ์เดียว ProductPage.tsx
ตัวกรอง ตัวอย่างของตัวกรองเพื่อ จำกัด ผลิตภัณฑ์ตามแง่มุมของผลิตภัณฑ์ SearchResultPage.tsx
categorypage.tsx
โหลดผลลัพธ์เพิ่มเติม ตัวอย่างปุ่มโหลดเพิ่มเติมเพื่อขอผลิตภัณฑ์เพิ่มเติม SearchResultPage.tsx

การวิเคราะห์

Analytics ขับเคลื่อนการเรียนรู้ของเครื่อง Klevu ที่ใช้เพื่อให้ผลลัพธ์ที่ดีที่สุดแก่ผู้ใช้

คุณสมบัติ คำอธิบาย ตัวอย่าง
SearchEvent ติดตามสิ่งที่ถูกค้นหา Quicksearch.tsx
ค้นหาเหตุการณ์คลิกผลิตภัณฑ์ ติดตามผลิตภัณฑ์ที่คลิกจากผลการค้นหา SearchResultPage.tsx
กิจกรรมการคลิกการนำทางหมวดหมู่ ติดตามผลิตภัณฑ์ที่คลิกจากหน้าหมวดหมู่ categorypage.tsx
งานซื้อ/ซื้อ ติดตามผลิตภัณฑ์ที่ซื้อ checkOutpage.tsx

คำแนะนำ

คุณสมบัติ คำอธิบาย ตัวอย่าง
คำแนะนำศูนย์การค้า Klevu เพิ่มคำแนะนำที่สร้างขึ้นภายใน KMC 1 homepage.tsx
categorypage.tsx
ProductPage.tsx
ผลิตภัณฑ์ที่คล้ายกัน ProductPage.tsx

การทำให้เป็นส่วนตัว

คุณสมบัติ คำอธิบาย ตัวอย่าง
การทำให้เป็นส่วนตัว เพิ่มตัวบุคคลในการค้นหา Klevufetch ของคุณได้อย่างง่ายดายโดยการเพิ่มตัวดัดแปลง homepage.tsx

ระบบสาธารณูปโภค

คุณสมบัติ คำอธิบาย ตัวอย่าง
Klevukmcsettings โหลดการตั้งค่าศูนย์การค้า KLEVU ของคุณลงในท้องถิ่นของเบราว์เซอร์ index.tsx

การพัฒนาภายใน

จำเป็นต้องติดตั้ง node.js และ npm ในระบบของคุณก่อนเริ่ม สิ่งนี้ควรทำหนึ่งครั้งก่อนเริ่มการพัฒนา

แกนกลาง

ในการเรียกใช้ build and test @klevu/core คุณต้องไปที่ packages/klevu-core ก่อน

ก่อนเริ่มต้นคุณต้องติดตั้งแพ็คเกจทั้งหมดด้วย npm install

การสร้างเวอร์ชันรุ่น

npm run build สร้างเวอร์ชันการผลิตของ @klevu/core มันสร้างการสร้างที่สะอาดทุกครั้งที่มันวิ่ง

ในการเปิดตัวจริงมีสคริปต์ CI/CD utils/release-klevu-core.js ใช้ node.js เพื่อเรียกใช้

การพัฒนาหลัก

NPM Run Build: ดู

build:watch Runs Build in Watch Mode Rebuilding Application ทุกครั้งที่มีการเปลี่ยนแปลง มันไม่ได้สร้างการสร้างที่สะอาด แต่สร้างขึ้นและไม่ได้ทำทุกอย่างที่จำเป็นสำหรับการเปิดตัว เป็นการดีถ้าคุณต้องการเปลี่ยนแปลงห้องสมุดในขณะที่พัฒนาแพ็คเกจอื่น ๆ เช่น @klevu/ui ที่ต้องมีการเปลี่ยนแปลงหลัก

NPM เรียกใช้ QOC

นี่เป็นการตรวจสอบว่าคุณภาพของรหัสดีพอ จะดำเนินการโดย GitHub โดยอัตโนมัติ

การทดสอบการเรียกใช้ NPM

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

UI

ในการเริ่มสร้าง @klevu/ui คุณต้องไปที่ packages/klevu-ui โฟลเดอร์ก่อนและทำการ npm install ในการสร้างงานสร้างอย่างถูกต้องคุณต้องใช้ npm install ใน packages/klevu-ui-react และ packages/klevu-ui-vue

แพ็คเกจ React และ Vue ไม่จำเป็นต้องมีการเปลี่ยนแปลงอื่น ๆ การติดตั้งของพวกเขาจะถูกสร้างขึ้นโดยอัตโนมัติโดยโครงการ klevu-ui

การสร้างเวอร์ชันรุ่น

npm run build สร้างเวอร์ชันกระจายของ @klevu/ui แต่เพื่อสร้างเวอร์ชันที่เหมาะสมและปล่อยไลบรารี UI ทั้งสามตัวมีสคริปต์โหนด CI/CD ใน utils/update-klevu-ui.js

การพัฒนา

วิธีที่ง่ายที่สุดในการพัฒนาและทดสอบส่วนประกอบคือการใช้งานนิทาน เพื่อที่คุณต้องดู Build the UI Project และเรียกใช้นิทาน

NPM Run Build: ดู

และในหน้าต่างแยกต่างหาก

NPM Run Bookbook

สิ่งนี้ควรเปิดสภาพแวดล้อมการพัฒนา

ในการสร้างส่วนประกอบสร้างคุณสามารถใช้คำสั่ง:

NPM Run Generate

ส่วนขยาย VSCODE

ขอแนะนำให้ติดตั้งส่วนขยาย ESLint และ Prettier เพื่อสร้างรหัสที่สะอาด

เชิงอรรถ

  1. ศูนย์การค้าของ Klevu ช่วยให้คุณสร้างคำแนะนำสำหรับการใช้งานเฉพาะที่คำนึงถึงบริบทของหน้าเว็บที่เพิ่มเข้ามา

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด