Comparto con ustedes ReactMu, un proyecto que moderniza la infraestructura web para cualquier servidor de MU Online utilizando tecnologías modernas y de alto rendimiento.

Este proyecto ofrece una base robusta y limpia, separando claramente la presentación (Frontend) de la lógica y la base de datos (Backend), siguiendo las mejores prácticas de desarrollo.

Tecnologías Utilizadas:
Frontend (Cliente) React (v19.1.1) con Vite
Backend (Servidor) Node.js/ExpressAPI

Características Destacadas

• Estado del Servidor en Tiempo Real: Muestra el estado Online/Offline del GameServer y el conteo de jugadores, con un chequeo de conexión TCP dedicado.
• Diseño Modular y Temático: Interfaz con un diseño clásico, componentes reutilizables (como las tablas de Ranking) y CSS basado en variables.
  
• Módulo de Registro Funcional: Permite a los usuarios crear cuentas, con validaciones de longitud (máx. 10 caracteres para Login/Password) y manejo de errores.
  
• Conexiones Optimizadas: El backend utiliza un Pool de Conexiones para MSSQL (poolPromise), asegurando que las peticiones a la base de datos (como el registro y el estado) sean eficientes y no saturen el servidor.

Próximos Pasos (Pendientes)
El proyecto está listo para ser desarrollado a fondo.
Los puntos clave a trabajar (por el momento) son:

• Seguridad: Implementar una función hash robusta (como bcrypt) para cifrar las contraseñas antes de almacenarlas en la base de datos. Actualmente se guardan en texto plano (como es común en muchos sistemas MU), pero se recomienda encarecidamente la encriptación para proteger a los usuarios.
  
• Integración de Datos Dinámicos: Conectar las tablas de Ranking (Resets, Guilds) y las Noticias a la base de datos para que dejen de usar datos estáticos.
  

Imagenes del proyecto:

Por el momento siento que esta muy verde para hacer un posteo como una página funcional... de cualquier modo cualquier interesado puede mandarme un mensaje privado al foro para tener más información, pedirme el discord o lo que sea.
De igual modo cada avance en el proyecto va a ser publicado en este tema hasta que llegue el momento de publicarlo como un CMS funcional.
Una vez terminado el sistema de ranking ya se va a liberar para su uso.

Interesante proyecto, me parece una excelente iniciativa. Pero es con server side rendering? Para el tema del SEO? Ya que tengo entendido que React maneja el renderizado del lado del cliente y hasta donde sé eso no es muy bueno para el posicionamiento en motores de búsqueda.

Buena iniciativa, me gusta mucho la idea de independizar el frontend del backend para poder variar la lógica implementada en el frontend y que, en caso de que alguien quiera, pueda hacer sus propios frontend a gusto.
Por otro lado, teniendo el backend separado y pudiendo acceder a la base de datos, se pueden dejar endpoints disponibles para que puedan consultar aplicaciones como launchers u otras aplicaciones.

Interesante proyecto, me parece una excelente iniciativa. Pero es con server side rendering? Para el tema del SEO? Ya que tengo entendido que React maneja el renderizado del lado del cliente y hasta donde sé eso no es muy bueno para el posicionamiento en motores de búsqueda.

Gracias por el comentario! Teness razon, el renderizado del lado del cliente (CSR) no es ideal para el SEO de contenido dinámico como rankings y noticias.
El proyecto utiliza Server-Side Rendering (SSR).
Esto significa que el servidor de Express ejecuta el código de React en el servidor para pre-renderizar las páginas con el contenido completo (rankings, estado, etc.) antes de enviarlas al navegador. El navegador recibe un archivo HTML listo para ser indexado por los motores de búsqueda, lo que garantiza el mejor posicionamiento (SEO) y una carga inicial mucho más rápida para el usuario.

Buena iniciativa, me gusta mucho la idea de independizar el frontend del backend para poder variar la lógica implementada en el frontend y que, en caso de que alguien quiera, pueda hacer sus propios frontend a gusto.
Por otro lado, teniendo el backend separado y pudiendo acceder a la base de datos, se pueden dejar endpoints disponibles para que puedan consultar aplicaciones como launchers u otras aplicaciones.

Muchas gracias amigo, esta recorriendo ese camino!

unos comentarios:

1.- Recuerda que la mayoria de los servidores se despliegan en CPanel y les es mas dificil encontrar un hosting donde puedan desplegar React y Nodejs.
2.- Al ser React la desventaja del CEO ya que para eso debes usar SSR y no puedes usarlo en un CPanel.
3.- Los clientes no van a querer gastar en un servidor exclusivo para su web en vez de pagar un CPanel.
4.- Como desarrollo me parece chevere ya que yo cree uno con Angular y NestJS pero no sirven para un cpanel si no para un servidor VPS o EC2 como servidor para la web y tener manejo de todo.
5.- Recomiendo que manejes un limit de peticiones y que si sobrepasa los bloquees por un tiempo.
6.- Limita los CORS.
7.- Siempre valida los inputs a tu Backend y limpialos de cualquier codigo malicioso
8.- Es bueno independizar el Back del Front pero recuerda que debe haber comunicacion y validacion del token de intermedio.
9.- Recomiendo que uses buenas practicas y no hagas lo mismo que vemos en las web clasicas donde todo es codigo espagueti.

Con respecto al diseño no te puedo decir nada ya que es lo que tu creaste y solo a ti te debe importar.

unos comentarios:

1.- Recuerda que la mayoria de los servidores se despliegan en CPanel y les es mas dificil encontrar un hosting donde puedan desplegar React y Nodejs.
2.- Al ser React la desventaja del CEO ya que para eso debes usar SSR y no puedes usarlo en un CPanel.
3.- Los clientes no van a querer gastar en un servidor exclusivo para su web en vez de pagar un CPanel.
4.- Como desarrollo me parece chevere ya que yo cree uno con Angular y NestJS pero no sirven para un cpanel si no para un servidor VPS o EC2 como servidor para la web y tener manejo de todo.
5.- Recomiendo que manejes un limit de peticiones y que si sobrepasa los bloquees por un tiempo.
6.- Limita los CORS.
7.- Siempre valida los inputs a tu Backend y limpialos de cualquier codigo malicioso
8.- Es bueno independizar el Back del Front pero recuerda que debe haber comunicacion y validacion del token de intermedio.
9.- Recomiendo que uses buenas practicas y no hagas lo mismo que vemos en las web clasicas donde todo es codigo espagueti.

Con respecto al diseño no te puedo decir nada ya que es lo que tu creaste y solo a ti te debe importar.

Te resumo cómo viene la cosa:

Arquitectura y Plataforma (Puntos 1, 2, 3, 4)
Entiendo el punto de que la mayoría usa CPanel y que es más barato que un VPS, pero el proyecto está hecho con React y Node.js por una razón: rendimiento y SEO.

Costo vs. Rendimiento: tenés razón, esto necesita un VPS o una instancia tipo EC2 (igual que con Angular/NestJS). No es compatible con CPanel. El cambio se debe a que el rendimiento mejora muchísimo y es la única forma de que la web funcione bien y soporte muchas visitas.

SEO: el tema del SEO (punto 2) ya está resuelto. El proyecto usa Server-Side Rendering (SSR), así que Google ve el contenido completo de entrada, sin tener que esperar a que cargue el JavaScript.

Seguridad (Puntos 5, 6, 7, 8)
Todos los puntos de seguridad son importantes y ya están implementados para proteger tanto la web como la base de datos:

• Rate Limiting (Punto 5): ya configuré un límite de peticiones para evitar ataques de fuerza bruta en Login y Registro.
• CORS (Punto 6): la API solo acepta peticiones desde el dominio del juego (se define en el .env del backend), así que nadie puede usarla desde afuera.
• Validación de inputs (Punto 7): los datos que manda la gente se limpian automáticamente con consultas parametrizadas antes de llegar a la DB, lo que evita SQL Injection o código malicioso.
• Comunicación segura (Punto 8): el front y el back son independientes, pero se comunican con tokens JWT. Cada request valida el token y la sesión con un middleware antes de responder.

(Punto 9)
La arquitectura está modularizada y separada por capas (Controladores, Repositorios, Componentes de React), lo que hace que sea más fácil mantener y escalar sin que una parte rompa otra.

No funciona en cpanel = destinado a ser simplemente un proyecto.

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

Claro, todo es un proyecto, pero hay "proyectos" y "proyectos xD" que mueren eternamente en beta por la poca posibilidad de ser usados.

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

Claro, todo es un proyecto, pero hay "proyectos" y "proyectos xD" que mueren eternamente en beta por la poca posibilidad de ser usados.

Perdón es que no entiendo a donde queres llegar con los 'proyectos' y 'proyectos xD'.
Estoy armando una web funcional que utiliza una arquitectura moderna basada en Node.js y React con Server-Side Rendering (SSR).

El que quiera usar la web que la use y el que no la quiera usar que no la use, el fin de mi proyecto es aprender a emplear estas tecnologías y de momento estoy aprendiendo un montón de cosas asi que por lo menos para mi esta funcionando.

 

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

Claro, todo es un proyecto, pero hay "proyectos" y "proyectos xD" que mueren eternamente en beta por la poca posibilidad de ser usados.

Perdón es que no entiendo a donde queres llegar con los 'proyectos' y 'proyectos xD'.
Estoy armando una web funcional que utiliza una arquitectura moderna basada en Node.js y React con Server-Side Rendering (SSR).

El que quiera usar la web que la use y el que no la quiera usar que no la use, el fin de mi proyecto es aprender a emplear estas tecnologías y de momento estoy aprendiendo un montón de cosas asi que por lo menos para mi esta funcionando.

 

hay que ver que los comentarios de arriba con bien ignorantes de verdad, todo se basan en el Cpanel, los que utiliza cpanel monta el servidor en menos de un mes mueren a veces en semana.

no puedo dar mas opinión pero es grandioso el proyecto que esta haciendo verdad me encanta que hayas separado el bankend del frontend muy poco conoces lo que realmente que es el framework react y veo que lo que dan opiniones no conocen bien del tema. saludos y prosigue con el proyecto,

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

Claro, todo es un proyecto, pero hay "proyectos" y "proyectos xD" que mueren eternamente en beta por la poca posibilidad de ser usados.

Perdón es que no entiendo a donde queres llegar con los 'proyectos' y 'proyectos xD'.
Estoy armando una web funcional que utiliza una arquitectura moderna basada en Node.js y React con Server-Side Rendering (SSR).

El que quiera usar la web que la use y el que no la quiera usar que no la use, el fin de mi proyecto es aprender a emplear estas tecnologías y de momento estoy aprendiendo un montón de cosas asi que por lo menos para mi esta funcionando.

 

Lo que @Mathi esta diciendo es que esta perfecto que hagas lo que quieras con tu web, pero si no soporta cPanel vas a tener pocos testers y feedback. Aca todos van por la facil nadie quiere enroscarse. Si fuera por los admins se seguiria usando SQL 2000

 

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

Claro, todo es un proyecto, pero hay "proyectos" y "proyectos xD" que mueren eternamente en beta por la poca posibilidad de ser usados.

Perdón es que no entiendo a donde queres llegar con los 'proyectos' y 'proyectos xD'.
Estoy armando una web funcional que utiliza una arquitectura moderna basada en Node.js y React con Server-Side Rendering (SSR).

El que quiera usar la web que la use y el que no la quiera usar que no la use, el fin de mi proyecto es aprender a emplear estas tecnologías y de momento estoy aprendiendo un montón de cosas asi que por lo menos para mi esta funcionando.

 

Lo que @Mathi esta diciendo es que esta perfecto que hagas lo que quieras con tu web, pero si no soporta cPanel vas a tener pocos testers y feedback. Aca todos van por la facil nadie quiere enroscarse. Si fuera por los admins se seguiria usando SQL 2000

 

Es un comentario que no suma nada

No funciona en cpanel = destinado a ser simplemente un proyecto.

Todo es un proyecto, web engine es un proyecto, dmn es un proyecto, los files de louis es un proyecto, los de kayito son un proyecto... no entiendo el comentario.

Hay quienes prefieren usar webengine, hay quienes prefieren usar dmn, mucore y va a haber quienes prefieran usar esta web... 

Claro, todo es un proyecto, pero hay "proyectos" y "proyectos xD" que mueren eternamente en beta por la poca posibilidad de ser usados.

Perdón es que no entiendo a donde queres llegar con los 'proyectos' y 'proyectos xD'.
Estoy armando una web funcional que utiliza una arquitectura moderna basada en Node.js y React con Server-Side Rendering (SSR).

El que quiera usar la web que la use y el que no la quiera usar que no la use, el fin de mi proyecto es aprender a emplear estas tecnologías y de momento estoy aprendiendo un montón de cosas asi que por lo menos para mi esta funcionando.

 

Lo que @Mathi esta diciendo es que esta perfecto que hagas lo que quieras con tu web, pero si no soporta cPanel vas a tener pocos testers y feedback. Aca todos van por la facil nadie quiere enroscarse. Si fuera por los admins se seguiria usando SQL 2000

 

Es un comentario que no suma nada

Gordo no te tire la mala. Banco tu trabajo pero tampoco te ofendas. Lo que te dijeron mas arriba del cPanel es algo a tener en cuenta