CubeCobra
Release
تطبيق ويب مفتوح المصدر لبناء وإدارة واختبار لعبة Magic: the Gathering cubes.
إذا كنت مهتمًا بالمساهمة في Cube Cobra، فيرجى قراءة إرشادات المساهمة لهذا المشروع.
ستحتاج إلى تثبيت NodeJS وRedis وIDE الذي تفضله (أوصي بـ VSCode). يمكنك العثور على الموارد اللازمة هنا:
العقدة 20
نود جي إس: https://nodejs.org/en/download/
خادم ريديس:
brew install redisapt-get install redis بعد تثبيت redis، قم بتشغيل الخادم. على نظام التشغيل Mac، الاختصار للقيام بذلك هو brew services start redis . يمكنك رؤية الحالة من خلال brew services list .
يوفر Localstack محاكاة محلية لخدمات AWS المطلوبة لتشغيل CubeCobra بما في ذلك S3 وDynamoDB وCloudwatch.
يمكنك اتباع إرشادات التثبيت من موقع localstack. يتضمن الإعداد الموصى به تشغيل localstack في حاوية عامل إرساء، الأمر الذي يتطلب Docker Desktop أيضًا.
brew install localstack/tap/localstack-clicurl من localstack بمجرد تثبيت localstack، يمكنك بدء تشغيل الخادم في الخلفية باستخدام واجهة سطر الأوامر: localstack start --detached . يمكنك رؤية الحالة باستخدام localstack status .
VSCode (موصى به بشدة، ولكنه غير مطلوب): https://code.visualstudio.com/ ملحق ESLint لـ VSCode: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint ملحق أجمل لـ VSCode: https //marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
VSCode (مع ملحق ESLint وPrettier) هو البيئة الموصى بها. عند استخدام هذا الإعداد، تأكد من أن مساحة العمل المحددة هي المجلد الجذر الذي قمت باستنساخه، وهذا سيضمن أن المكون الإضافي ESLint يمكنه العمل مع قواعد الفحص الخاصة بنا. سيقوم Prettier تلقائيًا بتطبيق التنسيق القياسي على التعليمات البرمجية الخاصة بك. سيؤدي استخدام هذه المكونات الإضافية إلى تسهيل الالتزام بقواعد الفحص وتنسيق التعليمات البرمجية بشكل كبير.
للإعداد الأول، سوف تحتاج إلى تشغيل:
yarn install && yarn build
yarn setup:localهذا سوف:
إذا كنت تستخدم نظام التشغيل Windows، فستحتاج إلى تعيين bash كصدفة البرنامج النصي الخاص بك:
ستحتاج إلى التأكد من تثبيت bash في مكان ما وتشغيل الأمر التالي [مع وضع مسار bash الخاص بك بدلاً من المسار أدناه].
yarn config set script-shell " C: \ Program Files \ git \ bin \ bash.exe "وبعد ذلك يمكنك بدء البرنامج كالتالي:
yarn start:devهذا البرنامج النصي سوف:
يمكنك الآن فتح المتصفح والاتصال بالتطبيق من خلال: http://localhost:8080.
(على الرغم من حقيقة أن العقدة تشير إلى أنها تعمل على المنفذ 5000 في السجلات، يجب عليك استخدام المنفذ 8080 للاتصال.)
سيقوم Nodemon بإعادة تشغيل التطبيق في أي وقت يحدث فيه تغيير في الملف المصدر.
بعد الوصول إلى التطبيق محليًا، ستحتاج إلى إنشاء حساب مستخدم جديد باستخدام رابط "المقاومة" الموجود على شريط التنقل.
يتم ملء متغيرات البيئة من ملف .env . لم يتم تسجيل أي ملف .env ، لذا يقوم البرنامج النصي للإعداد بنسخ .env_EXAMPLE إلى .env ومع بعض القيم الافتراضية لدعم CubeCobra المدعوم بواسطة LocalStack.
يمكنك تشغيل مثيل محلي لـ Cube Cobra مقابل موارد AWS الحقيقية بدلاً من LocalStack، إذا رغبت في ذلك. بعد إعداد S3 وDynamoDB وCloudwatch باستخدام حساب AWS الخاص بك، يمكنك إدراج بيانات الاعتماد الخاصة بك في ملف .env .
فيما يلي جدول حول كيفية ملء env vars:
| اسم المتغير | الوصف | مطلوب؟ | | ---------------------- | -------------------------------------------------- ------------------------------------------ | --------- | --- | | AWS_ACCESS_KEY_ID | مفتاح وصول AWS لحسابك. | نعم | | AWS_ENDPOINT | نقطة النهاية الأساسية التي سيتم استخدامها لـ AWS. يُستخدم للإشارة إلى localstack بدلاً من AWS المستضافة. | | | AWS_LOG_GROUP | اسم مجموعة سجلات AWS CloudWatch المراد استخدامها. | نعم | | AWS_LOG_STREAM | اسم دفق سجل AWS CloudWatch المطلوب استخدامه. | | | AWS_REGION | منطقة AWS المراد استخدامها (الافتراضي: us-east-2). | نعم | | AWS_SECRET_ACCESS_KEY | مفتاح الوصول السري لـ AWS لحسابك. | نعم | | CUBECOBRA_VERSION | نسخة مكعب كوبرا. | | | DATA_BUCKET | اسم حاوية AWS S3 المراد استخدامها. سوف تحتاج إلى إنشاء هذه المجموعة في حسابك. | نعم | | المجال | اسم المجال للخادم. يستخدم لعمليات إعادة التوجيه الخارجية مثل رسائل البريد الإلكتروني. | نعم | | DOWNTIME_ACTIVE | ما إذا كان الموقع في وضع التوقف أم لا. | | | DYNAMO_PREFIX | البادئة المستخدمة لجداول DynamoDB. يمكنك ترك هذا كقيمة افتراضية | نعم | | EMAIL_CONFIG_PASSWORD | كلمة المرور لحساب البريد الإلكتروني الذي سيتم استخدامه لإرسال رسائل البريد الإلكتروني. | | | EMAIL_CONFIG_USERNAME | اسم المستخدم لحساب البريد الإلكتروني الذي سيتم استخدامه لإرسال رسائل البريد الإلكتروني. | | | إنف | البيئة لتشغيل Cube Cobra فيها. | نعم | | | NITROPAY_ENABLED | ما إذا كان سيتم تمكين NitroPay، مزود الإعلانات الخاص بنا أم لا. | | | NODE_ENV | البيئة لتشغيل Cube Cobra فيها. | نعم | | PATREON_CLIENT_ID | معرف العميل لتطبيق Patreon OAuth. | | | PATREON_CLIENT_SECRET | سر العميل لتطبيق Patreon OAuth. | | | PATREON_HOOK_SECRET | سر خطاف الويب Patreon. | | | PATREON_REDIRECT | عنوان URL لإعادة التوجيه لتطبيق Patreon OAuth. | | | ميناء | المنفذ الذي سيتم تشغيل Cube Cobra عليه. | نعم | | ريديس_HOST | عنوان URL لخادم Redis. | نعم | | REDIS_SETUP | ما إذا كان سيتم إعداد خادم Redis أم لا - فهذا ضروري لـ Redis وليس لـ elasticache. | | | سر | عبارة سرية للتشفير. يمكنك ترك القيمة الافتراضية. | نعم | | SESSION_SECRET | عبارة سرية لتشفير الجلسة. يمكنك ترك القيمة الافتراضية. | نعم | | جلسة | اسم ملف تعريف الارتباط للجلسة. يمكنك ترك القيمة الافتراضية. | نعم | | TCG_PLAYER_PRIVATE_KEY | المفتاح الخاص لواجهة برمجة تطبيقات TCGPlayer. | | | TCG_PLAYER_PUBLIC_KEY | المفتاح العام لواجهة برمجة تطبيقات TCGPlayer. | | | ذاكرة التخزين المؤقت_ممكّنة | ما إذا كان سيتم تمكين التخزين المؤقت أم لا. | | | AUTOSCALING_GROUP | اسم مجموعة القياس التلقائي التي يتم تشغيل هذا المثيل فيها، والمستخدم لذاكرة التخزين المؤقت الموزعة. | | | CACHE_SECRET | سر ذاكرة التخزين المؤقت الموزعة. | |
في نصوص الإعداد الأولية، تكون yarn update-cards هي ما ينشئ تعريفات البطاقة. سيؤدي تشغيل هذا البرنامج النصي إلى سحب أحدث البيانات من scryfall.
إذا كنت تريد تحليلات البطاقة، يمكنك تشغيل البرنامج النصي التالي:
yarn update-allوهذا سيكون بالتسلسل:
يوفر Express 4 إطار عمل ويب بسيطًا لدعم عرض القالب باستخدام PugJS 3 وتعريف نقاط نهاية واجهة برمجة التطبيقات المستندة إلى JSON. تُستخدَم قوالب HTML بشكل أساسي لعرض صفحة صغيرة لـ React لتتمكن من تشغيل نفسها باستخدام الدعائم الأولية التي يتم حقنها من الخادم.
نحن نحتفظ بجميع تعريفات البطاقة في ملفات كبيرة تمت معالجتها مسبقًا، بحيث تحتاج العقد في الإنتاج فقط إلى تنزيل الملفات وتحميلها، ويمكنها جلب أحدث الملفات من S3 عندما تكون جاهزة. نحن نفعل ذلك لأن القراءة من الذاكرة أسرع بكثير من الاضطرار إلى تقديم طلبات إلى خدمة أخرى في أي وقت نحتاج فيه إلى بيانات البطاقة.
تكون العملية الخارجية مسؤولة عن تحديث تعريفات البطاقة وتحميلها إلى S3. هذه العملية نفسها مسؤولة أيضًا عن تحديث تحليلات البطاقة وتصدير البيانات.
نحن نستخدم redis للتحكم في التزامن للصياغة متعددة اللاعبين. تتم معالجة جميع عمليات redis في multiplayerDrafting.js
يقوم كل مثيل للخادم السريع بتشغيل مهمة باستخدام جدول العقدة كل ليلة لتحديث قاعدة البيانات الموجودة في الذاكرة من s3.
يتم تنفيذ البرامج النصية لـ Bash ( jobs/definition ) بشكل دوري على AWS لتشغيل المهام كل ساعة ويومية وأسبوعية.
يتم تعريف عوامل تصفية البطاقة التي يمكن استخدامها بواسطة الواجهة الأمامية والخلفية. Nearley عبارة عن مجموعة أدوات محلل Nodejs تُستخدم لإنشاء تعليمات برمجية تحدد عوامل التصفية التي يمكن تطبيقها على قاعدة بيانات البطاقة.
يتم طرح TypeScript 5.5 تدريجيًا لاستبدال استخدام مكونات Vanilla JS بـ PropTypes.
يتم توفير المكونات بواسطة Reactstrap 9 الذي يتم تشغيله بواسطة [Bootstrap v5.1] [boostrap]، والذي يستخدم SCSS.
تستخدم المكونات عادةً فئات التمهيد بشكل مباشر للحصول على تصميم إضافي، ولكنها قد تستخدم أيضًا أسماء الفئات العامة المحددة في ملفات CSS العامة.
