Clangd set-up tutorial

Author: lukstep

README.md

@@ -40,9 +40,13 @@ docker run -d -it --name pico-sdk --mount type=bind,source=${PWD},target=/home/d
 docker exec -it pico-sdk /bin/sh
 ```
 
-## Attach VSCode to running container
+## Visual Studio Code as Rassberry Pi PICO projects IDE
 
-You can use the SDK container with Visual Studio Code, follow the instruction below:
+You can use the SDK container with Visual Studio Code as Raspberry Pi Pico projects IDE. 
+
+### Attaching VSCode to SDK Docker container
+
+Follow the instruction below to set up VSCode:
 
 1. Install [Visual Studio Code](https://code.visualstudio.com) and next [Remote Development](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.vscode-remote-extensionpack) extensions.
 
@@ -60,22 +64,78 @@ docker exec -it pico-sdk /bin/sh
 
 4. Click the green button in the lower left corner of VSCode and select options: Attach to Running Container...
 
-![imag-2](https://user-images.githubusercontent.com/20487002/201382466-0204a11c-8487-4da5-8a3c-2c9cc233333c.png)
+![image-2](https://user-images.githubusercontent.com/20487002/201382466-0204a11c-8487-4da5-8a3c-2c9cc233333c.png)
 
-![imag-3](https://user-images.githubusercontent.com/20487002/201382561-41e4c75e-3424-4c50-99ac-f6bc76ec6892.png)
+![image-3](https://user-images.githubusercontent.com/20487002/201382561-41e4c75e-3424-4c50-99ac-f6bc76ec6892.png)
 
 5. Select the SDK container.
 
-![imag-4](https://user-images.githubusercontent.com/20487002/201383009-54a3fc62-1206-4105-83d0-d956448434dd.png)
+![image-4](https://user-images.githubusercontent.com/20487002/201383009-54a3fc62-1206-4105-83d0-d956448434dd.png)
 
 6. Then a new VSCode window will open. At the bottom window, you can see that it is attached to the SDK container.
 
-![imag-5](https://user-images.githubusercontent.com/20487002/201383452-10573842-de2a-46c3-9ebf-f6fd5f06c687.png)
+![image-5](https://user-images.githubusercontent.com/20487002/201383452-10573842-de2a-46c3-9ebf-f6fd5f06c687.png)
 
 7. Now, there is needed to open project files. Your project is mounted to `/home/dev` in the container. Go to EXPLORE tab in VSCode and click Open Folder. In opened window write `/home/dev` and click the OK button.
 
-![imag-6](https://user-images.githubusercontent.com/20487002/201386202-dd0934b2-5fae-4a2d-8875-f2cb40b1dc59.png)
+![image-6](https://user-images.githubusercontent.com/20487002/201386202-dd0934b2-5fae-4a2d-8875-f2cb40b1dc59.png)
 
 8. Now You can explore, develop and build your Raspberry Pi Pico project via Visual Studio Code!
 
-![imag-7](https://user-images.githubusercontent.com/20487002/201389505-d1346622-a8e1-4d0b-842c-57e5b54f9183.png)
+![image-7](https://user-images.githubusercontent.com/20487002/201389505-d1346622-a8e1-4d0b-842c-57e5b54f9183.png)
+
+### Pico SDK aware Intellisense
+
+For an IntelliSense that will be aware of Raspberry Pi Pico SDK dependencies, we will use [Clangd](https://clangd.llvm.org). Clangd is a language server provided by the LLVM project. To Setup Clang as Intellisense engine follow instruction below:
+
+1. To begin with, you need to install the server itself (Clangd is not installed by default in the SDK container image), to do this in the terminal call the command:
+
+```
+apk add clang-extra-tools
+```
+
+2. Next is needed to install the Visual Studio Code [Clangd extension](https://marketplace.visualstudio.com/items?itemName=llvm-vs-code-extensions.vscode-clangd).
+
+![image-1](https://user-images.githubusercontent.com/20487002/201468256-be7741a2-9092-406a-8be1-d4d9640a85e7.png)
+
+1. To set-up The Clangd extension, in the project root directory, create folder .vcode with file settings.json. To settings.json past configuration from the snippet below:
+
+```json
+{
+    "C_Cpp.intelliSenseEngine": "Disabled",
+    "clangd.path": "/usr/bin/clangd",
+    "clangd.checkUpdates": false,
+    "clangd.restartAfterCrash": true,
+    "clangd.detectExtensionConflicts": true,
+    "clangd.arguments": ["-log=verbose", 
+                         "-pretty", 
+                         "--background-index", 
+                         "--query-driver=/usr/bin/arm-none-eabi-gcc",
+                         "--compile-commands-dir=/home/dev/build"]
+}
+```
+
+![image-2](https://user-images.githubusercontent.com/20487002/201468479-7de7e598-3aac-4fe4-a240-d7404200a0a6.png)
+
+
+4. For clangd to work, it needs a `compile_commands.json` file. This file contains the compilation and dependency information of each file in the project. To create it you need to add to the CMake command, `-DCMAKE_EXPORT_COMPILE_COMMANDS=1`.  So You need to build your project with the command:
+
+```
+mkdir build
+
+cd build 
+
+cmake -DCMAKE_EXPORT_COMPILE_COMMANDS=1 .. 
+
+make
+```
+
+5. Now IntelliSense should work!. Now you should see a prompt when you start typing. If you hover your cursor over a function from the SDK you should see its documentation, You can go to the function definition by pressing F12.
+
+![image-3](https://user-images.githubusercontent.com/20487002/201468773-61b77d65-3a9b-4e18-b5f1-a294e1ad0ec3.png)
+
+![image-4](https://user-images.githubusercontent.com/20487002/201468782-50fc6abb-1f82-49d5-8b93-631dd30f1f58.png)
+
+![image-5](https://user-images.githubusercontent.com/20487002/201468813-2ef7b04f-ede6-46cb-84e2-a40db595811d.png)
+
+