Application à page unique entièrement réactive faite à l'aide de la pile Mern! ?
Tech utilisé
Réagir
Nœud
Mongo DB
Exprimer
Redux
Redis
Plaisanter
Base de données utilisée
Mongo
Redis
Commencer
Clone le dépôt de votre environnement local, vous devez installer séparément toutes les dépendances pour le backend et le frontend.
Pour le backend, accédez au dossier backend (backend CD) et exécutez npm i
Installer MongoDB
Ou, vous pouvez utiliser le site Web
Ajoutez vos variables environnementales
Créez un fichier .env dans le répertoire racine du dossier backend et ajoutez vos jetons par rapport aux variables de fichiers de configuration.
Access_token_secret = "Secret"
Access_token_life = Time
Refresh_token_secret = "Secret"
Refresh_token_life = time
Sendgrid_key = ""
Mongo_database = ""
OAuth2Client = ""
Stripe_secret_token = ""
Redis_host = ""
Redis_password = ""
Redis_port = ""
Remarque: Assurez-vous que les variables de fichiers .env correspondent à celle des fichiers de configuration comme l'image ci-dessous.
Pour Frontend, accédez au dossier Frontend (CD front-end) et exécutez npm i
Pour exécuter un environnement de développement, vous pouvez utiliser la commande npm start . Cela démarrera un serveur Web de développement sur le port 3000 pour Frontend, et un serveur API regardé par Nodemon sur le port 8080.
Remarque: vous devez faire le démarrage du NPM pour le backend et le frontend séparément.
Tests unitaires
Vous pouvez tester le backend, express Points à l'aide de la commande (NPM Test)
Docker
Coursera Clone est dockerisé et le référentiel Docker Hub peut être trouvé ici https://hub.docker.com/repository/docker/ayushverma/coursera/general
Si vous utilisez Docker et Docker Compose, vous pouvez démarrer l'intégralité du projet avec:
docker-compose up
? Caractéristiques
Étudiant
Système d'authentification avec inscription, connexion, vérification OTP, renvoyer OTP, mot de passe oublié (entièrement validé avec les alertes bootstrap)
Google Authentication (OAuth2) Utilisation de React-Google-Login et Google Auth-Library
Gate de paiement à rayures intégré au backend pour acheter des cours
Store Redux pour gérer facilement les États
Page d'accueil avec des cours récupérés catégoriquement
Cours recommandés en fonction des préférences de l'utilisateur
Note des cours
Des cours en signet où les utilisateurs peuvent supprimer ou ajouter le signet
Télécharger les ressources (PDF - Notes)
Reactive React Video lecteur pour les vidéos
Barre de progression
Page de cours avec tout le contenu du cours
Recherche en fonction du cours et de l'enseignant
Cours de groupe en direct en temps réel
Professeur
Système d'authentification approprié avec inscription, connexion, vérification OTP, renvoyer OTP, mot de passe oublié (entièrement validé avec les alertes bootstrap)
Formulaire de téléchargement des enseignants entièrement validé avec description, titre, image et autres détails
Ckeditor for Write in TextBox avec des capacités pour ajouter des en-têtes différentes, paragraphes, audacieux, italique, lien, tables, tailles, etc.
L'enseignant peut télécharger jusqu'à 5 vidéos avec une barre de téléchargement pour montrer les progrès
L'enseignant peut voir leurs cours téléchargés
L'enseignant peut supprimer leur cours
L'enseignant peut modifier leur cours
Tests à l'aide de la plaisanterie et du supertest pour les points de terminaison express.
Classes de groupe en direct en temps réel utilisant socket.io et optimisé avec redis pour la mise en cache de messages
