├── .github └── workflows │ └── .gitkeep ├── Makefile ├── README.md ├── assets ├── clang.png ├── formatter.gif ├── tidy-fix.png ├── tidy.png └── vscodejitsu.gif └── dirty.cpp /.github/workflows/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ajnart/workshop-llvm/a0bb5ae70d0bcce50d4944b12f0f6ee957dc4d81/.github/workflows/.gitkeep -------------------------------------------------------------------------------- /Makefile: -------------------------------------------------------------------------------- 1 | all: 2 | $(CXX) dirty.cpp 3 | 4 | clean: 5 | rm dirty.o 6 | rm a.out 7 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Workshop clang tools 2 | 3 | *Ce workshop traite sur l'intégration des outils clang dans vscode. Il peut quand même vous aider à vous familiariser avec les outils qu'offrent la suite clang si vous utilisez un IDE différent.* 4 | 5 | **N'hésitez pas à star ⭐ le repo si vous avez aimé ce workshop!** 6 | 7 | ![](https://img.shields.io/github/stars/ajnart/workshop-llvm?label=%E2%AD%90&style=for-the-badge?branch=master&kill_cache=1") 8 | 9 | Déroulement du workshop: 10 | - Installation des outils nécessaires 11 | - Mise en place de sa propre norme à l'aide de clang-format 12 | - Mise en place du language server clangd avec vscode. 13 | - Utilisation du language server, lint et clang-tidy 14 | - Mise en place d'un CI pour vérifier que son code compile 15 | 16 | ## 0 : Mise en place du workshop en local 17 | 18 | ```sh 19 | git clone git@github.com:ajnart/workshop-llvm.git workshop 20 | cd workshop 21 | ``` 22 | 23 | ## 1 : Installation des outils nécessaires 24 | ### Installation CLANGD 25 | Tout d'abord nous allons installer clangd, à l'aide de la page [d'installation](https://clangd.llvm.org/installation.html) 26 | 27 | *Vous pouvez vérifier l'installation à l'aide de ``clangd --version``* 28 | 29 | Ainsi que l'extension vscode [clangd](https://marketplace.visualstudio.com/items?itemName=llvm-vs-code-extensions.vscode-clangd) ou de [l'extension pour votre IDE](https://clangd.llvm.org/installation.html) 30 | à l'aide de la commande *(ctrl+p)*: 31 | 32 | ``ext install llvm-vs-code-extensions vscode-clangd`` 33 | 34 | ### Installation CLANG-FORMAT 35 | Clang-format devrait être installé depuis le paquet installé dans l'étape précédente, pour le vérifier, faites: ``clang-format --version`` 36 | 37 | ### Installation CLANG-TIDY 38 | Clang-format devait également être installé. 39 | On vérifie ça grâce à: ``clang-tidy --version`` 40 | 41 | ### Installation de Bear 42 | Nous allons également installer [B-ear](https://github.com/rizsotto/Bear) afin de générer une base de donnée de compilation de nos projets. Bear créera un ``compile_commands.json`` qui permettra à clangd de mieux linter votre code. 43 | 44 | 45 | ### Recommandations 46 | L'extension clangd recommande de désinstaller l'extension C/C++ pour ne pas avoir de duplications de recommandations 47 | 48 | ## Mise en place de sa propre norme grâce à Clang-Format 49 | ### Configuration de la norme 50 | Dans cette étape, nous allons générer un fichier .clang-format qui va être utilisé pour dire à ``clang-format`` quelle norme utiliser pour linter vos fichiers. 51 | 52 | Pour se faire, utilisez un [générateur en ligne](https://zed0.co.uk/clang-format-configurator/) 53 | 54 | Sauvegardez votre .clang-format dans le dossier de ce workshop. 55 | 56 | Clang-format va chercher le fichier .clang-format le plus proche du current working directory en remontant récursivement dans vos fichiers. 57 | 58 | ### Installation de la norme 59 | 60 | Maintenant, faites en sorte que l'extension clangd soit le formateur de code par défaut dans vscode: 61 | 62 | > *ctrl+p format document with...* 63 | 64 | > ![formatter](/assets/formatter.gif) 65 | 66 | ou alors en éditant son fichier *settings.json*: 67 | 68 | ```json 69 | "[cpp]": { 70 | "editor.defaultFormatter": "llvm-vs-code-extensions.vscode-clangd" 71 | }, 72 | ``` 73 | Vous devriez maintenant être en mesure de formater votre code à l'aide de votre config .clang-format 74 | 75 | ## Mise en place du language server Clangd 76 | 77 | ### Vérification du fonctionnement de clangd 78 | 79 | ⚠ **Il faut faire la commande `bear -- \build command\` pour créer la base de donnée de compilation pour clangd**. 80 | Dans notre exemple : ``bear -- make`` générera un fichier ``compile_commands.json`` qui sera ensuite utilisé pour linter vos fichiers. 81 | 82 | En mettant votre curseur sur la fonction divide, clangd devrait vous montrer le prototype de la fonction 83 | > ![clang](assets/clang.png) 84 | 85 | ## Clang-tidy 86 | ### Mise en place de clang-tidy 87 | Nous allons maintenant configurer clang-tidy pour avoir des recommandations sur notre code. 88 | 89 | Créer un fichier ``.clang-tidy`` contenant: 90 | 91 | ```yaml 92 | Checks: " 93 | *, 94 | -fuchsia*, 95 | " 96 | ``` 97 | 98 | Cette configuration active tout les checks par défaut, il faut ensuite désactiver manuellement certains checks à la main en rajoutant une ligne sous la forme: ``-\glob\,`` 99 | 100 | Pour voir tout les checks disponibles, rendez vous [ici](https://clang.llvm.org/extra/clang-tidy/checks/list.html) 101 | 102 | ## Utilisation du language server et de clang-tidy 103 | 104 | Comme vous pouvez le voir sur le gif ci-dessous, grâce à clangd il est très facile de régler les erreurs basiques dans votre code : 105 | 106 | > ![jitsu](assets/vscodejitsu.gif) 107 | 108 | En fonction de votre configuration clang-tidyn vous aurez des recommendations affichées dans l'onglet *problems* en bas de la fenêtre vscode: 109 | 110 | > ![code](assets/tidy-fix.png) 111 | 112 | 113 | ## Mise en place d'un CI pour vérifier que son code compile 114 | Nous allons maintenant s'intéresser au dossier ``.github`` pour rajouter des workflows grâce aux [github actions](https://github.com/features/actions) 115 | 116 | Tout d'abord, créer un fichier `CI.yml` pour créer une action il faut que cette action: 117 | 118 | - S'active quand il y a des pushs sur master 119 | - Contienne un job build qui: 120 | - Utilise le [docker epitech](https://github.com/Epitech/epitest-docker) 121 | - Contient une step qui: 122 | - Réalise votre commande de build 123 | 124 | Cette action va maintenant lancer un docker utilisant l'image docker epitech 125 | 126 | *L'indentation de cette liste correspond à l'indentation que vous aurez dans votre fichier yml* 😉 127 | 128 | - - - 129 | J'espère que mon workshop vous a plu. Si vous voulez aller plus loin vous pouvez: 130 | - Mettre en place une action pour vérifier que son code est conforme à sa propre norme 131 | - Faire une action pour vérifier que les tests passent 132 | - Utiliser --html sur gcovr pour créer un fichier .html indiquant le coverage 133 | - Uploader le .html généré par gcovr dans une [github pages](https://pages.github.com/) 134 | - Utiliser un [analyseur de code sémantique](https://www.deepcode.ai/) 135 | - Transformer le résultat de ses [tests gtest en HTML](https://gitlab.uni-koblenz.de/agrt/gtest2html) 136 | 137 | 138 | 139 | *Made with ❤ by [Thomas "Ajnart" Camlong](https://github.com/ajnart)* 140 | -------------------------------------------------------------------------------- /assets/clang.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ajnart/workshop-llvm/a0bb5ae70d0bcce50d4944b12f0f6ee957dc4d81/assets/clang.png -------------------------------------------------------------------------------- /assets/formatter.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ajnart/workshop-llvm/a0bb5ae70d0bcce50d4944b12f0f6ee957dc4d81/assets/formatter.gif -------------------------------------------------------------------------------- /assets/tidy-fix.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ajnart/workshop-llvm/a0bb5ae70d0bcce50d4944b12f0f6ee957dc4d81/assets/tidy-fix.png -------------------------------------------------------------------------------- /assets/tidy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ajnart/workshop-llvm/a0bb5ae70d0bcce50d4944b12f0f6ee957dc4d81/assets/tidy.png -------------------------------------------------------------------------------- /assets/vscodejitsu.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ajnart/workshop-llvm/a0bb5ae70d0bcce50d4944b12f0f6ee957dc4d81/assets/vscodejitsu.gif -------------------------------------------------------------------------------- /dirty.cpp: -------------------------------------------------------------------------------- 1 | int divide(int x ,int y) 2 | { return (((x/ y ))); 3 | } 4 | 5 | 6 | int main(int argc, char const *argv[]) { 7 | 8 | divide(3, 0); 9 | std::cout << "Hello, world!" << std::enl 10 | return 0; } 11 | --------------------------------------------------------------------------------