cubocobra
Release
Una aplicación web de código abierto para crear, gestionar y probar cubos de Magic: the Gathering.
Si está interesado en contribuir a Cube Cobra, lea las pautas de contribución para este proyecto.
Necesitará instalar NodeJS, Redis y un IDE de su preferencia (recomiendo VSCode). Puedes encontrar los recursos necesarios aquí:
Nodo 20
NodeJS: https://nodejs.org/en/download/
Servidor Redis:
brew install redisapt-get install redis Después de instalar redis, inicie el servidor. En Mac, un atajo para hacer esto es brew services start redis . Puede ver el estado con brew services list .
Localstack proporciona una emulación local de los servicios de AWS necesarios para ejecutar CubeCobra, incluidos S3, DynamoDB y Cloudwatch.
Puede seguir las pautas de instalación del sitio localstack. La configuración recomendada implica ejecutar localstack en un contenedor acoplable, lo que también requiere Docker Desktop.
brew install localstack/tap/localstack-clicurl de localstack Una vez instalado localstack, puede iniciar el servidor en segundo plano con la CLI: localstack start --detached . Puede ver el estado con localstack status .
VSCode (muy recomendado, pero no obligatorio): https://code.visualstudio.com/ Extensión ESLint para VSCode: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint Extensión más bonita para VSCode: https ://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
VSCode (con la extensión ESLint y Prettier) es el entorno recomendado. Al utilizar esta configuración, asegúrese de que el espacio de trabajo seleccionado sea la carpeta raíz que ha clonado, esto garantizará que el complemento ESLint pueda funcionar con nuestras reglas de linting. Prettier aplicará automáticamente el formato estándar a su código. El uso de estos complementos facilitará significativamente el cumplimiento de las reglas de formato de código y linting.
Para la primera configuración, deberá ejecutar:
yarn install && yarn build
yarn setup:localEsto:
Si está en Windows, deberá configurar bash como su shell de script:
Deberá asegurarse de tener instalado bash en algún lugar y ejecutar el siguiente comando [con su ruta bash en lugar de la ruta a continuación].
yarn config set script-shell " C: \ Program Files \ git \ bin \ bash.exe "Luego puedes iniciar el programa así:
yarn start:devEste script:
Ahora puede abrir un navegador y conectarse a la aplicación a través de: http://localhost:8080.
(A pesar de que el nodo dice que se está ejecutando en el puerto 5000 en los registros, debe usar el puerto 8080 para conectarse).
Nodemon reiniciará la aplicación cada vez que haya un cambio en un archivo fuente.
Después de acceder a la aplicación localmente, deberá crear una nueva cuenta de usuario utilizando el enlace "Resistir" en la barra de navegación.
Las variables de entorno se completan desde el archivo .env . No hay ningún archivo .env registrado, por lo que el script de configuración copia .env_EXAMPLE a .env y con algunos valores predeterminados para admitir CubeCobra respaldado por LocalStack.
Puede ejecutar una instancia local de Cube Cobra con recursos reales de AWS en lugar de LocalStack, si lo desea. Después de configurar S3, DynamoDB y Cloudwatch con su cuenta de AWS, puede insertar sus credenciales en el archivo .env .
Aquí hay una tabla sobre cómo completar las variables env:
| Nombre de variable | Descripción | ¿Requerido? | | ---------------------- | -------------------------------------------------- ------------------------------------------ | --------- | --- | | AWS_ACCESS_KEY_ID | La clave de acceso de AWS para su cuenta. | Sí | | AWS_ENDPOINT | El punto final base que se utilizará para AWS. Se utiliza para apuntar a localstack en lugar de a AWS alojado. | | | AWS_LOG_GROUP | El nombre del grupo de registros de AWS CloudWatch que se utilizará. | Sí | | AWS_LOG_STREAM | El nombre de la secuencia de registros de AWS CloudWatch que se utilizará. | | | AWS_REGION | La región de AWS que se utilizará (predeterminada: us-east-2). | Sí | | AWS_SECRET_ACCESS_KEY | La clave de acceso secreta de AWS para su cuenta. | Sí | | CUBECOBRA_VERSION | La versión de Cube Cobra. | | | CUBO_DATOS | El nombre del depósito de AWS S3 que se utilizará. Deberá crear este depósito en su cuenta. | Sí | | DOMINIO | El nombre de dominio del servidor. Se utiliza para redireccionamientos externos como correos electrónicos. | Sí | | DOWNTIME_ACTIVE | Si el sitio está o no en modo de inactividad. | | | PREFIJO_DINAMO | El prefijo que se utilizará para las tablas de DynamoDB. Puede dejar esto como valor predeterminado | Sí | | EMAIL_CONFIG_PASSWORD | La contraseña de la cuenta de correo electrónico que se utilizará para enviar correos electrónicos. | | | EMAIL_CONFIG_USERNAME | El nombre de usuario de la cuenta de correo electrónico que se utilizará para enviar correos electrónicos. | | | ENV | El entorno para ejecutar Cube Cobra. | Sí | | | NITROPAY_ENABLED | Si habilitar o no NitroPay, nuestro proveedor de publicidad. | | | NODO_ENV | El entorno para ejecutar Cube Cobra. | Sí | | PATREON_CLIENT_ID | El ID de cliente de la aplicación Patreon OAuth. | | | PATREON_CLIENT_SECRET | El secreto del cliente para la aplicación Patreon OAuth. | | | PATREON_HOOK_SECRET | El secreto del webhook de Patreon. | | | PATREON_REDIRECT | La URL de redireccionamiento para la aplicación Patreon OAuth. | | | PUERTO | El puerto para ejecutar Cube Cobra. | Sí | | REDIS_HOST | La URL del servidor Redis. | Sí | | REDIS_SETUP | Configurar o no el servidor Redis: esto es necesario para Redis pero no para elasticache. | | | SECRETO | Una frase secreta para el cifrado. Puedes dejar el valor predeterminado. | Sí | | SESIÓN_SECRET | Una frase secreta para el cifrado de sesiones. Puedes dejar el valor predeterminado. | Sí | | SESIÓN | El nombre de la cookie de sesión. Puedes dejar el valor predeterminado. | Sí | | TCG_PLAYER_PRIVATE_KEY | La clave privada para la API TCGPlayer. | | | TCG_PLAYER_PUBLIC_KEY | La clave pública para la API TCGPlayer. | | | CACHE_ENABLED | Si habilitar o no el almacenamiento en caché. | | | AUTOSCALING_GROUP | El nombre del grupo de escalado automático en el que se ejecuta esta instancia, utilizado para la caché distribuida. | | | CACHE_SECRET | El secreto del caché distribuido. | |
En los scripts de configuración inicial, yarn update-cards son las que crean las definiciones de las tarjetas. La ejecución de este script extraerá los datos más recientes de scryfall.
Si desea análisis de tarjetas, puede ejecutar el siguiente script:
yarn update-allEsto, en secuencia:
Express 4 proporciona un marco web minimalista para admitir tanto la representación de plantillas con PugJS 3 como la definición de puntos finales API basados en JSON. Las plantillas HTML se utilizan principalmente para representar una página mínima para que React se inicie con accesorios iniciales inyectados desde el servidor.
Mantenemos todas las definiciones de tarjetas en archivos grandes preprocesados, de modo que los nodos en producción solo necesitan descargar y cargar los archivos, y pueden recuperar los archivos más recientes de S3 cuando estén listos. Hacemos esto porque es mucho más rápido leer desde la memoria que tener que realizar solicitudes a algún otro servicio cada vez que necesitamos datos de la tarjeta.
Un proceso externo es responsable de actualizar las definiciones de tarjetas y cargarlas en S3. Este mismo proceso también es responsable de actualizar los análisis de tarjetas y las exportaciones de datos.
Usamos redis para el control de concurrencia para la redacción multijugador. Todas las operaciones de Redis se manejan en multiplayerDrafting.js
Cada instancia del servidor express ejecuta un trabajo utilizando node-schedule todas las noches para actualizar el carddb en memoria de s3.
Los scripts Bash ( jobs/definition ) se ejecutan periódicamente en AWS para ejecutar trabajos por horas, días y semanas.
Se definen filtros de tarjeta que pueden ser utilizados por el frontend y el backend. Nearley es un conjunto de herramientas de análisis de Nodejs que se utiliza para generar código que define filtros que se pueden aplicar a la base de datos de tarjetas.
TypeScript 5.5 se está implementando gradualmente para reemplazar el uso de componentes Vanilla JS con PropTypes.
Los componentes los proporciona Reactstrap 9, que funciona con [Bootstrap v5.1][boostrap], que utiliza SCSS.
Los componentes suelen utilizar directamente clases de arranque para aplicar estilos adicionales, pero también pueden utilizar nombres de clases globales definidos en archivos CSS públicos.
