--- description: Explains how to find a Kitematic issue keywords: Kitematic, open source, contribute, contributor, tour, development title: Develop in Kitematic (work on an issue) --- For this tutorial, we will work on issue #1191 which is a request to display the container ID in Kitematic for easy identification. (Currently, Kitematic shows the container name but not the ID.) To do this, edit the container `General Settings` layout. 1. Open the project in your favorite editor - We recommend using Atom as it's a full featured editor with great ES lint support to keep your code organized. 2. Open the `ContainerSettingsGeneral.react.js` file which is found under the `src/components/` folder and look for the following piece of code, which is in fact the layout (like HTML in the browser) circa line ~200: ``` return (
... ``` 3. Above this code we will create a javascript variable that will allow us to display our container ID: ``` let shortId = (

Container Id

); ``` This snippet has been saved as a GitHub gist. 4. We then need to add the variable to the rendered view, by adding it below the `{rename}` tag. The new render code should look something like: ``` return (
{rename} {shortId} ``` At this point, the updated code should look similar to this: ![Javascript to display container id in kitematic](images/settings-code-example.png) 5. Save the code changes, and restart Kitematic. ``` $ npm start ``` Now, the container ID should show on the General Settings tab, along with the container name. ![Container ID](images/kitematic_gui_container_id.png) *Note that the container ID in Kitematic matches the ID shown as output to the `docker ps` command.* 6. You can close the Kitematic application now, and kill the running process in the terminal via Ctrl+C. 7. Stage your changes by adding them. ``` $ git add src/components/ContainerSettingsGeneral.react.js ``` 8. Commit your code changes with a comment that explains what this fixes or closes. ``` $ git commit -s -m "added container ID to show on settings tab, fixes issue #1191" ``` (See Coding Style in the general guidelines on Contributing to Docker.) ## Where to go next At this point, you are ready to [Review your branch and create a pull request](create_pr.md) to merge your new feature into Kitematic.