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

QueryCorner

แรงบันดาลใจ

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

มันทำอะไร

Query Corner เป็นแพลตฟอร์มการแชร์ / โซเชียล AI ที่เกิดขึ้นได้ซึ่งผู้คนสามารถแชร์พรอมต์และเทมเพลตที่รวดเร็ว ผู้ใช้สามารถแนบแท็กเข้ากับพรอมต์ของพวกเขา (ตอบสนองการเงินสุขภาพ ฯลฯ ) เพื่อช่วยในการกรองและเราใช้ embeddings และการค้นหาเวกเตอร์เพื่อใช้การค้นหาความหมายที่แข็งแกร่ง คุณสมบัติเพิ่มเติมรวมถึงประวัติการค้นหา, พรอมต์, ไลค์, และเป็นเป้าหมายยืด, ส่วนความคิดเห็น ด้วย querycorner พรอมต์ที่สมบูรณ์แบบคือการค้นหาหนึ่งครั้ง

เราสร้างมันได้อย่างไร

เราสร้างแอปพลิเคชันของเราโดยใช้บริการ/เฟรมเวิร์ก/เครื่องมือมากมาย:

  • react.js สำหรับส่วนหน้าไคลเอนต์
  • nextjs สำหรับการเรนเดอร์ฝั่งเซิร์ฟเวอร์การกำหนดเส้นทางไฟล์และการปรับปรุง SEO
  • Tailwind สำหรับการจัดแต่งทรงผม
  • Shadcn, Framer Motion และ Acernity สำหรับภาพเคลื่อนไหวและส่วนประกอบ UI
  • นูนสำหรับการจัดเก็บข้อมูลและเซิร์ฟเวอร์แบ็กเอนด์ของเรา
  • โมเดลการฝังตัวที่ทำจากข้อความของ Openai
  • เสมียนสำหรับ oauth

ความท้าทายที่เราพบ

  • การเรียนรู้พื้นฐานของ NextJS - นี่เป็นครั้งแรกที่เราเคยใช้ NextJS และต้องเรียนรู้มากมายในส่วนของทุกคน
  • การหาเวลาทำงานเป็นทีม - เราทุกคนมีชีวิตที่ยุ่งในฐานะนักศึกษาและหาเวลาในการวางแผนวิธีการทำงานแบบอะซิงโครนัสนำความท้าทายที่ไม่เหมือนใคร
  • เรียนรู้วิธีการใช้ Shadcn - นี่เป็นไลบรารีส่วนประกอบประเภทต่าง ๆ เมื่อเทียบกับ Daisyui หรือ Chakra

ความสำเร็จที่เราภูมิใจ

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

สิ่งที่เราเรียนรู้

  • ใช้ nextjs เป็นครั้งแรก
  • ใช้ Shadcn เป็นครั้งแรก
  • เรียนรู้แนวคิดเกี่ยวกับการฝังตัว
  • ทำงานร่วมกันเป็นทีมเป็นครั้งแรก

สิ่งต่อไปสำหรับ querycorner

  • ใช้การปนเปื้อนเพื่อปรับปรุงเวลาในการโหลดและประสิทธิภาพของไซต์
  • เพิ่มตัวเลือกในการลบโพสต์
  • เพิ่มตัวเลือกเพื่อดูโปรไฟล์ของผู้อื่น
  • อนุญาตให้ผู้ใช้ส่งโพสต์โดยไม่ต้องเข้าสู่ระบบ

เริ่มต้นใช้งานในพื้นที่

นี่คือ next.js project bootstrapped ด้วย create-next-app และ convex

แรกติดตั้งโหนด packes: 

npm i 
# or
npm install

จากนั้นสร้างไฟล์ .env.local ด้วยคีย์ API เสมียนของคุณ

จากนั้นเรียกใช้เซิร์ฟเวอร์การพัฒนา: 

npm run dev

เปิด http: // localhost: 3000 พร้อมเบราว์เซอร์ของคุณเพื่อดูผลลัพธ์

เรียนรู้เพิ่มเติม

หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับ next.js ลองดูแหล่งข้อมูลต่อไปนี้:

  • Next.js Documentation - เรียนรู้เกี่ยวกับคุณสมบัติ Next.js และ API
  • เรียนรู้ next.js - การสอนแบบโต้ตอบ next.js

หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับนูนลองดูแหล่งข้อมูลต่อไปนี้:

  • เอกสารนูน - เรียนรู้เกี่ยวกับคุณสมบัตินูนและแบบฝึกหัด

หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับเสมียนลองดูแหล่งข้อมูลต่อไปนี้:

  • เอกสารเสมียน - เรียนรู้เกี่ยวกับการรับรองความถูกต้องของเสมียน

หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับ Shadcn UI ลองดูแหล่งข้อมูลต่อไปนี้:

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