Git : Initialisation et premier commit

Avant-propos

J'ai initié la rédaction de ce billet le 11 juin 2014 ! Le 18 décembre 2014, j'annonçais d'ailleurs sa publication à venir. Depuis quatre années, il traîne donc lamentablement dans mes brouillons. À plusieurs reprises, j'ai tenté de le finaliser mais, de l'eau ayant coulé sous les ponts, je me posais des questions sur la pertinence d'un tel billet "outdated". Vu qu'il était en grande partie écrit et même s'il pourra paraître trop simpliste, j'ai tout de même décidé de le publier. Il s'agit plus d'un billet de présentation des bases de git que d'un tuto à suivre au pied de la lettre mais peut-être que ces quelques lignes vous permettront de mettre le pied à l'étrier. Bien entendu, si vous avez des questions, n'hésitez pas à les poser en commentaire ou via le formulaire de contact.

 

Prérequis

Bien entendu, je pars du principe votre stack de développement est en place et que git et ssh sont opérationnels.

 

Grille de lecture

  • sur fond bleu, le code à taper dans votre invite de commande local
  • sur fond vert, le code à taper dans l'invite de commande sur le serveur distant
Serveur local Serveur distant

Lire la suite de Git : Initialisation et premier commit

Visual Studio Code : configurer PHP-CS-Fixer

Logo Visual Studio Code

Il y a peu, j'ai réinstallé mon poste de travail. Gros boulet que je suis, j'ai oublié de conserver une copie des fichiers de configuration de l'extension php cs fixer de Visual Studio Code. Je profite donc de refaire la configuration pour rédiger ce petit billet qui me servira de mémo à l'avenir. Et qui sait, peut-être que ces quelques lignes pourront être utiles à certains d'entre vous. :P

 

PHP CS Fixer ?

PHP CS Fixer (PHP Coding Standards Fixer) vous permet de formater votre code automatiquement selon les standards de programmation (PSR-1, PSR-2, etc.) voire d'appliquer des directives spécifiques à vos développements.

 

Installation de l'extension

Ajouter l'extension php cs fixer de junstyle à Visual Studio Code.

 

Téléchargement de php-cs-fixer-v2.phar

Pour que cette extension fonctionne, il faut "installer" Php CS Fixer. Pour ce faire, télécharger le fichier php-cs-fixer-v2.phar sur gitHub : https://github.com/FriendsOfPHP/PHP-CS-Fixer#installation

Placez ce fichier dans votre répertoire php. Pour ma part, mon répertoire se trouve à la racine : c:/php/

 

Le fichier de configuration

Il faut maintenant créer un fichier explicitant vos règles de formatage des fichiers. Personnellement, je l'ai nommé vscode.php_cs et configuré comme suit :

return PhpCsFixer\Config::create() ->setRules([
    '@PSR2' => true,
    'array_syntax' => ['syntax' => 'short'],
    'combine_consecutive_unsets' => true,
    'method_separation' => true,
    'no_multiline_whitespace_before_semicolons' => true,
    'single_quote' => true,
    'binary_operator_spaces' => [
        'align_double_arrow' => true,
        'align_equals' => false
    ],
    'blank_line_after_opening_tag' => true,
    'blank_line_before_return' => true,
    'braces' => [
        'allow_single_line_closure' => true
    ],
    'concat_space' => ['spacing' => 'one'],
    'declare_equal_normalize' => true,
    'function_typehint_space' => true,
    'hash_to_slash_comment' => true,
    'include' => true,
    'lowercase_cast' => true,
    'no_extra_consecutive_blank_lines' => [
        'curly_brace_block',
        'extra',
        'parenthesis_brace_block',
        'square_brace_block',
        'throw',
        'use',
    ],
    'no_multiline_whitespace_around_double_arrow' => true,
    'nospaces_around_offset' => true,
    'no_whitespace_before_comma_in_array' => true,
    'no_whitespace_in_blank_line' => true,
    'object_operator_without_whitespace' => true,
    'single_blank_line_before_namespace' => true,
    'ternary_operator_spaces' => true,
    'trim_array_spaces' => true,
    'unary_operator_spaces' => true,
    'whitespace_after_comma_in_array' => true,
])
->setLineEnding("\r\n")
->setUsingCache(false);

Je ne vous détaille pas les règles car elles sont relativement explicites. :) Vous trouverez leurs détails ici : https://github.com/FriendsOfPHP/PHP-CS-Fixer

Personnellement, j'ai placé ce fichier dans le répertoire de php : c:/php/

 

Configuration de Visual Studio Code

Enfin, indiquez les chemins (path) de vos deux fichiers php-cs-fixer-v2.phar et vscode.php_cs dans les paramètres de Visual Studio Code :

"php-cs-fixer.executablePath": "C:\\php\\php-cs-fixer-v2.phar",
"php-cs-fixer.config": "C:\\php\\vscode.php_cs",

Pour formater votre code, il vous suffit maintenant de presser les touches Alt + Maj + F (raccourcis par défaut sous Windows).

 

Et le tour est joué ! ^^

Visual Studio Code : debugger / déboguer une extension ?

Logo Visual Studio Code

 

Il y a peu de temps, j'ai mis à jour mon stack de programmation : Wampserver / Node / php-cs-fixer / etc.

Malheureusement, cela ne fut pas sans conséquence : je me suis rapidement rendu compte qu'une extension ne fonctionnait plus correctement dans Visual Studio Code : php cs fixer. J'avais pourtant fait attention à bien remettre en place tous les fichiers de config de php cs fixer lors de ma mise à jour.

J'ai mis quelques heures à trouver la cause du problème donc je vous partage ici une méthode pour deboguer une extension.

Première chose à faire, activez les outils de développement :

Menu Visual Studio Code, rubrique Aide

 

Rendez vous ensuite sur l'onglet "Console". Une fois la console de déboguage ouverte, lancez la commande exécutant votre extension, cela vous permettra d'identifier la source du problème.

Pour ma part, j'ai appliqué le raccourci clavier exécutant la commande php-cs-fixer.phar (Alt + Maj + F). Le résultat ne s'est pas fait attendre :

ERR Bad argument : TypeError: Bad argument
    at ChildProcess.spawn (internal/child_process.js:294:26)
    at Object.exports.spawn (child_process.js:390:9)
    at PHPCSFixer.format (...)


L'erreur est beaucoup plus longue mais ça n'a pas d'intérêt de vous l'afficher en entier. Bad argument ? php-cs-fixer.phar étant lancé par la commande php.exe, je me suis rendu dans les paramètres de Visual Studio Code pour vérifier que tout était d'équerre du côté définition de php. J'ai rapidement identifié qu'il me manquait un paramètre, et pas des moindres : le chemin vers php.exe !

J'ai donc simplement ajouté :

"php.validate.executablePath": "C:\\path\\to\\php_version\\php.exe",

 

Et le tour est joué ! Pourquoi ce paramètre avait disparu suite à la mise à jour de mon stack ? Je ne saurais le dire. :(

Quoiqu'il en soit, si vous avez un problème avec Visual Studio Code, pensez à activer les outils de développement. :)

Ma logithèque pour développer en PHP sous Windows

Suite à la lecture du billet de Nicolas Hachet intitulé "Quels outils pour développer en PHP sous Windows ?", j'ai eu envie de faire, moi aussi, le tour de mon environnement de développement.

 

Stack

WampServer

Je vous l'accorde, rien de bien original. À mes débuts, j'installais Apache, MySQL et PHP l'un après l'autre mais je trouvais ça fastidieux. Surtout qu'à cette époque (début des années 2000), il m'arrivait bien souvent de réinstaller Windows. Par la suite, j'ai découvert EasyPhp que j'ai utilisé pendant un certain temps. Je ne me souviens plus de la raison qui m'a poussé à tester WampServer à l'époque mais en tout cas, je ne suis jamais revenu en arrière. Apache, MySQL et PHP installés et prêts à l'emploi en moins de 10 minutes, que demander de plus ? Simple et efficace.

 

Programmation

Cmder

Je vous l'avais déjà présenté en mars 2015. Elle reste ma Console de prédiléction bien que j'ai tendance à utiliser de plus en plus celle intégrée à Visual Studio Code.

 

Visual Studio Code

Visual Studio Code est mon nouvel IDE de coeur. Après des années sur Netbeans, j'ai enfin trouvé un IDE puissant et eye-candy. Netbeans est puissant lui aussi, mais je me suis lassé de son interface old-school ! Cerise sur le gâteau, Visual Studio Code est beaucoup moins gourmand en ressources que Netbeans.

 

Notepad2

Beaucoup utilise Notepad++ pour l'édition rapide de script. Personnellement, j'ai choisi Notepad2 qui est, certes vieillissant et non maintenu depuis 2012, mais qui n'en reste pas moins une solution hyper légère. En plus, il est "livré" avec TortoiseGit alors pourquoi s'en priver. J'ai bien essayé de passer à Notepad++, mais je le trouve beaucoup trop "lourd" pour de l'édition simple et rapide.

 

TortoiseGIT

Je suis un grand fan du système de gestion de versions Git. TortoiseGit permet (entre autre) d'afficher l'état d'un fichier par superposition d'icône dans l'explorateur de fichier de Windows et y ajoute également un menu contextuel pour Git. Bref, un must-have pour les utilisateurs de Git.

 

Base de données

MySQL Workbench

Pendant de nombreuses années, je me suis contenté de PHPMyAdmin. Je le trouvais cependant trop peu ergonomique et trop peu pratique. MySQL Workbench me semble plus adapté et permet de faire énormément de chose, de la simple requête au reverse engineering d'une base de données. Bref, l'essayer c'est l'adopter.

 

SQL Server Management Studio

Rapide raccourci qui risque d'en faire hurler plus d'un ^^ : SQL Server Management Studio est le MySQL Workbench pour SQL Server.

 

Accès distants

Windows Connexion Bureau à distance

Pour le coup, j'utilise l'application native de Windows pour la prise en main à distance de Windows Server. Elle fait le job donc...

 

Filezilla

Inutile d'entrer dans les détails, je pense que tout le monde connaît l'indétrônable client FTP ? Je utilise FileZilla depuis toujours.

 

Navigation et test

Edge, Firefox, Chrome

Edge en première position ? Non, ce n'est pas une erreur. Pendant de longues années, je n'utilisais que Firefox pour la navigation et le développement. A la sortie de Windows 10, j'ai commencé à utiliser Edge sporadiquement car je le trouvais plus rapide et plus eye-candy. Petit à petit, Edge est devenu mon navigateur par défaut. Je continue cependant à utiliser Firefox en navigateur secondaire. Quant à Chrome, je ne l'utilise qu'à des fins de test. En effet, je n'ai jamais aimé ce navigateur. Les goûts et les couleurs... De temps en temps, j'utilise également Vivaldi mais c'est relativement rare.

 

Bureautique et organisation

Microsoft Office 2013

Ne nous leurrons pas : Microsoft Office reste LA référence en matière de suite bureautique. Si dans un cadre privé je recommande chaudement LibreOffice, j'avoue que dans un cadre professionnel, je ne pourrais pas me passer de la suite de Microsoft.

 

OneNote

OneNote est la pierre angulaire de mon organisation. Il m'est réellement indispensable. J'utilise énormément cet outil pour prendre des notes pendant mes développements. Synchronisé automatiquement sur tous mes postes, je retrouve mes notes sur tous mes appareils. Il me permet de structurer mes idées. C'est un outil que j'utilise également à titre personnel. D'ailleurs, la plupart des billets que vous lirez sur ce blog sont initialement rédigés dans OneNote. C'est d'ailleurs mon principal frein à un retour sur GNU/Linux...

 

Redmine

Redmine est un bug-tracker complet et relativement user-friendly. J'en avais tester quelques autres avant d'opter pour cet outil mais je ne les trouvais pas très accessibles aux utilisateurs non informaticiens. Après quelques années d'utilisation, je ne peux que vous recommander chaudement cet outil.

 

Conclusion

Ces différents outils sont ce que je pourrais appeler "mes indispensables". D'ailleurs, si je compare ma logithèque actuel à celle que je vous présentais en octobre 2015, je constate que mise à part mon passage de Netbeans à Visual Studio Code, j'utilise toujours les mêmes outils. :)

Visual Studio Code : personnalisation et extensions indispensables

J'utilise désormais Visual Studio Code (VSCode) au quotidien. Cet IDE est assez complet mais nécessite tout de même quelques extensions pour être confortable dans le cadre de développements PHP.

Logo Visual Studio Code

 

Voici un rapide tour d'horizon des extensions qui me sont aujourd'hui indispensables :

  • Beautify : auto-format le code : Javascript, JSON, CSS, Sass et HTML
  • Better Merge : améliore nettement l'affichage des "merge conflict" (Git)
  • Close Unmodified : permet de fermer les fichiers n'ayant pas été modifiés (Git)
  • minify : supprime les espaces, les retours chariots des fichiers Javascript, Css et Html. Pour ma part, je ne l'utilise pas pour l'Html
  • php cs fixer : auto-format du code PHP
  • TWIG pack : support du format de fichier TWIG. J'ai hésité à mettre cette extension dans cette liste car elle est relatviement catastrophique. L'auto-format des fichiers Twig est catastrophique, voire inutilisable. Je la garde simplement pour la coloration syntaxique qui, elle aussi, est loin d'être aboutie. Pour le moment, je n'ai pas trouvé d'extension vraiment opérationnelle pour le support de Twig.
  • VS Color Picker : permet de sélectionner une couleur depuis une palette dans les fichiers CSS
  • vscode-icons : ajoute des icônes dans l'explorateur de fichiers

 

Concernant la personnalisation de l'outil, j'avoue ne pas l'avoir beaucoup poussé :

{
"editor.fontSize": 12, // Défini la taille de police
"workbench.colorTheme": "Monokai", // Thème dark Monokai
"workbench.welcome.enabled": false, // Désactive l'écran de bienvenue
"editor.wordWrap": "on", // Active le retour à la ligne du texte
"terminal.integrated.fontSize": 13, // Défini la taille de police du Terminal intégré
"workbench.iconTheme": "vscode-icons", // Affiche des icônes dans l'explorateur de fichiers
"editor.renderControlCharacters": true, // Affiche les caractères de contrôle
"editor.renderWhitespace": "all", // Affiche les espaces dans l'éditeur
"editor.renderIndentGuides": true, // Affiche les guides d'indentation
"minify.minifyExistingOnSave": true, // Minifie les fichiers à l'enregistrement (Minify)
"editor.minimap.enabled": true, // Affiche un "minimap" de l'éditeur
"php-cs-fixer.executablePath": "C:\\wamp\\bin\\php\\php-cs-fixer.phar", // Config. Php CS FIXER
"php-cs-fixer.config": "C:\\wamp\\bin\\php\\vscode.php_cs", // Config. Php CS FIXER
"window.title": "${dirty}${activeEditorMedium}${separator}${rootName}${separator}${appName}", // Config. titre fenêtre (Chermin du fichier - projet - Visual Studio Code)
"terminal.external.windowsExec": "C:\\cmder\\Cmder.exe", // Défini le Terminal externe
"files.exclude": { // Fichiers exclus lors des recherches / remplacements
"**/.git": true,
"**/.svn": true,
"**/.hg": true,
"**/.DS_Store": true,
"**/vendor": true
},
"explorer.openEditors.visible": 20 // Nombre de fichiers affichés dans la liste des éditeurs ouverts
}

 

Si vous avez des conseils pour optimiser VSCode, n'hésitez pas... je suis tout ouïe ^^