Aller au contenu principal

🎬 Mise en situation

Vous venez de décrocher un emploi de développeur web dans l'entreprise de vos rêves (c'est à vous de choisir 😊)!

L'entreprise désire développer un site Web transactionnel (commerce électronique) et elle vous mandate pour réaliser un prototype. C'est donc à vous de choisir un projet de commerce électronique qui vous intéresse. Vous aurez à bâtir le site et la plateforme d'administration dans le cadre du cours.

important

Vous devez choisir une thématique qui vous intéresse afin de bâtir un site de commerce électronique. Par exemple, vous pourriez décider de faire le site de Nike ou de faire un site dédié à la vente de chaussures. Il peut s'agir d'une vraie entreprise ou encore d'une entreprise fictive. Ce qui est important, c'est que le tout se prête à la vente de produits et que la thématique vous intéresse!

Pour plusieurs raisons, dont l'importance du référencement dans les moteurs de recherche tel Google, un cadriciel permettant le rendu serveur de pages HTML doit être utilisé.

L'entreprise utilise déjà les outils de développement de Microsoft et aimerait continuer dans cette lignée pour son site transactionnel. Ainsi, on vous demande d'utiliser .NET Core MVC comme cadriciel pour le développement du site.

Il faut procéder rapidement au développement d'un premier prototype. Ainsi, aucune interface d'administration ne sera présente au départ. Il sera toutefois important d'avoir des données de test dans la base de données afin de pouvoir afficher de l'information initialement. De ce fait, vous devrez utiliser les migrations et les seeders pour créer la base de données et insérer des données initialement.

La première version du site devra contenir les fonctionnalités suivantes:

  • Inscription et authentification d'utilisateurs (clients)
    • Seul les utilisateurs ayant un compte peuvent acheter sur le site
    • Les utilisateurs n'ayant pas de compte peuvent voir les produits, mais ne peuvent les ajouter à leur panier ou procéder à l'achat
  • Afficher les produits disponibles pour achat sur la page d'accueil ou encore dans une page "produits".
  • Un produit est associé à une catégorie
  • Possibilité de filtrer les produits sur la page d'accueil par catégorie, en plus d'un filtre supplémentaire au choix (voir plus bas pour les filtres supplémentaires)
  • Afficher le détail des produits dans une page de détails affichant les toutes informations pertinentes sur le produit
  • Permettre aux utilisateurs connectés d'ajouter, modifier et supprimer une évaluation (qui leur appartient) pour un produit. Une évaluation comprends:
    • Un texte
    • Une note (soit binaire de type pouce en haut et pouce en bas, soit une note de 1 à 5)
    • L'évaluation est bien entendue associée à l'utilisateur par la suite
  • Afficher les évaluations d'un produit sur la page de détails du produit
  • Ajouter un produit au panier (vous n'avez pas à gérer les quantités)
  • Supprimer un produit du panier (vous n'avez pas à gérer les quantités)
  • Acheter un ou des produits via le contenu du panier (sans gestion du paiement).
  • Gestion simple de l'expédition:
    • 9.99$ si le prix de la commande est de moins de 100$
    • Gratuit si le prix de la commande est égal ou supérieur à 100$
    • L'adresse d'expédition est automatiquement celle de l'utilisateur et donc la même que l'adresse de facturation
  • Afficher la confirmation d'une commande avec le détail de la facture

Un choix parmis une des fonctionnalités supplémentaires suivantes

  1. Ajouter et supprimer un produit de sa liste de souhaits. Vous devez en plus ajouter un filtre des produits de sa liste de souhaits sur la page d'accueil
  2. Supporter les produits à venir. Les jeux à venir ne doivent pas avoir d'évaluation possible ainsi que des achats. Vous devez en plus ajouter un filtre des jeux à venir sur la page d'accueil.
  3. Supporter les rabais sur les produits. Le prix régulier doit être affiché, ainsi que le prix en rabais. De plus, le montant doit être ajusté au moment de l'achat pour prendre en considération le rabais. Vous devez en plus ajouter un filtre des produits en promotion sur la page d'accueil.
  4. Supporter une variation de style pour les produits (ex.: grandeur, couleur, etc.). Vous devez en plus ajouter un filtre permettant de filtrer par cette variation de style.

De plus, quelques critères sont à respecter:

  • Votre projet doit être structuré selon une architecture en couche (N-Tier)
  • Vous devez faire usage de migrations et seeders pour les données de la base de données
  • Vous devez utiliser les fichiers ressources pour la gestion des messages d'erreur et des libellés
  • Afin de ne pas alourdir le chargement de la page d'un produit, le chargement asynchrone des évaluations doit être mis en place. Idem pour la création d'évaluations.

Dans un deuxième temps (semaine 9-15), il vous faudra bâtir la plateforme de gestion du site Web (admin). L'entreprise a eu vent d'une nouvelle technologie Microsoft appelée Blazor et cherchait depuis un certain moment une occasion de l'utiliser et tester la technologie.

Ainsi, il vous est demandé de développer la plateforme de gestion du site à l'aide de Blazor, en mode client (Web Assembly) et utilisant une API.

Évidemment, il vous faudra être en mesure de réutiliser un maximum de code pour cette deuxième partie, d'où l'utilisation d'une architecture en couches.

Les fonctionnalités suivantes sont demandées pour l'application d'administration:

  • Authentification via un formulaire de connexion et jeton JWT
  • Authorization de l'accès à la plateforme via un rôle 'Admin' et la gestion des droits
  • Gestion complète (CRUD) des produits
  • Gestion complète (CRUD) d'une autre ressource (catégorie, tag, etc.) de votre choix (minimum 4 champs à gérer)
  • Ajout d'une option de type filtre ou recherche de votre choix

Finalement, si le temps le permet, vous devrez ajouter Stripe Checkout pour les paiements au site transactionnel (projet MVC).

L'entreprise fonctionne en itération de développement de 3 semaines chacune et vous devrez suivre de rythme de développement. La conception de la base de données (DEA) sera à remettre à la semaine 3 et le prototype du Site Web transactionnel sera à remettre à la semaine 9, soit après trois itérations. La plateforme de gestion quant à elle, à la semaine 15.

Bien qu'aucune remise de code ne soit à effectuer aux semaines 6 et 12, une revue d'itération sera à compléter pour présenter votre avancement ainsi que vous autoévaluer.

Maquettes d'exemple

Par chance, vous avez un ami designer qui a récemment travaillé sur un site de commerce électronique pour la compagnie de vente et distribution de jeux vidéo Steamy 👀. Le projet est un peu différent, mais ces maquettes devraient vous être très utiles pour déterminer la structure de la base de données (DEA) et comprendre la structure de base d'un projet de commerce électronique.

🔗 Voir les maquettes

Page d'accueil

Page d'accueil avec critères de filtre supplémentaires

Page de détails

Page de détails (à venir)

Page de détails (ajout à la liste de souhaits)

Page d'évaluation

Page d'achat

Page de confirmation que l'achat a été effectué

Inscription