تطبيق ويب للأفلام الكل في واحد مع تجربة مشغل يشبه YouTube
هذا المشروع هو تطبيق ويب يسمح لك بمشاهدة الأفلام والبرامج التلفزيونية والأنيمي في مكان واحد. إنه مصمم ليكون منصة بسيطة وسهلة الاستخدام توفر تجربة لاعب تشبه YouTube. يعمل التطبيق عن طريق عرض ملفات الفيديو من مقدمي الخدمات التابعة لجهات خارجية داخل واجهة مستخدم بديهية وجمالية. يتم جلب المحتوى من أطراف ثالثة ويتم تجريف الكشط بالكامل على العميل. هذا يعني أن Hoster ليس لديه ملفات أو وسائط على الخادم الخاص بهم. يتم دفق جميع الملفات مباشرة من أطراف ثالثة.
يمكنك العثور على الإصدار المباشر من التطبيق على TV.Kurr.dev.
تجربة مشغل شبيهة على YouTube- اختصارات لوحة المفاتيح على سطح المكتب ، وعناصر التحكم في الإيماءات على الأجهزة المحمولة ، والصور في الصورة ، ووضع الشاشة الكاملة ، ووضع المسرح ، والبحث عن الجدول الزمني ، وعناصر التحكم في مستوى الصوت ، ومعاينة الصور المصغرة ، والترجمة ، ومسارات الصوت المترجمة ، إلخ.
التقدم - يتتبع التطبيق تقدمك في السلسلة والأفلام التي تشاهدها. يمكنك دائمًا متابعة المشاهدة من حيث توقفت.
Play Continuous - يلعب التطبيق تلقائيًا الحلقة التالية / الفيلم التالي في الكون السينمائي في السلسلة.
استكشف - اكتشف عناوين جديدة حسب النوع ، السنة ، التصنيف ، المجموعات ، الأكوان السينمائية ، إلخ.
شارك - أرسل الوقت الدقيق للفيديو إلى أصدقائك.
الملف الشخصي - احفظ العناوين إلى قوائمك المفضلة ، شاهد ، شاهدت ، مصنفة.
يتم إنشاء Project مع: TypeScript ، React ، RTK ، Firebase (Auth ، Firestore ، REALTIME DATABASE) ، Shadcn/UI ، React-Player ، Dexie ، CORS Proxy والمزيد.
الهدف الرئيسي وراء هذه القرارات هو إنشاء تطبيق ويب للأفلام دون أي نفقات.
لأغطيتي ، توفر Firebase طبقة مجانية تكفي لاحتياجاتي. ولكن قد تسأل "لماذا قاعدة بيانات Firestore و Realtime؟" سؤال عادل.
يعتمد نموذج تسعير قاعدة بيانات REATIME على كمية البيانات المخزنة وكمية البيانات التي تم تنزيلها. إنه خيار جيد للكيانات التي يتم تحديثها بشكل متكرر وليس كبيرًا جدًا. لهذا السبب ، أستخدمه لتخزين إعدادات تشغيل المستخدم مثل العنوان الذي تمت مراقبته الأخير ، حيث توقف المستخدم ، إلخ.
يعتمد نموذج تسعير Firestore على عدد القراءات والكتابة والحذف. إنه خيار جيد للكيانات التي لم يتم تحديثها بشكل متكرر. لهذا السبب ، أستخدمها لتخزين البيانات الرئيسية مثل المستخدمين المحفوظين والمشاهدة أو المصنفة والمصنفات المفضلة ، إلخ.
أستخدم أيضًا Dexie لتخزين البيانات في Browser INSTINGEDB. يتيح لي هذا إجراء ذاكرة التخزين المؤقت على جانب العميل من أجل تقليل الحمل على خادم الوكيل الخاص بي وتسريع وقت تحميل التطبيق بشكل عام. أقوم بإبطال ذاكرة التخزين المؤقت كل 24 ساعة. يتم ذلك لتجنب الموقف عندما تكون البيانات قديمة (في حالة إصدار حلقة جديدة ، إلخ).
يمكنني استخدام خادم CORS الخاص بي لتجاوز قيود الكورس في المتصفح. هذا ضروري لأنني كشط البيانات من موقع لا يوفر واجهة برمجة تطبيقات ولا يتم إعداد رؤوس CORS. يمكنك العثور على مزيد من المعلومات حول الخادم في مستودع CORS Proxy.
# Clone git repository
git clone https://github.com/kurrx/tv.kurr.dev.git
cd tv.kurr.dev
# Install dependencies
npm install
# Create development .env from example, and edit it
cp .env.example .env.development.local
# Start development server
npm run start
أولاً ، تحتاج إلى إنشاء ملف .env.development.local
في جذر المشروع. سيحتوي هذا الملف على جميع متغيرات البيئة المطلوبة للتطبيق للعمل. يمكنك استخدام ملف .env.example
كقالب.
...
VITE_PROVIDER_URL=https://example.com
VITE_PROXY_URL=https://example.com
VITE_FIREBASE_API_KEY=YOUR_API_KEY
VITE_FIREBASE_AUTH_DOMAIN=AUTH_DOMAIN_HOST
VITE_FIREBASE_PROJECT_ID=YOUR_PROJECT_ID
VITE_FIREBASE_STORAGE_BUCKET=STORAGE_BUCKET_HOST
VITE_FIREBASE_MESSAGING_SENDER_ID=SENDER_ID
VITE_FIREBASE_APP_ID=APP_ID
VITE_FIREBASE_DB_URL=DB_URL
...
VITE_FIREBASE_*
- لتكوين هذه الإعدادات ، يجب أن تكون على دراية بـ Firebase وخدماتها. يمكنك العثور على مزيد من المعلومات حول Firebase في الوثائق الرسمية. يمكن العثور على جميع المتغيرات في وحدة تحكم Firebase في إعدادات مشروعك.
VITE_PROVIDER_URL
- عنوان URL للموقع الذي يوفر البيانات. تم تصميم هذا المشروع للعمل مع موقع ويب محدد واحد لن أفصحه لأسباب تتعلق بالسلامة. يمكنك استخدام أي موقع آخر يوفر بيانات مماثلة (وإلا فإنك تحتاج إلى تغيير جميع الكتابة وضبطها بنفسك). ضع في اعتبارك أنك تحتاج أيضًا إلى تغيير الكود الذي يقوم بإخلاص البيانات من الموقع في الملفات التالية: api/ajax.ts
، api/parser.ts
.
VITE_PROXY_URL
- عنوان URL لخادم الوكيل. يستخدم هذا الخادم لتجاوز قيود المتصفح. لهذا الأغراض ، يمكنك استخدام مشروعي - CORS Proxy.
لقد قمت بإنشاء هذا التطبيق بشكل قاطع لغرض التدريب وإظهار مهاراتي كمحترف في مجال بلدي. لا أتابع الغرض من توزيع أو بيع محتوى الفيديو المحمي بحقوق الطبع والنشر. أنا لا أستضيف أي ملفات ، فهو مجرد روابط لخدمات الطرف الثالث. يجب تناول القضايا القانونية مع مضيفي الملف ومقدمي الخدمات. أنا لست مسؤولاً عن أي ملفات إعلامية تظهرها مقدمي الفيديو.
إن الوصول إلى طلبي مقيد للغاية وهو متاح فقط في وضع القراءة فقط . لا يمكن لأحد الوصول إلى محتوى الفيديو المحمي بحقوق الطبع والنشر دون إذن مني. حتى عند منح الوصول إلى الموقع ، فهو مخصص لأغراض توضيحية بحتة ، وسيتم إلغاء الوصول بعد ذلك بفترة قصيرة. لا أقوم بتخزين أي بيانات محمية بحقوق الطبع والنشر على الخادم الخاص بي ولا أقدم علنًا أي روابط تنزيل/دفق للمحتوى.
جميع المواد والبيانات التي أخذه من المصادر العامة باستخدام تجريف الويب. إذا كنت حامل حقوق الطبع والنشر وترغب في إزالة المحتوى من التطبيق ، فيجب عليك القيام بذلك على الموقع الذي يوفر البيانات (رابط للمزود الذي يمكنك العثور عليه هنا). أنا أحترم الملكية الفكرية للآخرين. إذا كنت تعتقد أن عملك قد تم نسخه بطريقة تشكل انتهاكًا لحقوق الطبع والنشر ، فيرجى الاتصال بي بطريقة مريحة لك باستخدام الروابط على موقع الويب الخاص بي.
ترخيص معهد ماساتشوستس للتكنولوجيا
حقوق الطبع والنشر (C) 2024 Kurbanali Ruslan [email protected]
يتم منح الإذن بموجب هذا ، مجانًا ، لأي شخص يحصل على نسخة من هذا البرنامج وملفات الوثائق المرتبطة ("البرنامج") ، للتعامل في البرنامج دون تقييد ، بما في ذلك على سبيل المثال لا الحصر حقوق استخدام ، نسخ ، تعديل ، دمج أو نشر نسخ وتوزيعها و/أو بيعها و/أو بيع نسخ من البرامج ، والسماح للأشخاص الذين يتم تقديم البرنامج لهم للقيام بذلك ، مع مراعاة الشروط التالية:
يجب إدراج إشعار حقوق الطبع والنشر أعلاه وإشعار الإذن هذا في جميع النسخ أو الأجزاء الكبيرة من البرنامج.
يتم توفير البرنامج "كما هو" ، دون أي ضمان من أي نوع ، صريح أو ضمني ، بما في ذلك على سبيل المثال لا الحصر ضمانات القابلية للتسويق واللياقة لغرض معين وعدم الانفجار. لا يجوز بأي حال من الأحوال أن يتحمل المؤلفون أو حاملي حقوق الطبع والنشر مسؤولية أي مطالبة أو أضرار أو مسؤولية أخرى ، سواء في إجراء عقد أو أضرار أو غير ذلك ، ناشئة عن البرامج أو خارجها أو الاستخدام أو غيرها برمجة.