Formation développement web full-stack

Ajourd’hui je vais vous parler d’un projet réaliser lors de ma formation de développement web full-stack, un projet réalisé de A à Z en solo.

Durant l’année 2022 j’ai réalisé une formation à l’AFPA de Rochefort, cette formation de 8 mois m’a permi d’apprendre et de m’exercer dans le domaine du dévellopement web en plus du webdesign que je maitrise déjà pas trop mal.

Durant cette formation j’ai pu passer en revu pas mal d’outils de développement, en passant par les classiques : HTML5, CSS3 , Javascript, Php, MySQL et j’ai découvert des outils que j’avais moins l’habitude d’utiliser comme :  Trello, Bootstrap, JQuery, WordPress, WooCommerce, node js, GitLab, React, etc…

Les premiers mois de formation ne me permettent pas de proposer de visuels intéressants, ce sont surtout des mois d’apprentissage des bases. Mais le projet de stage en fin de formation est suffisament intéressant pour vous le présenter ici.

En effet, les trois derniers mois de formation étaient dédiés à un stage en entreprise durant lequel nous devions fournir un projet suffisament complet pour obtenir.

Sans stage de mon côté (comme les 2 tiers des élèves) je décidait de produire un site de e-commerce en fonction du thème qu’il m’était donner par le formateur.

Donc le thème : Réalisation d’un site de e-commerce pour un distributeur de bouteille de vin du nom de We All Are Winos.
Il me faut partir de zéro, de la création du logo jusqu’à la conception du site avec WordPress et son extension : WooCommerce.

Pour la partie du logotype, le resultat final est arrivé très rapidement. Sachant que j’vais trois mois pour faire un site de A à Z en partant de rien ne n’avait pas le temps sur ces détails là. C’est pour celà que trois jours plus tard, j’ai fournis au formateur une liste de 3 logotypes dont il a validé celui qu’il préférait.

Une fois ce point de départ validé, j’ai commencer à mettre en place un Trello pour l’organisation générale du site. Ce planning pouvait permettre au formateur de venir voir l’avancée du travail et proposer son aide en cas de besoin. (spoiler alerte ça n’a jamais été le cas….)

La première grande étape de la création du site Winos était la réalisation et la valisation du wireframe complet du site. Un wireframe étant une simulation du site sans aucuns éléments apparent, ni couleurs, juste des tracés servant de repères entre le webdesigner et le dévellopeur web.

Ici je vous montre une partie des Wireframe du site. Celle-ci représente les divers menus déroulant du site, mais plus de 25 pages de wireframes ont été créer en moins de deux semaines, puis validés par le formateur.

La suite du processus de création qui va durer tout le reste de la période de stage c’est la mise en place du développement du site, je vais donc coder, coder, coder, coder… pendant plus de 2 mois non stop.
Pour finalement arrivé à un résultat assez satisfaisant pour un premier site e-commerce,  bien qu’inachevé.

Pour ce projet j’ai tenté une approche des plus classique tout en essayant d’y intégrer quelques élements « originaux » histoire de faire valoir le fait d’avoir travailler sur plusieurs language comme l’intégration d’une animation du logotype à l’ouverture du site en javascript.

Ou encore d’une modale d’avertissement à l’ouverture du site obligeant le visiteur à valider le fait qu’il ai plus de 18 ans.

Bref tout ce travail n’aura pas été vain et il m’aura permit de réaliser une formation toujours en relation avec mes capacités premières que j’espère pouvoir mettre en pratique à l’occasion.

Je vous remercie pour votre lecture et votre soutient !
Je vous dis à très bientôt !