FINAL PROJECT CS50 WEB NEXT CODER

Projet final de programmation Web CS50: codeur suivant

La vidéo du projet est: https://youtu.be/ythhec-bdqa

Idée principale

J'ai créé une application Web collaborative pour apprendre à coder. Tout le monde peut créer une conférence (qui ne sont essentiellement que des cours) et tout le monde peut s'inscrire à ces cours. Les principaux composants sont:

• Page d'accueil
• Connexion / déconnexion / enregistrement
• Page de discussions dans laquelle il y a la répertorié toutes les différentes conférences ou classes et où vous pouvez filtrer les conférences par différents critères
• Une page individuelle pour chaque conversation avec toutes ses informations et un bouton pour s'inscrire
• Une page dans laquelle vous pouvez accéder à toutes les discussions dans lesquelles vous êtes inscrit
• Une page pour créer de nouvelles discussions

Distinction et complexité

La page n'est pas similaire à tout ce que nous avons déjà créé. Ce n'est pas une application de médias sociaux ni un commerce électronique. Ce n'est pas non plus similaire aux autres projets des années.

En termes de complexité, j'ai utilisé Django avec plus d'un modèle (expliqué ci-dessous) et plusieurs fichiers JavaScript au frontend. De plus, toute l'application Web est sensible aux différentes tailles d'écran (principalement les téléphones mobiles et les ordinateurs).

Informations sur les fichiers

• Dans Views.py, il y a tout le code backend. Les fonctions principales sont:

  • Classe Newtalkform avec tous les champs pour créer un nouveau discours
  • Class Searchtalkform pour filtrer les discussions
  • Fonctions de connexion, de déconnexion et d'enregistrement copiées à partir du projet 4
  • New_talk pour avoir enregistré une nouvelle conversation et des informations connexes aiment les balises
  • Tags pour récupérer les balises existantes et en ajouter de nouvelles
  • Tags de filtre: pour retourner une liste de conférences en fonction des filtres que l'utilisateur a sélectionnés
  • Get_by_title: des pourparlers de retour dans lesquels les mots apparaissent dans le titre, la description ou les balises
  • Parlez pour récupérer des informations sur un discours spécifique
  • Inscrivez-vous: pour inscrire une conférence
  • Get_enrolled_talks: pour récupérer les pourparlers dans lesquels vous êtes inscrit

• Models.py. Les différents modèles sont:

  • Un modèle d'utilisateurs
  • Un modèle de balises
  • Un modèle parle avec tous les différents détails sur une conférence (et un sérialiseur)

• Talks.js: pour filtrer les conférences, montrer les discussions et la saisie automatique lorsque vous recherchez un discours

• New_talk.js: pour la deuxième partie de la création d'un nouveau discours qui ajoute des balises. Il charge et affiche des balises, enregistre de nouvelles balises et ajoute les balises sélectionnées au nouveau discours

• Mytalks.js: pour obtenir les pourparlers dans lesquels vous êtes inscrit et les montrer dans le DOM

• Modèles pour toutes les différentes pages HTML expliquées ci-dessus (8 au total, y compris un fichier de mise en page)

• Un fichier CSS avec tous les CSS utilisés dans l'application Web. Des techniques comme Flexbox et Grid sont utilisées

• D'autres fichiers moins importants comme les URL, l'administrateur, les paramètres, les images statiques ...

Comment exécuter l'application

• Installer les dépendances du projet en exécutant Pip Installer -r exigences.txt
• Faire et appliquer des migrations en exécutant python manage.py makemigrations et python manage.py migrate.