Sistema de gestión de aprendizaje (LMS)
(Next.js y Express.js)
Introducción
Bienvenido a la aplicación LMS: un sistema de gestión de aprendizaje de vanguardia diseñado para proporcionar una experiencia de aprendizaje en línea interactiva e integral. Construida con Next.js y Express.js, esta plataforma está equipada con características avanzadas para la gestión del curso, la participación de los estudiantes y las experiencias seguras de los usuarios sin problemas.
Alguna vista previa de la interfaz de usuario
Página de registro/inicio de sesión
Autenticación del empleado para usuario seguro
Página de cursos
Maestro/administrador para ver listas de cursos
Cursos/: Página de curso
Maestro/administrador para crear, editar, eliminar y ver el curso de detalle completo
Página de capítulos
Maestro/administrador para (crear, editar, eliminar y ver el detalle completo) Capítulo para un curso
Página de análisis
Maestro/administrador para analizar cuánto curso se venden y cuántos ingresos obtuvieron
Página de capítulos
Los clientes pueden inscribirse para un curso, ver capítulos gratuitos
Stripe para el proceso de pago
Los clientes revisan el procedimiento de pagos
Página de capítulos
Los clientes pueden ver los accesorios del curso, su progreso después de comprar el curso
Página de tablero
Los clientes pueden ver sus cursos de progreso, cursos completados
Menú de la barra lateral/alertas
interfaces receptivas y fáciles de usar
Características clave
Creación y gestión de cursos dinámicos: crear y administrar fácilmente contenido del curso, incluidas imágenes y archivos adjuntos. Autenticación robusta: autenticación segura del usuario usando el empleado. Reproducción y carga de video interactiva: integrado con MUX para una experiencia de video suave. Pagos seguros: integración de rayas para manejar los pagos y suscripciones del curso. Interfaz fácil de usar: diseño moderno y receptivo con CSS de viento de cola. Cargas de documentos e imágenes: utilizando la carga para la administración de archivos sin problemas.
Tecnologías utilizadas
Interfaz
Tecnologías utilizadas:
- Reaccionar 18.2.0
- Next.js 13.4.12
- Vie de cola CSS 3.3.5
- React Hook Form 7.48.2
- React-Quill 2.0.0
- Rechartes 2.10.3
- Lucide-react 0.294.0
Bibliotecas clave:
- @Clerk/NextJS 4.27.2 : para autenticación segura del usuario.
- @mux/mux-nodo y @mux/mux-player-react 7.3.3 y 2.3.0 : para reproducción de video y cargas.
- @cargar/reaccionar 6.0.2 : para manejar el documento y las cargas de imágenes.
- React-Hot-Tosto 2.4.1 : para notificaciones elegantes.
- Zustand 4.4.7 : Gestión estatal.
Mejoras de UI/UX:
- Tailwind Merge 2.0.0 : para optimizar las clases CSS de viento de cola.
- CMDK 0.2.0 : interfaz de menú de comando.
- React-Dropzone 14.2.3 : arrastre y suelte cargas de archivo.
- @Tanstack/React-Table 8.10.7 : para construir y administrar tablas.
- @Radix-UI/React-Dialog , @Radix-UI/React-Dropdown-Menu , etc., para componentes avanzados de UI.
Características:
- Interfaz interactiva y fácil de usar.
- Integración perfecta con servicios de transmisión de video y carga de archivos.
- Herramientas integrales de creación y gestión de cursos.
- Diseño receptivo que garantiza la compatibilidad en varios dispositivos.
Herramientas de desarrollo:
- Eslint 8.54.0 : para la pelusa de código.
- PostCSS 8.4.31 y AutoPrefixer 10.4.16 : para procesamiento de CSS.
- TypeScript 5.3.2 : para verificación de tipo.
Backend
Tecnologías principales:
- Express.js 4.18.2 : la columna vertebral del servidor, el enrutamiento de manejo y el middleware.
- Mongoose 8.0.2 : ODM para MongoDB, simplificando las interacciones de la base de datos.
- Node.js: el entorno de tiempo de ejecución para ejecutar JavaScript en el lado del servidor.
Base de datos:
- MongoDB: base de datos NoSQL utilizada para almacenar datos de aplicaciones.
Bibliotecas clave y middleware:
- Dotenv 16.3.1 : Para la gestión de las variables de entorno.
- Nodemon 3.0.2 (desarrollo): para reiniciar automáticamente el servidor durante el desarrollo.
Características:
- Puntos finales de API REST robustos para la recuperación de datos y la manipulación.
- Conexión la conexión a la base de datos con un manejo eficiente de consultas.
- Arquitectura escalable adecuada para características de expansión y base de usuarios.
Seguridad y autenticación:
- Medidas de seguridad integradas para puntos finales de API.
- Lógica de autenticación y autorización para proteger los datos del usuario.
Herramientas de desarrollo:
- Varios paquetes de NPM para mejorar la funcionalidad y la eficiencia.
- Postman para probar y validar puntos finales de API.
Integraciones:
- Stripe para el procesamiento de pagos: integrado con Stripe's Webhooks para manejar transacciones.
- Otros servicios de terceros según lo requerido por la aplicación.
