Workflow : Les bonnes pratiques du développeur front end

Pour un développeur, il est important de respecter certaines bonnes pratiques, règles et conventions, pour travailler de manière efficace mais surtout collaborative. Dans cet article, je vous conseille certaines des bonnes pratiques que j’applique dans mes projets web.
Cet article s’adresse aux débutants mais, même si vous avez de l’expérience, il vous sera sûrement utile.

Organisez votre projet

Avant de foncer tête baissée dans le code, pensez au fonctionnement du projet et aux étapes de sa création, que ce soit une application web ou une intégration de maquette.

Le développeur peut parfaitement utiliser une feuille de papier et un crayon pour modéliser une base de données WordPress par exemple, ou l’architecture des dossiers, ou encore l’arborescence du site. Cette étape de recherche servira à vous poser les questions suivantes :

• Quelles seront les étapes de création ?
• Quelles technologies vais-je utiliser ?
• Laquelle sera la mieux adaptée à mon projet ?
• Quelle est la structure du projet à adopter ?
• Quels outils seront nécessaires ?
• etc…

Après avoir répondu à ces questions vous pourrez passer à l’étape de configuration du projet. Cette étape sert à préparer le projet avec des outils comme Webpack, Grunt, Gulp etc…
Ces outils seront choisis en fonction du type de projet. Vous devrez aussi créer la structure de l’application adaptée au projet.

Pensez maintenabilité

Vous créez une structure pour que le projet soit facile à maintenir et organisé de façon compréhensible. De la même manière, vous devez organiser votre code.

Développez, commentez

Vous avez probablement rencontré des morceaux de codes pas très compréhensibles, car mal documentés. Cela arrive lorsque l’on comprend le code qu’on écrit, mais sans prendre la peine de le commenter. Parfois aussi, vous aurez du mal à comprendre du code que vous avez vous-même écrit il y a longtemps. Toujours par insuffisance de documentation ou de commentaires.

C’est pourquoi, il faut commenter le code au fur et à mesure que vous l’écrivez. Il existe pour cela des conventions telles que PHPDOC pour le code PHP et JSDOC pour le code Javascript.

Respectez les conventions

Il existe des conventions de nommage de fichiers. Voici les différentes règles à respecter :

• Éviter les caractères spéciaux (, ; . : ! ? ( ) / [ ] + =  » * % & @ … )
• Remplacer les espaces entre deux termes par : un underscore « _ » ; un trait-d’union « – » ; ajout d’une majuscule à chaque nouvelle section de texte ; ou encore aucune séparation.
• Éviter les accents.

Ces règles importantes évitent de mauvaises surprises lors de la mise en ligne du site.

Pour le CSS, vous pouvez utiliser la convention SMACSS et adopter une syntaxe BEM pour le nommage des classes.

Lorsque vous développez, utilisez plutôt l’anglais, même si vous n’êtes pas très bon, pour que votre code soit compréhensible par le maximum de personnes.

Faites une veille régulière

Le métier de développeur est en constante évolution, de nouvelles technologies et méthodes apparaissent sans cesse, les logiciels/plugins/cms sont régulièrement mis à jour et des failles peuvent apparaître. Autant de raisons pour le développeur de faire une veille efficace et complète dans son domaine d’activité.
De plus, cette veille vous apportera aussi de l’inspiration et un discours plus complet/adapté pour chaque projet (quelle méthode/technologie utiliser, de quelle manière, etc.).

Je vous invite à lire l’article sur les indispensables d’une veille efficace en tant que développeur/intégrateur ainsi que celui qui porte sur les outils pour faire sa veille graphique.

Les bonnes pratiques en général

L’expérience nous rend plus efficaces au fil du temps et nous adoptons les bonnes pratiques souvent après une mauvaise expérience. Au cours de votre carrière de développeur, vous apprendrez au fur et à mesure des projets, mais il est bon de connaître d’emblée certaines bonnes pratiques. L’idéal étant de vous retrouver avec votre code, mais aussi de le rendre plus accessible.

Si cet article vous a plu, nous vous invitons à découvrir notre agence wordpress et à télécharger notre livre blanc « Les 11 commandements d’un site internet qui convertit vos visiteurs en clients »