Aller au contenu principal

Site frontend + backend pour Akta Prod

Un site vitrine doublé d'un outil de gestion de projet, développé à six : maquettes Figma, front en HTML/CSS/JS et Bootstrap, back en PHP/Laravel sur base MySQL, avec comptes utilisateurs, projets, tâches et commentaires.

Université Site web BUT 1 Semestre 2 AC14.01 — à valider AC14.02 — à valider AC14.05 — à valider
Visuel à venir — le motif ci-dessus tient la place en attendant les captures du projet.

Contexte

Durant mon second semestre en BUT MMI à l'IUT de Toulon, j'ai participé à la réalisation d'un site web pour notre agence fictive « Akta Prod ». L'objectif principal était de développer un site vitrine combiné avec une partie de gestion de projet. Aux côtés de mes cinq camarades, nous avons mis en place ce site pour promouvoir l'agence, présenter l'équipe et offrir des fonctionnalités de gestion de projet aux utilisateurs.

Objectif
Créer un site vitrine pour promouvoir Akta Prod et une partie de gestion de projet pour les utilisateurs.
Durée
Un semestre complet (S2)
Équipe
6 étudiants

Démarche

Développement frontend

  • Design et maquettes — nous avons commencé par concevoir des maquettes sur Figma pour le site vitrine et la partie de gestion de projet, en nous assurant que l'interface soit intuitive et attrayante.
  • Technologies utilisées — HTML, CSS, JavaScript pour construire l'interface utilisateur. Nous avons utilisé des frameworks comme Bootstrap pour accélérer le développement et garantir une mise en page responsive.
  • Pages principales — création des pages d'accueil, présentation de l'équipe, services offerts, et contact.

Développement backend

  • Base de données — mise en place d'une base de données avec MySQL pour stocker les informations des utilisateurs, les projets, sous-projets, tâches et commentaires.
  • Technologies utilisées — PHP pour le développement du backend. Nous avons également utilisé des frameworks comme Laravel pour structurer notre code et faciliter le développement.
  • Création de compte — les utilisateurs pouvaient s'inscrire et se connecter à leur compte.
  • Gestion de projet — les utilisateurs pouvaient créer des projets, ajouter des sous-projets, des tâches et des commentaires.
  • Interaction et collaboration — les utilisateurs pouvaient collaborer en ajoutant des commentaires et en assignant des tâches à d'autres membres.

Résultats

  • Développement web frontend — création de sites web attrayants et responsives en utilisant HTML, CSS, et JavaScript.
  • Développement web backend — gestion des bases de données, développement de fonctionnalités serveur en PHP et utilisation de frameworks comme Laravel.
  • Gestion de projet — organisation et planification du développement web en équipe, utilisation de méthodologies agiles pour structurer notre travail.

Compétences mobilisées

3 apprentissage(s) critique(s) rattaché(s) à cette réalisation. 3 en attente de validation.

AC14.01

Exploiter de manière autonome un environnement de développement efficace et productif

Développer À valider

Le projet portait sur un site avec sa partie visible et son administration, développé en équipe. Ma contribution s’est concentrée sur l’intégration front — structure HTML, mise en forme CSS, comportements JavaScript — à partir des maquettes validées, avec la contrainte de rester fidèle à une intention graphique conçue par quelqu’un d’autre.

AC14.02

Produire des pages Web fluides incluant un balisage sémantique efficace et des interactions simples

Développer À valider

L’intégration supposait de traduire une maquette en pages réellement navigables : hiérarchie des titres, structure des gabarits, adaptation aux différentes largeurs d’écran. Une maquette est un état figé ; une page vit avec des contenus de longueurs variables, et c’est ce décalage qui constitue l’essentiel du travail d’intégration.

AC14.05

Modéliser les données d'une application Web

Développer À valider

Le travail à six sur une même base de code m’a confronté aux problèmes que je ne rencontrais pas seul : répartition des fichiers, conventions de nommage, conflits au moment de rassembler les contributions. C’est le projet qui m’a fait comprendre pourquoi une équipe se donne des règles avant d’écrire du code plutôt qu’après.

Ma démarche réflexive

Auto-évaluation

Je suis très satisfait du travail accompli et du résultat final. Le site web que nous avons créé pour Akta Prod est fonctionnel, attrayant et répond aux besoins de promotion et de gestion de projet. J'ai particulièrement apprécié la collaboration avec mes camarades et la possibilité de travailler sur des aspects techniques variés, du frontend au backend.

Auto-critique constructive

Bien que le projet ait été réussi, nous aurions pu optimiser davantage notre code pour améliorer les performances du site. De plus, une intégration plus poussée des tests unitaires aurait pu nous aider à identifier et corriger les bugs plus efficacement.

Continuité et développement personnel

Suite à ce projet, j'ai continué à explorer le développement web full-stack en travaillant sur des projets personnels et professionnels. J'ai approfondi mes connaissances en frameworks modernes comme React pour le frontend et Node.js pour le backend, afin de devenir un développeur web complet. Ce projet a été une expérience extrêmement enrichissante qui a renforcé ma capacité à travailler efficacement en équipe et à gérer des projets complexes du début à la fin.