تطبيق PDF AI SaaS
تم تصميم تطبيق PDF AI SaaS Full Stack باستخدام Next.js Framework و Shadcn UI و Openai و Langchain و Stripe والمزيد. يتيح التطبيق للمستخدمين تحميل أي مستند PDF مع حد الحجم بناءً على خطة الاشتراك والبحث عن معلومات محددة داخل هذا المستند. يمكن للمستخدمين المصادقين فقط استخدام النظام الأساسي. هناك خياران: خطة مجانية مع الاستخدام المحدود وخطة Pro لإعطاء المزيد من الميزات للمستخدم.
الفيديو التجريبي: الرابط
سمات
- السماح للمستخدم بتسجيل الدخول إلى النظام الأساسي
- السماح للمستخدم بتحميل أي مستند PDF والبحث عن أي محتوى داخل هذا
- بديهية السحب n 'تحميل التحميلات
- عارض PDF لمشاهدة مستند PDF الذي تم تحميله
- 100 ٪ مكتوب في TypeScript
- تم استخدام نموذج تضمين نص Opeanai لتضمين ملف PDF و GPT-4O للدردشة مع المستند
- استخدام Langchain لدمج LLM في التطبيق
- تم استخدام قاعدة بيانات ناقلات Pinecone لتخزين تضمين البيانات في مساحة المتجه
- تم استخدام قاعدة بيانات MongoDB NOSQL لتخزين معلومات المستخدم والوثائق والدردشة
- يتم استخدام دفع الشريط مع WebHook للدفع من أجل إعادة بيع المعلومات حول حالة الدفع
- يتم استخدام Next.js Framework لإنشاء تطبيق مكدس كامل
- يتم استخدام CSS Tailwind مع مكتبة مكون Shadcn UI لبناء تصميم جميل
- يتم استخدام Prisma ORM للتواصل مع قاعدة البيانات
كيفية الركض من المستودع المحلي
- استنساخ المستودع
- قم بتشغيل أمر
npm install في المحطة الخاصة بك - إنشاء Secret Auth ، والذي يقوم تلقائيًا بإنشاء ملف .env.local لمتغيرات البيئة (يمكنك استخدام .env لاحقًا ووضع السر فيه):
npx auth secret - إعداد Google Oauth: Google
- قم بإنشاء حساب Stripe واحصل على رابط المفاتيح.
- أضف رابط نقطة نهاية Webhook.
- تنشيط رابط بوابة الفواتير الشريطية.
- إنشاء رابط فهرس Pinecone.
- إضافة متغيرات البيئة إلى ملف .env:
AUTH_SECRET="<YOUR-SECRET>"
AUTH_GOOGLE_ID="<YOUR-GOOGLE-ID>"
AUTH_GOOGLE_SECRET="<YOUR-GOOGLE-SECRET>"
DATABASE_URL="<YOUR-DATABASE-URL>"
UPLOADTHING_TOKEN="<YOUR-UPLOADTHING-TOKEN>"
PINECONE_API_KEY="<YOUR-PINECONE-TOKEN>"
OPENAI_API_KEY="<YOUR-OPENAI-TOKEN>"
STRIPE_SECRET_KEY="<YOUR-STRIPE-SECRET-TOKEN>"
STRIPE_WEBHOOK_SECRET="<YOUR-STRIPE-WEBHOOK-SECRET-TOKEN>"
STRIPE_PRODUCT_PRICE_ID="<YOUR-STRIPE-PRO-PLAN-PRICE-ID>"
- قم بإنشاء منتج جديد مع ميزات على Stripe: Link
- تشغيل
npm run prisma:generate من أجل تطبيق مخطط Prisma - تشغيل
npm run prisma:push لدفع DB إلى Mongodb - تشغيل أمر
npm run dev في المحطة الخاصة بك - خادم يعمل في
http://localhost:3000/
الروابط والمعلومات المفيدة
- Prisma Env.local Talling:
- PRISMA و MONGODB EDGE توافق:
- مثال رمز Auth.JS:
- صفحة تكوين مزود Google:
- شريط ، جلسة الخروج ، webhook:
- جيثب #1
- جيثب #2
- LinkedIn.com
- dev.to
- medium.com
- بطاقات اختبار الشريط:
التبعيات
- Next.js
- رد فعل
- رد فعل دوم
- TypeScript
- استعلام Tanstack
- أيقونات لوسيد
- Tailwind CSS
- Shadcn UI
- رد فعل Dropzone
- رد فعل PDF
- سونر
- تاريخ FNS
- الصورة الحادة الأمثل
- Auth.JS
- بريزما
- mongodb
- Openai API
- لانجشين
- كوز الصنوبر
- التحميل
- PDF-PARSE
- شريط
تَخطِيط
